@capillarytech/creatives-library 7.17.35 → 7.17.37-alpha.0

package/v2Containers/Templates/tests/__snapshots__/index.test.js.snap

@@ -12,6 +12,41 @@ exports[`Test Templates container Should render correct component for whatsapp c
 </CapSpin>
 `;
 
+exports[`Test Templates container Should render correct component for zalo channel 1`] = `
+<CapSpin
+  spinning={false}
+>
+  <div
+    style={
+      Object {
+        "overflowX": "auto",
+        "paddingBottom": "1.142rem",
+      }
+    }
+  >
+    <CapHeader
+      className="select-account-header"
+      description="Choose the account to send content"
+      descriptionClass=""
+      inline={false}
+      size="regular"
+      title="Zalo account"
+      titleClass=""
+    />
+    <CapRadioCard
+      cardHeight="48px"
+      cardWidth="276px"
+      className="select-account"
+      defaultValue=""
+      onChange={[Function]}
+      panes={Array []}
+      selected=""
+      size="small"
+    />
+  </div>
+</CapSpin>
+`;
+
 exports[`Test Templates container Should render illustration when no templates are passed 1`] = `
 <CapSpin
   spinning={false}
@@ -24,6 +59,382 @@ exports[`Test Templates container Should render illustration when no templates a
 </CapSpin>
 `;
 
+exports[`Test Templates container Should render illustration when no templates are passed 2`] = `
+<CapSpin
+  spinning={false}
+>
+  <FormattedMessage
+    defaultMessage="Zalo accounts are not setup for your brand"
+    id="creatives.containersV2.Templates.noAccountsPresentZalo"
+    values={Object {}}
+  />
+</CapSpin>
+`;
+
+exports[`Test Templates container Should render temlates when Zalo templates are passed in full mode 1`] = `
+<Fragment>
+  <div
+    className="creatives-templates-list full-mode"
+  >
+    <input
+      accept=".zip, .html, .htm"
+      id="filename"
+      onChange={[Function]}
+      style={
+        Object {
+          "display": "none",
+        }
+      }
+      type="file"
+    />
+    <CapRow>
+      <Pagination
+        onPageChange={[Function]}
+        paginationContainer="pagination-container"
+        paginationSelector="pagination-container"
+      >
+        <div>
+          <div
+            className="action-container"
+          >
+            <_class
+              className="search-text"
+              disabled={false}
+              labelPosition="top"
+              onChange={[Function]}
+              onClear={[Function]}
+              onScroll={[Function]}
+              placeholder="Search"
+              style={
+                Object {
+                  "width": "210px",
+                }
+              }
+              value=""
+            />
+            <div
+              className="zalo-filters"
+            >
+              <CapSelectFilter
+                data={
+                  Array [
+                    Object {
+                      "key": "enable",
+                      "label": <FormattedMessage
+                        defaultMessage="Enable"
+                        id="creatives.containersV2.zalo.ENABLE_STATUS"
+                        values={Object {}}
+                      />,
+                      "value": "ENABLE",
+                    },
+                    Object {
+                      "key": "reject",
+                      "label": <FormattedMessage
+                        defaultMessage="Reject"
+                        id="creatives.containersV2.zalo.REJECT_STATUS"
+                        values={Object {}}
+                      />,
+                      "value": "REJECT",
+                    },
+                    Object {
+                      "key": "disable",
+                      "label": <FormattedMessage
+                        defaultMessage="Disable"
+                        id="creatives.containersV2.zalo.DISABLE_STATUS"
+                        values={Object {}}
+                      />,
+                      "value": "DISABLE",
+                    },
+                    Object {
+                      "key": "reviewPending",
+                      "label": <FormattedMessage
+                        defaultMessage="Review Pending"
+                        id="creatives.containersV2.zalo.PENDING_REVIEW_STATUS"
+                        values={Object {}}
+                      />,
+                      "value": "PENDING_REVIEW",
+                    },
+                  ]
+                }
+                dropdownMaxHeight="320px"
+                dropdownWidth="228px"
+                onSelect={[Function]}
+                placeholder="Status"
+                placement="bottomLeft"
+                selectedValue=""
+                width="90px"
+              />
+            </div>
+            <Component />
+            <Component />
+            <div
+              style={
+                Object {
+                  "alignItems": "center",
+                  "display": "flex",
+                  "justifyContent": "space-between",
+                }
+              }
+            />
+          </div>
+          <CapRow
+            align="middle"
+            className="selected-whatsapp-filters"
+            type="flex"
+          />
+          <CapSpin
+            spinning={false}
+            style={
+              Object {
+                "width": "100%",
+              }
+            }
+            tip="Getting all templates..."
+          >
+            <div>
+              <div
+                className="pagination-container"
+              >
+                <CapCustomCardList
+                  cardList={
+                    Array [
+                      Object {
+                        "content": <CapLabel
+                          className="zalo-listing-content desc"
+                          type="label19"
+                        >
+                          Test1
+                        </CapLabel>,
+                        "extra": Array [
+                          <CapTooltip
+                            title="Open preview in new tab"
+                          >
+                            <CapIcon
+                              className="view-zalo"
+                              onClick={[Function]}
+                              style={
+                                Object {
+                                  "marginRight": "16px",
+                                }
+                              }
+                              type="eye"
+                            />
+                          </CapTooltip>,
+                          <CapDropdown
+                            overlay={
+                              <CapMenu>
+                                <withItemHOC
+                                  className="duplicate-zalo"
+                                  onClick={[Function]}
+                                >
+                                  <FormattedMessage
+                                    defaultMessage="Duplicate"
+                                    id="creatives.containersV2.Templates.duplicateButton"
+                                    values={Object {}}
+                                  />
+                                </withItemHOC>
+                                <withItemHOC
+                                  className="delete-zalo"
+                                  onClick={[Function]}
+                                >
+                                  <FormattedMessage
+                                    defaultMessage="Delete"
+                                    id="creatives.containersV2.Templates.deleteButton"
+                                    values={Object {}}
+                                  />
+                                </withItemHOC>
+                              </CapMenu>
+                            }
+                          >
+                            <React.Fragment />
+                          </CapDropdown>,
+                        ],
+                        "hoverOption": <CapButton
+                          className="edit-zalo"
+                          isAddBtn={false}
+                          onClick={[Function]}
+                          type="primary"
+                        >
+                          Overview
+                        </CapButton>,
+                        "key": "ZALO-card-Test1",
+                        "title": <CapRow>
+                          <CapLabel
+                            className="zalo-template-name"
+                            type="label1"
+                          >
+                            
+                          </CapLabel>
+                          <CapRow
+                            align="middle"
+                            className="zalo-status-container"
+                            type="flex"
+                          >
+                            <CapStatus
+                              color=""
+                              height="0.571rem"
+                              labelType="label3"
+                              text=""
+                              type="pending"
+                              width="0.571rem"
+                            />
+                          </CapRow>
+                        </CapRow>,
+                      },
+                      Object {
+                        "content": <CapLabel
+                          className="zalo-listing-content desc"
+                          type="label19"
+                        >
+                          Test2
+                        </CapLabel>,
+                        "extra": Array [
+                          <CapTooltip
+                            title="Open preview in new tab"
+                          >
+                            <CapIcon
+                              className="view-zalo"
+                              onClick={[Function]}
+                              style={
+                                Object {
+                                  "marginRight": "16px",
+                                }
+                              }
+                              type="eye"
+                            />
+                          </CapTooltip>,
+                          <CapDropdown
+                            overlay={
+                              <CapMenu>
+                                <withItemHOC
+                                  className="duplicate-zalo"
+                                  onClick={[Function]}
+                                >
+                                  <FormattedMessage
+                                    defaultMessage="Duplicate"
+                                    id="creatives.containersV2.Templates.duplicateButton"
+                                    values={Object {}}
+                                  />
+                                </withItemHOC>
+                                <withItemHOC
+                                  className="delete-zalo"
+                                  onClick={[Function]}
+                                >
+                                  <FormattedMessage
+                                    defaultMessage="Delete"
+                                    id="creatives.containersV2.Templates.deleteButton"
+                                    values={Object {}}
+                                  />
+                                </withItemHOC>
+                              </CapMenu>
+                            }
+                          >
+                            <React.Fragment />
+                          </CapDropdown>,
+                        ],
+                        "hoverOption": <CapButton
+                          className="edit-zalo"
+                          isAddBtn={false}
+                          onClick={[Function]}
+                          type="primary"
+                        >
+                          Overview
+                        </CapButton>,
+                        "key": "ZALO-card-Test2",
+                        "title": <CapRow>
+                          <CapLabel
+                            className="zalo-template-name"
+                            type="label1"
+                          >
+                            
+                          </CapLabel>
+                          <CapRow
+                            align="middle"
+                            className="zalo-status-container"
+                            type="flex"
+                          >
+                            <CapStatus
+                              color=""
+                              height="0.571rem"
+                              labelType="label3"
+                              text=""
+                              type="pending"
+                              width="0.571rem"
+                            />
+                          </CapRow>
+                        </CapRow>,
+                      },
+                    ]
+                  }
+                  fbType="list"
+                  key="ZALO-card-list"
+                  style={
+                    Object {
+                      "marginLeft": "16px",
+                    }
+                  }
+                  type="ZALO"
+                />
+              </div>
+              <div
+                style={
+                  Object {
+                    "height": "calc(100vh - 325px)",
+                    "overflow": "auto",
+                  }
+                }
+              />
+            </div>
+          </CapSpin>
+        </div>
+      </Pagination>
+    </CapRow>
+    <CapRow />
+    <CapRow>
+      <CapSlideBox
+        closeIconPosition="right"
+        closeIconSize="m"
+        closeIconType="close"
+        content={
+          <CardGrid
+            className=""
+            colNumber={2}
+            gutterSize={16}
+            isLoading={false}
+            listItem={Array []}
+            onHoverItem={[Function]}
+            onItemClick={[Function]}
+          />
+        }
+        handleClose={[Function]}
+        header={
+          <h3>
+            Select layout
+          </h3>
+        }
+        loadingText="Loading EDM Templates"
+        position="right"
+        show={false}
+        size="size-r"
+        width={60}
+      />
+      <InjectIntl(Wrapper)
+        centered={true}
+        className="delete-template-confirm"
+        closeText="Cancel"
+        okText="Yes, delete"
+        onCancel={[Function]}
+        onOk={[Function]}
+        title="Confirm delete template"
+        visible={false}
+      >
+        Are you sure you wish to delete this template?
+      </InjectIntl(Wrapper)>
+    </CapRow>
+  </div>
+</Fragment>
+`;
+
 exports[`Test Templates container Should render temlates when whatsapp templates are passed 1`] = `
 <Fragment>
   <div
@@ -245,7 +656,7 @@ exports[`Test Templates container Should render temlates when whatsapp templates
         size="size-r"
         width={60}
       />
-      <Wrapper
+      <InjectIntl(Wrapper)
         centered={true}
         className="delete-template-confirm"
         closeText="Cancel"
@@ -256,7 +667,7 @@ exports[`Test Templates container Should render temlates when whatsapp templates
         visible={false}
       >
         Are you sure you wish to delete this template?
-      </Wrapper>
+      </InjectIntl(Wrapper)>
     </CapRow>
   </div>
 </Fragment>
@@ -539,7 +950,164 @@ exports[`Test Templates container Should render temlates when whatsapp templates
         size="size-r"
         width={60}
       />
-      <Wrapper
+      <InjectIntl(Wrapper)
+        centered={true}
+        className="delete-template-confirm"
+        closeText="Cancel"
+        okText="Yes, delete"
+        onCancel={[Function]}
+        onOk={[Function]}
+        title="Confirm delete template"
+        visible={false}
+      >
+        Are you sure you wish to delete this template?
+      </InjectIntl(Wrapper)>
+    </CapRow>
+  </div>
+</Fragment>
+`;
+
+exports[`Test Templates container Should render temlates when zalo templates are passed 1`] = `
+<Fragment>
+  <div
+    className="creatives-templates-list library-mode"
+  >
+    <input
+      accept=".zip, .html, .htm"
+      id="filename"
+      onChange={[Function]}
+      style={
+        Object {
+          "display": "none",
+        }
+      }
+      type="file"
+    />
+    <CapRow>
+      <Pagination
+        onPageChange={[Function]}
+        paginationContainer="pagination-container"
+        paginationSelector="pagination-container"
+      >
+        <div>
+          <div
+            className="action-container"
+          >
+            <_class
+              className="search-text"
+              disabled={false}
+              labelPosition="top"
+              onChange={[Function]}
+              onClear={[Function]}
+              onScroll={[Function]}
+              placeholder="Search"
+              style={
+                Object {
+                  "width": "210px",
+                }
+              }
+              value=""
+            />
+            <div
+              className="zalo-filters"
+            />
+            <Component />
+            <Component />
+            <div
+              style={
+                Object {
+                  "alignItems": "center",
+                  "display": "flex",
+                  "justifyContent": "space-between",
+                }
+              }
+            />
+          </div>
+          <CapRow
+            align="middle"
+            className="selected-whatsapp-filters"
+            type="flex"
+          />
+          <CapSpin
+            spinning={false}
+            style={
+              Object {
+                "width": "100%",
+              }
+            }
+            tip="Getting all templates..."
+          >
+            <div>
+              <div
+                style={
+                  Object {
+                    "height": "calc(100vh - 325px)",
+                    "overflow": "auto",
+                  }
+                }
+              >
+                <CapHeader
+                  description={
+                    <CapLabel
+                      style={
+                        Object {
+                          "textAlign": "center",
+                        }
+                      }
+                      type="label1"
+                    >
+                      Please try searching with another term or apply different filter
+                    </CapLabel>
+                  }
+                  descriptionClass=""
+                  inline={false}
+                  size="large"
+                  title={
+                    <CapHeading
+                      className="channel-specific-illustration-text"
+                      type="h3"
+                    >
+                      Sorry, we couldn’t find any matches
+                    </CapHeading>
+                  }
+                  titleClass=""
+                />
+              </div>
+            </div>
+          </CapSpin>
+        </div>
+      </Pagination>
+    </CapRow>
+    <CapRow />
+    <CapRow>
+      <CapSlideBox
+        closeIconPosition="right"
+        closeIconSize="m"
+        closeIconType="close"
+        content={
+          <CardGrid
+            className=""
+            colNumber={2}
+            gutterSize={16}
+            isLoading={false}
+            listItem={Array []}
+            onHoverItem={[Function]}
+            onItemClick={[Function]}
+          />
+        }
+        handleClose={[Function]}
+        header={
+          <h3>
+            Select layout
+          </h3>
+        }
+        loadingText="Loading EDM Templates"
+        position="right"
+        show={false}
+        size="size-r"
+        width={60}
+      />
+      <InjectIntl(Wrapper)
         centered={true}
         className="delete-template-confirm"
         closeText="Cancel"
@@ -550,7 +1118,7 @@ exports[`Test Templates container Should render temlates when whatsapp templates
         visible={false}
       >
         Are you sure you wish to delete this template?
-      </Wrapper>
+      </InjectIntl(Wrapper)>
     </CapRow>
   </div>
 </Fragment>
@@ -847,16 +1415,20 @@ Click {{unsubscribe}} to unsubscribe
                           </CapLabel>
                         </React.Fragment>,
                         "extra": Array [
-                          <CapIcon
-                            className="view-whatsapp"
-                            onClick={[Function]}
-                            style={
-                              Object {
-                                "marginRight": "16px",
+                          <CapTooltip
+                            title=""
+                          >
+                            <CapIcon
+                              className="view-whatsapp"
+                              onClick={[Function]}
+                              style={
+                                Object {
+                                  "marginRight": "16px",
+                                }
                               }
-                            }
-                            type="eye"
-                          />,
+                              type="eye"
+                            />
+                          </CapTooltip>,
                           <CapDropdown
                             overlay={
                               <CapMenu>
@@ -1008,7 +1580,7 @@ Click {{3}} to unsubscribe",
         size="size-r"
         width={60}
       />
-      <Wrapper
+      <InjectIntl(Wrapper)
         centered={true}
         className="delete-template-confirm"
         closeText="Cancel"
@@ -1019,7 +1591,7 @@ Click {{3}} to unsubscribe",
         visible={false}
       >
         Are you sure you wish to delete this template?
-      </Wrapper>
+      </InjectIntl(Wrapper)>
     </CapRow>
   </div>
 </Fragment>
@@ -1284,16 +1856,20 @@ Click {{unsubscribe}} to unsubscribe
                           </CapLabel>
                         </React.Fragment>,
                         "extra": Array [
-                          <CapIcon
-                            className="view-whatsapp"
-                            onClick={[Function]}
-                            style={
-                              Object {
-                                "marginRight": "16px",
+                          <CapTooltip
+                            title=""
+                          >
+                            <CapIcon
+                              className="view-whatsapp"
+                              onClick={[Function]}
+                              style={
+                                Object {
+                                  "marginRight": "16px",
+                                }
                               }
-                            }
-                            type="eye"
-                          />,
+                              type="eye"
+                            />
+                          </CapTooltip>,
                           <CapDropdown
                             overlay={
                               <CapMenu>
@@ -1445,7 +2021,7 @@ Click {{3}} to unsubscribe",
         size="size-r"
         width={60}
       />
-      <Wrapper
+      <InjectIntl(Wrapper)
         centered={true}
         className="delete-template-confirm"
         closeText="Cancel"
@@ -1456,7 +2032,7 @@ Click {{3}} to unsubscribe",
         visible={false}
       >
         Are you sure you wish to delete this template?
-      </Wrapper>
+      </InjectIntl(Wrapper)>
     </CapRow>
   </div>
 </Fragment>
@@ -1721,16 +2297,20 @@ Click {{unsubscribe}} to unsubscribe
                           </CapLabel>
                         </React.Fragment>,
                         "extra": Array [
-                          <CapIcon
-                            className="view-whatsapp"
-                            onClick={[Function]}
-                            style={
-                              Object {
-                                "marginRight": "16px",
+                          <CapTooltip
+                            title=""
+                          >
+                            <CapIcon
+                              className="view-whatsapp"
+                              onClick={[Function]}
+                              style={
+                                Object {
+                                  "marginRight": "16px",
+                                }
                               }
-                            }
-                            type="eye"
-                          />,
+                              type="eye"
+                            />
+                          </CapTooltip>,
                           <CapDropdown
                             overlay={
                               <CapMenu>
@@ -1882,7 +2462,7 @@ Click {{3}} to unsubscribe",
         size="size-r"
         width={60}
       />
-      <Wrapper
+      <InjectIntl(Wrapper)
         centered={true}
         className="delete-template-confirm"
         closeText="Cancel"
@@ -1893,7 +2473,7 @@ Click {{3}} to unsubscribe",
         visible={false}
       >
         Are you sure you wish to delete this template?
-      </Wrapper>
+      </InjectIntl(Wrapper)>
     </CapRow>
   </div>
 </Fragment>
@@ -2146,7 +2726,7 @@ exports[`Test Templates container Test removing all whatsapp filterss 1`] = `
         size="size-r"
         width={60}
       />
-      <Wrapper
+      <InjectIntl(Wrapper)
         centered={true}
         className="delete-template-confirm"
         closeText="Cancel"
@@ -2157,7 +2737,7 @@ exports[`Test Templates container Test removing all whatsapp filterss 1`] = `
         visible={false}
       >
         Are you sure you wish to delete this template?
-      </Wrapper>
+      </InjectIntl(Wrapper)>
     </CapRow>
   </div>
 </Fragment>
@@ -2384,7 +2964,7 @@ exports[`Test Templates container Test removing all whatsapp filterss 2`] = `
         size="size-r"
         width={60}
       />
-      <Wrapper
+      <InjectIntl(Wrapper)
         centered={true}
         className="delete-template-confirm"
         closeText="Cancel"
@@ -2395,7 +2975,7 @@ exports[`Test Templates container Test removing all whatsapp filterss 2`] = `
         visible={false}
       >
         Are you sure you wish to delete this template?
-      </Wrapper>
+      </InjectIntl(Wrapper)>
     </CapRow>
   </div>
 </Fragment>
@@ -2622,7 +3202,7 @@ exports[`Test Templates container Test removing single filter 1`] = `
         size="size-r"
         width={60}
       />
-      <Wrapper
+      <InjectIntl(Wrapper)
         centered={true}
         className="delete-template-confirm"
         closeText="Cancel"
@@ -2633,7 +3213,7 @@ exports[`Test Templates container Test removing single filter 1`] = `
         visible={false}
       >
         Are you sure you wish to delete this template?
-      </Wrapper>
+      </InjectIntl(Wrapper)>
     </CapRow>
   </div>
 </Fragment>