|
1 | | -<!DOCTYPE html> |
| 1 | +<!-- |
| 2 | + Polymiddleware does not support request modification. |
| 3 | +
|
| 4 | + Thus, modified `renderAttachment()` from legacy activity middleware is not honored. |
| 5 | +
|
| 6 | + This test is testing against "modified attachmentRenderer", thus it is failing. |
| 7 | +
|
| 8 | + Polymiddleware could support modified attachment polymiddleware when we finish the following work: |
| 9 | +
|
| 10 | + - Upgrade to attachment polymiddleware |
| 11 | + - Support cascaded polymiddleware |
| 12 | + - Today, polymiddleware are set in <APIComposer>, cascading means we need 2 x <APIComposer> |
| 13 | + - Tomorrow, we should allow cascading through <ThemeProvider polymiddleware={}> |
| 14 | + - That also means, default poly/middleware should be materialized in <ThemeProvider>, instead of <APIComposer> |
| 15 | +--> |
| 16 | +<!doctype html> |
2 | 17 | <html lang="en-US"> |
3 | 18 | <head> |
4 | 19 | <link href="/assets/index.css" rel="stylesheet" type="text/css" /> |
|
32 | 47 | run(async function () { |
33 | 48 | await host.windowSize(undefined, 1280, document.getElementById('webchat')); |
34 | 49 |
|
35 | | - const activityMiddleware = () => next => (...renderActivityArgs) => { |
36 | | - const [{ activity }] = renderActivityArgs; |
| 50 | + const activityMiddleware = |
| 51 | + () => |
| 52 | + next => |
| 53 | + (...renderActivityArgs) => { |
| 54 | + const [{ activity }] = renderActivityArgs; |
37 | 55 |
|
38 | | - const renderActivity = next(...renderActivityArgs); |
| 56 | + const renderActivity = next(...renderActivityArgs); |
39 | 57 |
|
40 | | - if (/^1/.test(activity.id)) { |
41 | | - return (children, ...renderAttachmentArgs) => ( |
42 | | - <div className="decorated-activity"> |
43 | | - {renderActivity( |
44 | | - (...renderAttachmentArgs) => ( |
45 | | - <div className="decorated-attachment">{children(...renderAttachmentArgs)}</div> |
46 | | - ), |
| 58 | + if (/^1/.test(activity.id)) { |
| 59 | + return (children, ...renderAttachmentArgs) => ( |
| 60 | + <div className="decorated-activity"> |
| 61 | + {renderActivity( |
| 62 | + (...renderAttachmentArgs) => ( |
| 63 | + <div className="decorated-attachment">{children(...renderAttachmentArgs)}</div> |
| 64 | + ), |
| 65 | + ...renderActivityArgs |
| 66 | + )} |
| 67 | + </div> |
| 68 | + ); |
| 69 | + } else if (/^2/.test(activity.id)) { |
| 70 | + return (children, ...renderAttachmentArgs) => |
| 71 | + renderActivity( |
| 72 | + (...renderAttachmentArgs) => { |
| 73 | + const [firstArg] = renderAttachmentArgs; |
| 74 | + const { |
| 75 | + attachment, |
| 76 | + attachment: { contentType } |
| 77 | + } = firstArg; |
| 78 | + |
| 79 | + if (/^image\//.test(contentType)) { |
| 80 | + return ( |
| 81 | + <figure className="attachment-figure"> |
| 82 | + {children(...renderAttachmentArgs)} |
| 83 | + <figcaption className="attachment-figure-caption"> |
| 84 | + {children( |
| 85 | + { |
| 86 | + ...firstArg, |
| 87 | + attachment: { |
| 88 | + ...attachment, |
| 89 | + contentType: 'application/octet-stream' |
| 90 | + } |
| 91 | + }, |
| 92 | + ...renderAttachmentArgs |
| 93 | + )} |
| 94 | + </figcaption> |
| 95 | + </figure> |
| 96 | + ); |
| 97 | + } |
| 98 | + |
| 99 | + return children(...renderAttachmentArgs); |
| 100 | + }, |
47 | 101 | ...renderActivityArgs |
48 | | - )} |
49 | | - </div> |
50 | | - ); |
51 | | - } else if (/^2/.test(activity.id)) { |
52 | | - return (children, ...renderAttachmentArgs) => |
53 | | - renderActivity((...renderAttachmentArgs) => { |
54 | | - const [firstArg] = renderAttachmentArgs; |
55 | | - const { |
56 | | - attachment, |
57 | | - attachment: { contentType } |
58 | | - } = firstArg; |
59 | | - |
60 | | - if (/^image\//.test(contentType)) { |
61 | | - return ( |
62 | | - <figure className="attachment-figure"> |
63 | | - {children(...renderAttachmentArgs)} |
64 | | - <figcaption className="attachment-figure-caption"> |
65 | | - {children( |
66 | | - { |
67 | | - ...firstArg, |
68 | | - attachment: { |
69 | | - ...attachment, |
70 | | - contentType: 'application/octet-stream' |
71 | | - } |
72 | | - }, |
73 | | - ...renderAttachmentArgs |
74 | | - )} |
75 | | - </figcaption> |
76 | | - </figure> |
77 | | - ); |
78 | | - } |
79 | | - |
80 | | - return children(...renderAttachmentArgs); |
81 | | - }, ...renderActivityArgs); |
82 | | - } |
83 | | - |
84 | | - return renderActivity; |
85 | | - }; |
| 102 | + ); |
| 103 | + } |
| 104 | + |
| 105 | + return renderActivity; |
| 106 | + }; |
86 | 107 |
|
87 | 108 | WebChat.renderWebChat( |
88 | 109 | { |
|
106 | 127 | role: 'bot' |
107 | 128 | }, |
108 | 129 | id: '1.0', |
109 | | - text: |
110 | | - 'Decorating activity of **carousel layout**. Also decorate attachment without using attachment middleware.', |
| 130 | + text: 'Decorating activity of **carousel layout**. Also decorate attachment without using attachment middleware.', |
111 | 131 | timestamp: 0, |
112 | 132 | type: 'message' |
113 | 133 | }, |
|
123 | 143 | role: 'bot' |
124 | 144 | }, |
125 | 145 | id: '1.1', |
126 | | - text: |
127 | | - 'Decorating activity of **stacked layout**. Also decorate attachment without using attachment middleware.', |
| 146 | + text: 'Decorating activity of **stacked layout**. Also decorate attachment without using attachment middleware.', |
128 | 147 | timestamp: 0, |
129 | 148 | type: 'message' |
130 | 149 | }, |
|
0 commit comments