@blaze-cms/react-page-builder 0.124.0-alpha.3 → 0.124.0-alpha.7

package/lib-es/components/SearchContent/index.js

@@ -1,12 +1,14 @@
 import React, { useState } from 'react';
 import PropTypes from 'prop-types';
-import { gql, useQuery } from '@apollo/client';
+import { gql, useApolloClient } from '@apollo/client';
 import { useRouter } from 'next/router';
 import { getPublishedContent } from '../../application/query';
 import BlazeLink from '../BlazeLink';
 
+const logError = error => error;
+
 const SearchContent = ({
-  entity,
+  entities,
   searchInputAlignment,
   searchInputWrapperMobile,
   searchInputWrapperDesktop,
@@ -16,44 +18,70 @@ const SearchContent = ({
 }) => {
   const [collapsed, setCollapsed] = useState(collapsible);
   const [searchTerm, setSearchTerm] = useState(null);
+  const [data, setData] = useState([]);
   const router = useRouter();
+  const client = useApolloClient();
 
   const capitalize = s => {
     if (typeof s !== 'string') return '';
     return s.charAt(0).toUpperCase() + s.slice(1);
   };
 
-  const [a, b] = entity.split('_');
-  const entityName = capitalize(a) + capitalize(b);
-  const rawQueryStringified = JSON.stringify({
-    size: 0,
-    query: {
-      bool: {
-        should: [{
-          match: {
-            docType: entity
+  React.useEffect(() => {
+    if (data && data.length !== 0) return;
+    const promises = entities.map(entity => {
+      const [a, b] = entity.split('_');
+      const entityName = capitalize(a) + capitalize(b);
+      const rawQueryStringified = JSON.stringify({
+        size: 0,
+        query: {
+          bool: {
+            should: [{
+              match: {
+                docType: entity
+              }
+            }],
+            minimum_should_match: 1
+          }
+        }
+      });
+      const query = gql`
+        ${getPublishedContent(entityName)}
+      `;
+
+      try {
+        return client.query({
+          query,
+          variables: {
+            rawQueryStringified,
+            offset: 0,
+            limit: 5
           }
-        }],
-        minimum_should_match: 1
+        });
+      } catch (e) {
+        return [];
       }
+    });
+
+    try {
+      (async () => {
+        try {
+          const fetchResults = await Promise.all(promises);
+          const searchResults = fetchResults.map(result => {
+            const {
+              data: resultData
+            } = result;
+            return resultData.searchPublishedContent.results;
+          }).flat();
+          setData(searchResults);
+        } catch (e) {
+          logError(e);
+        }
+      })();
+    } catch (e) {
+      logError(e);
     }
   });
-  const query = gql`
-    ${getPublishedContent(entityName)}
-  `;
-  const {
-    loading,
-    error,
-    data
-  } = useQuery(query, {
-    variables: {
-      rawQueryStringified,
-      offset: 0,
-      limit: 5
-    }
-  });
-  if (loading) return null;
-  if (error) return null;
 
   const handleClick = (e, url) => {
     e.preventDefault();
@@ -66,30 +94,35 @@ const SearchContent = ({
     }
   };
 
-  const renderResults = () => {
-    // eslint-disable-next-line no-undef
+  const renderResults = () => // eslint-disable-next-line no-undef
+  data === null || data === void 0 ? void 0 : data.map(dataItem => {
     const {
-      results
-    } = data === null || data === void 0 ? void 0 : data.searchPublishedContent;
+      name,
+      image,
+      url
+    } = dataItem;
 
-    if (results && searchTerm && searchTerm !== '') {
-      return results.map(({
-        name,
-        url
-      }) => {
-        if (name.includes(searchTerm)) {
-          return /*#__PURE__*/React.createElement(BlazeLink, {
-            href: url,
-            onClick: e => handleClick(e, url)
-          }, name);
-        }
+    if (searchTerm && searchTerm !== '') {
+      if (name.includes(searchTerm)) {
+        return /*#__PURE__*/React.createElement(BlazeLink, {
+          href: url,
+          onClick: e => handleClick(e, url)
+        }, /*#__PURE__*/React.createElement("div", {
+          className: "mt-2 mb-1"
+        }, /*#__PURE__*/React.createElement("div", {
+          className: "flex justify-start items-center"
+        }, image.url ? /*#__PURE__*/React.createElement("img", {
+          src: image.url,
+          alt: name,
+          className: "w-20 h-14"
+        }) : null, /*#__PURE__*/React.createElement("span", {
+          className: "ml-2"
+        }, name))));
+      }
 
-        return null;
-      });
+      return null;
     }
-
-    return [];
-  };
+  });
 
   const searchResultsMessage = searchTerm ? `Search results for: ${searchTerm}` : '';
   return collapsed ? /*#__PURE__*/React.createElement("div", {
@@ -160,7 +193,7 @@ SearchContent.propTypes = {
   placeholder: PropTypes.string,
   isMobile: PropTypes.bool,
   collapsible: PropTypes.bool,
-  entity: PropTypes.string.isRequired
+  entities: PropTypes.array.isRequired
 };
 SearchContent.defaultProps = {
   searchInputAlignment: '',

package/lib-es/components/SearchContent/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SearchContent/index.js"],"names":["React","useState","PropTypes","gql","useQuery","useRouter","getPublishedContent","BlazeLink","SearchContent","entity","searchInputAlignment","searchInputWrapperMobile","searchInputWrapperDesktop","collapsible","isMobile","placeholder","collapsed","setCollapsed","searchTerm","setSearchTerm","router","capitalize","s","charAt","toUpperCase","slice","a","b","split","entityName","rawQueryStringified","JSON","stringify","size","query","bool","should","match","docType","minimum_should_match","loading","error","data","variables","offset","limit","handleClick","e","url","preventDefault","push","handleKeyPress","key","target","value","renderResults","results","searchPublishedContent","map","name","includes","searchResultsMessage","propTypes","string","isRequired","defaultProps"],"mappings":"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","sourcesContent":["import React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { gql, useQuery } from '@apollo/client';\nimport { useRouter } from 'next/router';\nimport { getPublishedContent } from '../../application/query';\nimport BlazeLink from '../BlazeLink';\n\nconst SearchContent = ({\n  entity,\n  searchInputAlignment,\n  searchInputWrapperMobile,\n  searchInputWrapperDesktop,\n  collapsible,\n  isMobile,\n  placeholder\n}) => {\n  const [collapsed, setCollapsed] = useState(collapsible);\n  const [searchTerm, setSearchTerm] = useState(null);\n  const router = useRouter();\n\n  const capitalize = s => {\n    if (typeof s !== 'string') return '';\n    return s.charAt(0).toUpperCase() + s.slice(1);\n  };\n\n  const [a, b] = entity.split('_');\n\n  const entityName = capitalize(a) + capitalize(b);\n\n  const rawQueryStringified = JSON.stringify({\n    size: 0,\n    query: {\n      bool: {\n        should: [\n          {\n            match: {\n              docType: entity\n            }\n          }\n        ],\n        minimum_should_match: 1\n      }\n    }\n  });\n\n  const query = gql`\n    ${getPublishedContent(entityName)}\n  `;\n\n  const { loading, error, data } = useQuery(query, {\n    variables: { rawQueryStringified, offset: 0, limit: 5 }\n  });\n\n  if (loading) return null;\n  if (error) return null;\n\n  const handleClick = (e, url) => {\n    e.preventDefault();\n    router.push(url);\n  };\n\n  const handleKeyPress = e => {\n    if (e.key === 'Enter' && e.target.value !== '') {\n      router.push(`/search?search_term=${e.target.value}`);\n    }\n  };\n\n  const renderResults = () => {\n    // eslint-disable-next-line no-undef\n    const { results } = data?.searchPublishedContent;\n\n    if (results && searchTerm && searchTerm !== '') {\n      return results.map(({ name, url }) => {\n        if (name.includes(searchTerm)) {\n          return (\n            <BlazeLink href={url} onClick={e => handleClick(e, url)}>\n              {name}\n            </BlazeLink>\n          );\n        }\n\n        return null;\n      });\n    }\n\n    return [];\n  };\n\n  const searchResultsMessage = searchTerm ? `Search results for: ${searchTerm}` : '';\n\n  return collapsed ? (\n    <div className={isMobile ? searchInputWrapperMobile : searchInputWrapperDesktop}>\n      <div className=\"search-content--collapse__wrapper\">\n        <label className=\"search-content--collapse__label\">\n          <span className=\"search-content--collapse__icon_wrapper\">\n            <svg className=\"search-content--collapse__icon\" viewBox=\"0 0 20 20\">\n              <path\n                fillRule=\"evenodd\"\n                d=\"M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z\"\n                clipRule=\"evenodd\"\n              />\n            </svg>\n          </span>\n          <input\n            onFocus={() => setCollapsed(false)}\n            onChange={e => setSearchTerm(e.target.value)}\n            type=\"text\"\n            name=\"search\"\n            value=\"\"\n            className=\"search-content--collapse__input\"\n          />\n        </label>\n      </div>\n    </div>\n  ) : (\n    <>\n      <div className={`${isMobile ? searchInputWrapperMobile : searchInputWrapperDesktop}`}>\n        <div className=\"search-content--expanded__wrapper\">\n          <label className=\"search-content--expanded__label\">\n            <span className=\"search-content--expanded__icon_wrapper\">\n              <svg className=\"search-content--expanded__icon\" viewBox=\"0 0 20 20\">\n                <path\n                  fillRule=\"evenodd\"\n                  d=\"M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z\"\n                  clipRule=\"evenodd\"\n                />\n              </svg>\n            </span>\n            <input\n              type=\"text\"\n              name=\"search\"\n              onChange={e => setSearchTerm(e.target.value)}\n              onKeyPress={handleKeyPress}\n              className=\"search-content--expanded__input\"\n              placeholder={placeholder}\n              onBlur={() => {\n                if (!collapsible) return;\n                if (!searchTerm || searchTerm === '') setCollapsed(true);\n              }}\n            />\n          </label>\n        </div>\n        {data &&\n          searchResultsMessage !== '' && (\n            <div className=\"search-content--results__wrapper\">\n              <div className=\"search-content--results__wrapper--message\">\n                <div className=\"text-sm pt-2\">{searchResultsMessage}</div>\n\n                <div className=\"search-content--results__message\">\n                  <div className=\"search-content--results__content\">{renderResults()}</div>\n                </div>\n              </div>\n            </div>\n          )}\n      </div>\n    </>\n  );\n};\n\nSearchContent.propTypes = {\n  searchInputAlignment: PropTypes.string,\n  searchInputWrapperMobile: PropTypes.string,\n  searchInputWrapperDesktop: PropTypes.string,\n  placeholder: PropTypes.string,\n  isMobile: PropTypes.bool,\n  collapsible: PropTypes.bool,\n  entity: PropTypes.string.isRequired\n};\n\nSearchContent.defaultProps = {\n  searchInputAlignment: '',\n  searchInputWrapperMobile: '',\n  searchInputWrapperDesktop: '',\n  placeholder: '',\n  isMobile: false,\n  collapsible: false\n};\n\nexport default SearchContent;\n"],"file":"index.js"}
+{"version":3,"sources":["../../../src/components/SearchContent/index.js"],"names":["React","useState","PropTypes","gql","useApolloClient","useRouter","getPublishedContent","BlazeLink","logError","error","SearchContent","entities","searchInputAlignment","searchInputWrapperMobile","searchInputWrapperDesktop","collapsible","isMobile","placeholder","collapsed","setCollapsed","searchTerm","setSearchTerm","data","setData","router","client","capitalize","s","charAt","toUpperCase","slice","useEffect","length","promises","map","entity","a","b","split","entityName","rawQueryStringified","JSON","stringify","size","query","bool","should","match","docType","minimum_should_match","variables","offset","limit","e","fetchResults","Promise","all","searchResults","result","resultData","searchPublishedContent","results","flat","handleClick","url","preventDefault","push","handleKeyPress","key","target","value","renderResults","dataItem","name","image","includes","searchResultsMessage","propTypes","string","array","isRequired","defaultProps"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,QAAhB,QAAgC,OAAhC;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,SAASC,GAAT,EAAcC,eAAd,QAAqC,gBAArC;AAEA,SAASC,SAAT,QAA0B,aAA1B;AACA,SAASC,mBAAT,QAAoC,yBAApC;AACA,OAAOC,SAAP,MAAsB,cAAtB;;AAEA,MAAMC,QAAQ,GAAGC,KAAK,IAAIA,KAA1B;;AAEA,MAAMC,aAAa,GAAG,CAAC;AACrBC,EAAAA,QADqB;AAErBC,EAAAA,oBAFqB;AAGrBC,EAAAA,wBAHqB;AAIrBC,EAAAA,yBAJqB;AAKrBC,EAAAA,WALqB;AAMrBC,EAAAA,QANqB;AAOrBC,EAAAA;AAPqB,CAAD,KAQhB;AACJ,QAAM,CAACC,SAAD,EAAYC,YAAZ,IAA4BlB,QAAQ,CAACc,WAAD,CAA1C;AACA,QAAM,CAACK,UAAD,EAAaC,aAAb,IAA8BpB,QAAQ,CAAC,IAAD,CAA5C;AACA,QAAM,CAACqB,IAAD,EAAOC,OAAP,IAAkBtB,QAAQ,CAAC,EAAD,CAAhC;AAEA,QAAMuB,MAAM,GAAGnB,SAAS,EAAxB;AACA,QAAMoB,MAAM,GAAGrB,eAAe,EAA9B;;AAEA,QAAMsB,UAAU,GAAGC,CAAC,IAAI;AACtB,QAAI,OAAOA,CAAP,KAAa,QAAjB,EAA2B,OAAO,EAAP;AAC3B,WAAOA,CAAC,CAACC,MAAF,CAAS,CAAT,EAAYC,WAAZ,KAA4BF,CAAC,CAACG,KAAF,CAAQ,CAAR,CAAnC;AACD,GAHD;;AAKA9B,EAAAA,KAAK,CAAC+B,SAAN,CAAgB,MAAM;AACpB,QAAIT,IAAI,IAAIA,IAAI,CAACU,MAAL,KAAgB,CAA5B,EAA+B;AAE/B,UAAMC,QAAQ,GAAGtB,QAAQ,CAACuB,GAAT,CAAaC,MAAM,IAAI;AACtC,YAAM,CAACC,CAAD,EAAIC,CAAJ,IAASF,MAAM,CAACG,KAAP,CAAa,GAAb,CAAf;AAEA,YAAMC,UAAU,GAAGb,UAAU,CAACU,CAAD,CAAV,GAAgBV,UAAU,CAACW,CAAD,CAA7C;AAEA,YAAMG,mBAAmB,GAAGC,IAAI,CAACC,SAAL,CAAe;AACzCC,QAAAA,IAAI,EAAE,CADmC;AAEzCC,QAAAA,KAAK,EAAE;AACLC,UAAAA,IAAI,EAAE;AACJC,YAAAA,MAAM,EAAE,CACN;AACEC,cAAAA,KAAK,EAAE;AACLC,gBAAAA,OAAO,EAAEb;AADJ;AADT,aADM,CADJ;AAQJc,YAAAA,oBAAoB,EAAE;AARlB;AADD;AAFkC,OAAf,CAA5B;AAgBA,YAAML,KAAK,GAAGzC,GAAI;AACxB,UAAUG,mBAAmB,CAACiC,UAAD,CAAa;AAC1C,OAFM;;AAIA,UAAI;AACF,eAAOd,MAAM,CAACmB,KAAP,CAAa;AAClBA,UAAAA,KADkB;AAElBM,UAAAA,SAAS,EAAE;AACTV,YAAAA,mBADS;AAETW,YAAAA,MAAM,EAAE,CAFC;AAGTC,YAAAA,KAAK,EAAE;AAHE;AAFO,SAAb,CAAP;AAQD,OATD,CASE,OAAOC,CAAP,EAAU;AACV,eAAO,EAAP;AACD;AACF,KArCgB,CAAjB;;AAuCA,QAAI;AACF,OAAC,YAAY;AACX,YAAI;AACF,gBAAMC,YAAY,GAAG,MAAMC,OAAO,CAACC,GAAR,CAAYvB,QAAZ,CAA3B;AACA,gBAAMwB,aAAa,GAAGH,YAAY,CAC/BpB,GADmB,CACfwB,MAAM,IAAI;AACb,kBAAM;AAAEpC,cAAAA,IAAI,EAAEqC;AAAR,gBAAuBD,MAA7B;AACA,mBAAOC,UAAU,CAACC,sBAAX,CAAkCC,OAAzC;AACD,WAJmB,EAKnBC,IALmB,EAAtB;AAOAvC,UAAAA,OAAO,CAACkC,aAAD,CAAP;AACD,SAVD,CAUE,OAAOJ,CAAP,EAAU;AACV7C,UAAAA,QAAQ,CAAC6C,CAAD,CAAR;AACD;AACF,OAdD;AAeD,KAhBD,CAgBE,OAAOA,CAAP,EAAU;AACV7C,MAAAA,QAAQ,CAAC6C,CAAD,CAAR;AACD;AACF,GA7DD;;AA+DA,QAAMU,WAAW,GAAG,CAACV,CAAD,EAAIW,GAAJ,KAAY;AAC9BX,IAAAA,CAAC,CAACY,cAAF;AACAzC,IAAAA,MAAM,CAAC0C,IAAP,CAAYF,GAAZ;AACD,GAHD;;AAKA,QAAMG,cAAc,GAAGd,CAAC,IAAI;AAC1B,QAAIA,CAAC,CAACe,GAAF,KAAU,OAAV,IAAqBf,CAAC,CAACgB,MAAF,CAASC,KAAT,KAAmB,EAA5C,EAAgD;AAC9C9C,MAAAA,MAAM,CAAC0C,IAAP,CAAa,uBAAsBb,CAAC,CAACgB,MAAF,CAASC,KAAM,EAAlD;AACD;AACF,GAJD;;AAMA,QAAMC,aAAa,GAAG,MACpB;AACAjD,EAAAA,IAFoB,aAEpBA,IAFoB,uBAEpBA,IAAI,CAAEY,GAAN,CAAUsC,QAAQ,IAAI;AACpB,UAAM;AAAEC,MAAAA,IAAF;AAAQC,MAAAA,KAAR;AAAeV,MAAAA;AAAf,QAAuBQ,QAA7B;;AAEA,QAAIpD,UAAU,IAAIA,UAAU,KAAK,EAAjC,EAAqC;AACnC,UAAIqD,IAAI,CAACE,QAAL,CAAcvD,UAAd,CAAJ,EAA+B;AAC7B,4BACE,oBAAC,SAAD;AAAW,UAAA,IAAI,EAAE4C,GAAjB;AAAsB,UAAA,OAAO,EAAEX,CAAC,IAAIU,WAAW,CAACV,CAAD,EAAIW,GAAJ;AAA/C,wBACE;AAAK,UAAA,SAAS,EAAC;AAAf,wBACE;AAAK,UAAA,SAAS,EAAC;AAAf,WACGU,KAAK,CAACV,GAAN,gBAAY;AAAK,UAAA,GAAG,EAAEU,KAAK,CAACV,GAAhB;AAAqB,UAAA,GAAG,EAAES,IAA1B;AAAgC,UAAA,SAAS,EAAC;AAA1C,UAAZ,GAAuE,IAD1E,eAEE;AAAM,UAAA,SAAS,EAAC;AAAhB,WAAwBA,IAAxB,CAFF,CADF,CADF,CADF;AAUD;;AAED,aAAO,IAAP;AACD;AACF,GAnBD,CAFF;;AAuBA,QAAMG,oBAAoB,GAAGxD,UAAU,GAAI,uBAAsBA,UAAW,EAArC,GAAyC,EAAhF;AAEA,SAAOF,SAAS,gBACd;AAAK,IAAA,SAAS,EAAEF,QAAQ,GAAGH,wBAAH,GAA8BC;AAAtD,kBACE;AAAK,IAAA,SAAS,EAAC;AAAf,kBACE;AAAO,IAAA,SAAS,EAAC;AAAjB,kBACE;AAAM,IAAA,SAAS,EAAC;AAAhB,kBACE;AAAK,IAAA,SAAS,EAAC,gCAAf;AAAgD,IAAA,OAAO,EAAC;AAAxD,kBACE;AACE,IAAA,QAAQ,EAAC,SADX;AAEE,IAAA,CAAC,EAAC,kHAFJ;AAGE,IAAA,QAAQ,EAAC;AAHX,IADF,CADF,CADF,eAUE;AACE,IAAA,OAAO,EAAE,MAAMK,YAAY,CAAC,KAAD,CAD7B;AAEE,IAAA,QAAQ,EAAEkC,CAAC,IAAIhC,aAAa,CAACgC,CAAC,CAACgB,MAAF,CAASC,KAAV,CAF9B;AAGE,IAAA,IAAI,EAAC,MAHP;AAIE,IAAA,IAAI,EAAC,QAJP;AAKE,IAAA,KAAK,EAAC,EALR;AAME,IAAA,SAAS,EAAC;AANZ,IAVF,CADF,CADF,CADc,gBAyBd,uDACE;AAAK,IAAA,SAAS,EAAG,GAAEtD,QAAQ,GAAGH,wBAAH,GAA8BC,yBAA0B;AAAnF,kBACE;AAAK,IAAA,SAAS,EAAC;AAAf,kBACE;AAAO,IAAA,SAAS,EAAC;AAAjB,kBACE;AAAM,IAAA,SAAS,EAAC;AAAhB,kBACE;AAAK,IAAA,SAAS,EAAC,gCAAf;AAAgD,IAAA,OAAO,EAAC;AAAxD,kBACE;AACE,IAAA,QAAQ,EAAC,SADX;AAEE,IAAA,CAAC,EAAC,kHAFJ;AAGE,IAAA,QAAQ,EAAC;AAHX,IADF,CADF,CADF,eAUE;AACE,IAAA,IAAI,EAAC,MADP;AAEE,IAAA,IAAI,EAAC,QAFP;AAGE,IAAA,QAAQ,EAAEuC,CAAC,IAAIhC,aAAa,CAACgC,CAAC,CAACgB,MAAF,CAASC,KAAV,CAH9B;AAIE,IAAA,UAAU,EAAEH,cAJd;AAKE,IAAA,SAAS,EAAC,iCALZ;AAME,IAAA,WAAW,EAAElD,WANf;AAOE,IAAA,MAAM,EAAE,MAAM;AACZ,UAAI,CAACF,WAAL,EAAkB;AAClB,UAAI,CAACK,UAAD,IAAeA,UAAU,KAAK,EAAlC,EAAsCD,YAAY,CAAC,IAAD,CAAZ;AACvC;AAVH,IAVF,CADF,CADF,EA0BGG,IAAI,IACHsD,oBAAoB,KAAK,EAD1B,iBAEG;AAAK,IAAA,SAAS,EAAC;AAAf,kBACE;AAAK,IAAA,SAAS,EAAC;AAAf,kBACE;AAAK,IAAA,SAAS,EAAC;AAAf,KAA+BA,oBAA/B,CADF,eAGE;AAAK,IAAA,SAAS,EAAC;AAAf,kBACE;AAAK,IAAA,SAAS,EAAC;AAAf,KAAmDL,aAAa,EAAhE,CADF,CAHF,CADF,CA5BN,CADF,CAzBF;AAmED,CA3LD;;AA6LA7D,aAAa,CAACmE,SAAd,GAA0B;AACxBjE,EAAAA,oBAAoB,EAAEV,SAAS,CAAC4E,MADR;AAExBjE,EAAAA,wBAAwB,EAAEX,SAAS,CAAC4E,MAFZ;AAGxBhE,EAAAA,yBAAyB,EAAEZ,SAAS,CAAC4E,MAHb;AAIxB7D,EAAAA,WAAW,EAAEf,SAAS,CAAC4E,MAJC;AAKxB9D,EAAAA,QAAQ,EAAEd,SAAS,CAAC2C,IALI;AAMxB9B,EAAAA,WAAW,EAAEb,SAAS,CAAC2C,IANC;AAOxBlC,EAAAA,QAAQ,EAAET,SAAS,CAAC6E,KAAV,CAAgBC;AAPF,CAA1B;AAUAtE,aAAa,CAACuE,YAAd,GAA6B;AAC3BrE,EAAAA,oBAAoB,EAAE,EADK;AAE3BC,EAAAA,wBAAwB,EAAE,EAFC;AAG3BC,EAAAA,yBAAyB,EAAE,EAHA;AAI3BG,EAAAA,WAAW,EAAE,EAJc;AAK3BD,EAAAA,QAAQ,EAAE,KALiB;AAM3BD,EAAAA,WAAW,EAAE;AANc,CAA7B;AASA,eAAeL,aAAf","sourcesContent":["import React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { gql, useApolloClient } from '@apollo/client';\n\nimport { useRouter } from 'next/router';\nimport { getPublishedContent } from '../../application/query';\nimport BlazeLink from '../BlazeLink';\n\nconst logError = error => error;\n\nconst SearchContent = ({\n  entities,\n  searchInputAlignment,\n  searchInputWrapperMobile,\n  searchInputWrapperDesktop,\n  collapsible,\n  isMobile,\n  placeholder\n}) => {\n  const [collapsed, setCollapsed] = useState(collapsible);\n  const [searchTerm, setSearchTerm] = useState(null);\n  const [data, setData] = useState([]);\n\n  const router = useRouter();\n  const client = useApolloClient();\n\n  const capitalize = s => {\n    if (typeof s !== 'string') return '';\n    return s.charAt(0).toUpperCase() + s.slice(1);\n  };\n\n  React.useEffect(() => {\n    if (data && data.length !== 0) return;\n\n    const promises = entities.map(entity => {\n      const [a, b] = entity.split('_');\n\n      const entityName = capitalize(a) + capitalize(b);\n\n      const rawQueryStringified = JSON.stringify({\n        size: 0,\n        query: {\n          bool: {\n            should: [\n              {\n                match: {\n                  docType: entity\n                }\n              }\n            ],\n            minimum_should_match: 1\n          }\n        }\n      });\n\n      const query = gql`\n        ${getPublishedContent(entityName)}\n      `;\n\n      try {\n        return client.query({\n          query,\n          variables: {\n            rawQueryStringified,\n            offset: 0,\n            limit: 5\n          }\n        });\n      } catch (e) {\n        return [];\n      }\n    });\n\n    try {\n      (async () => {\n        try {\n          const fetchResults = await Promise.all(promises);\n          const searchResults = fetchResults\n            .map(result => {\n              const { data: resultData } = result;\n              return resultData.searchPublishedContent.results;\n            })\n            .flat();\n\n          setData(searchResults);\n        } catch (e) {\n          logError(e);\n        }\n      })();\n    } catch (e) {\n      logError(e);\n    }\n  });\n\n  const handleClick = (e, url) => {\n    e.preventDefault();\n    router.push(url);\n  };\n\n  const handleKeyPress = e => {\n    if (e.key === 'Enter' && e.target.value !== '') {\n      router.push(`/search?search_term=${e.target.value}`);\n    }\n  };\n\n  const renderResults = () =>\n    // eslint-disable-next-line no-undef\n    data?.map(dataItem => {\n      const { name, image, url } = dataItem;\n\n      if (searchTerm && searchTerm !== '') {\n        if (name.includes(searchTerm)) {\n          return (\n            <BlazeLink href={url} onClick={e => handleClick(e, url)}>\n              <div className=\"mt-2 mb-1\">\n                <div className=\"flex justify-start items-center\">\n                  {image.url ? <img src={image.url} alt={name} className=\"w-20 h-14\" /> : null}\n                  <span className=\"ml-2\">{name}</span>\n                </div>\n              </div>\n            </BlazeLink>\n          );\n        }\n\n        return null;\n      }\n    });\n\n  const searchResultsMessage = searchTerm ? `Search results for: ${searchTerm}` : '';\n\n  return collapsed ? (\n    <div className={isMobile ? searchInputWrapperMobile : searchInputWrapperDesktop}>\n      <div className=\"search-content--collapse__wrapper\">\n        <label className=\"search-content--collapse__label\">\n          <span className=\"search-content--collapse__icon_wrapper\">\n            <svg className=\"search-content--collapse__icon\" viewBox=\"0 0 20 20\">\n              <path\n                fillRule=\"evenodd\"\n                d=\"M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z\"\n                clipRule=\"evenodd\"\n              />\n            </svg>\n          </span>\n          <input\n            onFocus={() => setCollapsed(false)}\n            onChange={e => setSearchTerm(e.target.value)}\n            type=\"text\"\n            name=\"search\"\n            value=\"\"\n            className=\"search-content--collapse__input\"\n          />\n        </label>\n      </div>\n    </div>\n  ) : (\n    <>\n      <div className={`${isMobile ? searchInputWrapperMobile : searchInputWrapperDesktop}`}>\n        <div className=\"search-content--expanded__wrapper\">\n          <label className=\"search-content--expanded__label\">\n            <span className=\"search-content--expanded__icon_wrapper\">\n              <svg className=\"search-content--expanded__icon\" viewBox=\"0 0 20 20\">\n                <path\n                  fillRule=\"evenodd\"\n                  d=\"M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z\"\n                  clipRule=\"evenodd\"\n                />\n              </svg>\n            </span>\n            <input\n              type=\"text\"\n              name=\"search\"\n              onChange={e => setSearchTerm(e.target.value)}\n              onKeyPress={handleKeyPress}\n              className=\"search-content--expanded__input\"\n              placeholder={placeholder}\n              onBlur={() => {\n                if (!collapsible) return;\n                if (!searchTerm || searchTerm === '') setCollapsed(true);\n              }}\n            />\n          </label>\n        </div>\n        {data &&\n          searchResultsMessage !== '' && (\n            <div className=\"search-content--results__wrapper\">\n              <div className=\"search-content--results__wrapper--message\">\n                <div className=\"text-sm pt-2\">{searchResultsMessage}</div>\n\n                <div className=\"search-content--results__message\">\n                  <div className=\"search-content--results__content\">{renderResults()}</div>\n                </div>\n              </div>\n            </div>\n          )}\n      </div>\n    </>\n  );\n};\n\nSearchContent.propTypes = {\n  searchInputAlignment: PropTypes.string,\n  searchInputWrapperMobile: PropTypes.string,\n  searchInputWrapperDesktop: PropTypes.string,\n  placeholder: PropTypes.string,\n  isMobile: PropTypes.bool,\n  collapsible: PropTypes.bool,\n  entities: PropTypes.array.isRequired\n};\n\nSearchContent.defaultProps = {\n  searchInputAlignment: '',\n  searchInputWrapperMobile: '',\n  searchInputWrapperDesktop: '',\n  placeholder: '',\n  isMobile: false,\n  collapsible: false\n};\n\nexport default SearchContent;\n"],"file":"index.js"}

package/lib-es/helpers/build-props-query.js

@@ -13,12 +13,20 @@ const buildPropsQuery = (data, extraProps = [], cardOptions = null) => {
   const allProps = [...typeBasedProps, ...extraProps];
   const uniqueProps = [...new Set([...allProps])];
   const basicProps = uniqueProps.filter(prop => prop && !prop.includes('.')).filter((prop, i, arr) => arr.indexOf(prop) === i);
-  const complexProps = buildComplexProps(shouldAddCategoryProps, uniqueProps);
+  const complexProps = buildComplexProps(shouldAddCategoryProps, uniqueProps, data);
   return [...basicProps, ...complexProps].join(',');
 };
 
-const buildComplexProps = (shouldAddCategoryProps, props) => props.filter(prop => prop && prop.includes('.')).map(nested => nested.split('.')[0]).filter((prop, i, arr) => arr.indexOf(prop) === i).map(base => {
+const buildComplexProps = (shouldAddCategoryProps, props, {
+  getEntitySchema: {
+    relations
+  }
+}) => props.filter(prop => prop && prop.includes('.')).map(nested => nested.split('.')[0]).filter((prop, i, arr) => arr.indexOf(prop) === i).map(base => {
+  const matchingRelation = relations.find(({
+    localField
+  }) => localField === base);
   const nestedProps = props.filter((extraProp, i, arr) => extraProp && extraProp.startsWith(`${base}.`) && arr.indexOf(extraProp) === i).map(nested => nested.split('.')[1]);
+  if (matchingRelation && !nestedProps.includes('id')) nestedProps.push('id');
   const jointNestedProps = nestedProps.join(',');
   if (base === 'category' && shouldAddCategoryProps) return `${base}{${jointNestedProps}, ${categoryProps}}`;
 
@@ -55,6 +63,7 @@ const getTypeBaseProps = (data, cardOptions, extraPropsHaveCategory) => {
   const typeBasedProps = [...defaultProps];
   typeBasedProps.push(...getCategoyProps(shouldAddCategoryProps, hasCategory, hasPreheader));
   typeBasedProps.push(...getContentProps(isContent));
+  if (properties.url || dynamicProperties.url) typeBasedProps.push('url');
 
   if (displayThumbnail && relations.find(({
     localField

package/lib-es/helpers/build-props-query.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/helpers/build-props-query.js"],"names":["CATEGORY_ID","ID","PREHEADER_PROP","HEADLINE_PROP","defaultProps","categoryProps","checkProps","props","Object","keys","filter","prop","length","buildPropsQuery","data","extraProps","cardOptions","extraPropsHaveCategory","includes","typeBasedProps","shouldAddCategoryProps","getTypeBaseProps","allProps","uniqueProps","Set","basicProps","i","arr","indexOf","complexProps","buildComplexProps","join","map","nested","split","base","nestedProps","extraProp","startsWith","jointNestedProps","isCard","displayCategory","displayThumbnail","getEntitySchema","interfaces","properties","dynamicProperties","relations","isContent","hasCategory","hasPreheader","push","getCategoyProps","getContentProps","find","localField"],"mappings":"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","sourcesContent":["import { CATEGORY_ID, ID, PREHEADER_PROP, HEADLINE_PROP } from '../constants';\n\nconst defaultProps = [ID, 'name'];\nconst categoryProps = 'id publishedListingPage{id, url}';\n\nconst checkProps = props =>\n  !!(props && Object.keys(props).filter(prop => prop === CATEGORY_ID).length);\n\nconst buildPropsQuery = (data, extraProps = [], cardOptions = null) => {\n  const extraPropsHaveCategory = !!extraProps.filter(prop => prop.includes('category.')).length;\n\n  const { typeBasedProps, shouldAddCategoryProps } = getTypeBaseProps(\n    data,\n    cardOptions,\n    extraPropsHaveCategory\n  );\n\n  const allProps = [...typeBasedProps, ...extraProps];\n\n  const uniqueProps = [...new Set([...allProps])];\n\n  const basicProps = uniqueProps\n    .filter(prop => prop && !prop.includes('.'))\n    .filter((prop, i, arr) => arr.indexOf(prop) === i);\n  const complexProps = buildComplexProps(shouldAddCategoryProps, uniqueProps);\n\n  return [...basicProps, ...complexProps].join(',');\n};\n\nconst buildComplexProps = (shouldAddCategoryProps, props) =>\n  props\n    .filter(prop => prop && prop.includes('.'))\n    .map(nested => nested.split('.')[0])\n    .filter((prop, i, arr) => arr.indexOf(prop) === i)\n    .map(base => {\n      const nestedProps = props\n        .filter(\n          (extraProp, i, arr) =>\n            extraProp && extraProp.startsWith(`${base}.`) && arr.indexOf(extraProp) === i\n        )\n        .map(nested => nested.split('.')[1]);\n\n      const jointNestedProps = nestedProps.join(',');\n      if (base === 'category' && shouldAddCategoryProps)\n        return `${base}{${jointNestedProps}, ${categoryProps}}`;\n      if (base.includes('published')) {\n        return `${base}{${jointNestedProps},url}`;\n      }\n      return `${base}{${jointNestedProps}}`;\n    });\n\nconst getTypeBaseProps = (data, cardOptions, extraPropsHaveCategory) => {\n  const isCard = !!cardOptions;\n  const { displayCategory = true, displayThumbnail = true } = cardOptions || {};\n\n  const shouldAddCategoryProps =\n    (isCard && displayCategory) || (!isCard && !extraPropsHaveCategory);\n\n  if (!isCard) return { typeBasedProps: [ID], shouldAddCategoryProps };\n\n  const { getEntitySchema } = data;\n  const { interfaces, properties, dynamicProperties, relations } = getEntitySchema;\n\n  const isContent = !!interfaces.includes('content/content');\n  const hasCategory = checkProps(properties) || checkProps(dynamicProperties);\n  const hasPreheader = properties[PREHEADER_PROP];\n\n  const typeBasedProps = [...defaultProps];\n\n  typeBasedProps.push(...getCategoyProps(shouldAddCategoryProps, hasCategory, hasPreheader));\n  typeBasedProps.push(...getContentProps(isContent));\n\n  if (displayThumbnail && relations.find(({ localField }) => localField === 'image')) {\n    typeBasedProps.push('image.id', 'image.url', 'image.data');\n  }\n\n  return { typeBasedProps, shouldAddCategoryProps };\n};\n\nconst getContentProps = isContent => (isContent ? ['url', 'sponsored', 'featured'] : []);\n\nconst getCategoyProps = (shouldAddCategoryProps, hasCategory, hasPreheader) => {\n  if (!shouldAddCategoryProps) return [];\n\n  const props = [];\n\n  if (hasCategory) {\n    props.push('category.name', 'category.listingPageId', 'category.listingPageEntity');\n  }\n\n  if (hasPreheader) {\n    props.push(`${PREHEADER_PROP}{name}`);\n    props.push(HEADLINE_PROP);\n  }\n\n  return props;\n};\n\nexport default buildPropsQuery;\n"],"file":"build-props-query.js"}
+{"version":3,"sources":["../../src/helpers/build-props-query.js"],"names":["CATEGORY_ID","ID","PREHEADER_PROP","HEADLINE_PROP","defaultProps","categoryProps","checkProps","props","Object","keys","filter","prop","length","buildPropsQuery","data","extraProps","cardOptions","extraPropsHaveCategory","includes","typeBasedProps","shouldAddCategoryProps","getTypeBaseProps","allProps","uniqueProps","Set","basicProps","i","arr","indexOf","complexProps","buildComplexProps","join","getEntitySchema","relations","map","nested","split","base","matchingRelation","find","localField","nestedProps","extraProp","startsWith","push","jointNestedProps","isCard","displayCategory","displayThumbnail","interfaces","properties","dynamicProperties","isContent","hasCategory","hasPreheader","getCategoyProps","getContentProps","url"],"mappings":"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","sourcesContent":["import { CATEGORY_ID, ID, PREHEADER_PROP, HEADLINE_PROP } from '../constants';\n\nconst defaultProps = [ID, 'name'];\nconst categoryProps = 'id publishedListingPage{id, url}';\n\nconst checkProps = props =>\n  !!(props && Object.keys(props).filter(prop => prop === CATEGORY_ID).length);\n\nconst buildPropsQuery = (data, extraProps = [], cardOptions = null) => {\n  const extraPropsHaveCategory = !!extraProps.filter(prop => prop.includes('category.')).length;\n\n  const { typeBasedProps, shouldAddCategoryProps } = getTypeBaseProps(\n    data,\n    cardOptions,\n    extraPropsHaveCategory\n  );\n\n  const allProps = [...typeBasedProps, ...extraProps];\n\n  const uniqueProps = [...new Set([...allProps])];\n\n  const basicProps = uniqueProps\n    .filter(prop => prop && !prop.includes('.'))\n    .filter((prop, i, arr) => arr.indexOf(prop) === i);\n  const complexProps = buildComplexProps(shouldAddCategoryProps, uniqueProps, data);\n  return [...basicProps, ...complexProps].join(',');\n};\n\nconst buildComplexProps = (shouldAddCategoryProps, props, { getEntitySchema: { relations } }) =>\n  props\n    .filter(prop => prop && prop.includes('.'))\n    .map(nested => nested.split('.')[0])\n    .filter((prop, i, arr) => arr.indexOf(prop) === i)\n    .map(base => {\n      const matchingRelation = relations.find(({ localField }) => localField === base);\n      const nestedProps = props\n        .filter(\n          (extraProp, i, arr) =>\n            extraProp && extraProp.startsWith(`${base}.`) && arr.indexOf(extraProp) === i\n        )\n        .map(nested => nested.split('.')[1]);\n      if (matchingRelation && !nestedProps.includes('id')) nestedProps.push('id');\n\n      const jointNestedProps = nestedProps.join(',');\n      if (base === 'category' && shouldAddCategoryProps)\n        return `${base}{${jointNestedProps}, ${categoryProps}}`;\n      if (base.includes('published')) {\n        return `${base}{${jointNestedProps},url}`;\n      }\n      return `${base}{${jointNestedProps}}`;\n    });\n\nconst getTypeBaseProps = (data, cardOptions, extraPropsHaveCategory) => {\n  const isCard = !!cardOptions;\n  const { displayCategory = true, displayThumbnail = true } = cardOptions || {};\n\n  const shouldAddCategoryProps =\n    (isCard && displayCategory) || (!isCard && !extraPropsHaveCategory);\n\n  if (!isCard) return { typeBasedProps: [ID], shouldAddCategoryProps };\n\n  const { getEntitySchema } = data;\n  const { interfaces, properties, dynamicProperties, relations } = getEntitySchema;\n\n  const isContent = !!interfaces.includes('content/content');\n  const hasCategory = checkProps(properties) || checkProps(dynamicProperties);\n  const hasPreheader = properties[PREHEADER_PROP];\n\n  const typeBasedProps = [...defaultProps];\n\n  typeBasedProps.push(...getCategoyProps(shouldAddCategoryProps, hasCategory, hasPreheader));\n  typeBasedProps.push(...getContentProps(isContent));\n\n  if (properties.url || dynamicProperties.url) typeBasedProps.push('url');\n\n  if (displayThumbnail && relations.find(({ localField }) => localField === 'image')) {\n    typeBasedProps.push('image.id', 'image.url', 'image.data');\n  }\n\n  return { typeBasedProps, shouldAddCategoryProps };\n};\n\nconst getContentProps = isContent => (isContent ? ['url', 'sponsored', 'featured'] : []);\n\nconst getCategoyProps = (shouldAddCategoryProps, hasCategory, hasPreheader) => {\n  if (!shouldAddCategoryProps) return [];\n\n  const props = [];\n\n  if (hasCategory) {\n    props.push('category.name', 'category.listingPageId', 'category.listingPageEntity');\n  }\n\n  if (hasPreheader) {\n    props.push(`${PREHEADER_PROP}{name}`);\n    props.push(HEADLINE_PROP);\n  }\n\n  return props;\n};\n\nexport default buildPropsQuery;\n"],"file":"build-props-query.js"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blaze-cms/react-page-builder",
-  "version": "0.124.0-alpha.3",
+  "version": "0.124.0-alpha.7",
   "description": "Blaze react page builder",
   "main": "lib/index.js",
   "module": "lib-es/index.js",
@@ -84,5 +84,5 @@
     "lib/*",
     "lib-es/*"
   ],
-  "gitHead": "a1111541646b69aba70356809b369b61da895d99"
+  "gitHead": "45228d668dd07cda68e55330f9028fbacb4a034f"
 }

package/src/application/query/index.js

@@ -156,6 +156,10 @@ const getPublishedContent = entity => `
         ... on ${entity} {
           id
           name
+          image {
+            url
+            __typename
+          }
           url
           __typename
         }

package/src/components/SearchContent/index.js

@@ -1,12 +1,15 @@
 import React, { useState } from 'react';
 import PropTypes from 'prop-types';
-import { gql, useQuery } from '@apollo/client';
+import { gql, useApolloClient } from '@apollo/client';
+
 import { useRouter } from 'next/router';
 import { getPublishedContent } from '../../application/query';
 import BlazeLink from '../BlazeLink';
 
+const logError = error => error;
+
 const SearchContent = ({
-  entity,
+  entities,
   searchInputAlignment,
   searchInputWrapperMobile,
   searchInputWrapperDesktop,
@@ -16,44 +19,79 @@ const SearchContent = ({
 }) => {
   const [collapsed, setCollapsed] = useState(collapsible);
   const [searchTerm, setSearchTerm] = useState(null);
+  const [data, setData] = useState([]);
+
   const router = useRouter();
+  const client = useApolloClient();
 
   const capitalize = s => {
     if (typeof s !== 'string') return '';
     return s.charAt(0).toUpperCase() + s.slice(1);
   };
 
-  const [a, b] = entity.split('_');
-
-  const entityName = capitalize(a) + capitalize(b);
+  React.useEffect(() => {
+    if (data && data.length !== 0) return;
+
+    const promises = entities.map(entity => {
+      const [a, b] = entity.split('_');
+
+      const entityName = capitalize(a) + capitalize(b);
+
+      const rawQueryStringified = JSON.stringify({
+        size: 0,
+        query: {
+          bool: {
+            should: [
+              {
+                match: {
+                  docType: entity
+                }
+              }
+            ],
+            minimum_should_match: 1
+          }
+        }
+      });
 
-  const rawQueryStringified = JSON.stringify({
-    size: 0,
-    query: {
-      bool: {
-        should: [
-          {
-            match: {
-              docType: entity
-            }
+      const query = gql`
+        ${getPublishedContent(entityName)}
+      `;
+
+      try {
+        return client.query({
+          query,
+          variables: {
+            rawQueryStringified,
+            offset: 0,
+            limit: 5
           }
-        ],
-        minimum_should_match: 1
+        });
+      } catch (e) {
+        return [];
       }
+    });
+
+    try {
+      (async () => {
+        try {
+          const fetchResults = await Promise.all(promises);
+          const searchResults = fetchResults
+            .map(result => {
+              const { data: resultData } = result;
+              return resultData.searchPublishedContent.results;
+            })
+            .flat();
+
+          setData(searchResults);
+        } catch (e) {
+          logError(e);
+        }
+      })();
+    } catch (e) {
+      logError(e);
     }
   });
 
-  const query = gql`
-    ${getPublishedContent(entityName)}
-  `;
-
-  const { loading, error, data } = useQuery(query, {
-    variables: { rawQueryStringified, offset: 0, limit: 5 }
-  });
-
-  if (loading) return null;
-  if (error) return null;
-
   const handleClick = (e, url) => {
     e.preventDefault();
     router.push(url);
@@ -65,26 +103,28 @@ const SearchContent = ({
     }
   };
 
-  const renderResults = () => {
+  const renderResults = () =>
     // eslint-disable-next-line no-undef
-    const { results } = data?.searchPublishedContent;
+    data?.map(dataItem => {
+      const { name, image, url } = dataItem;
 
-    if (results && searchTerm && searchTerm !== '') {
-      return results.map(({ name, url }) => {
+      if (searchTerm && searchTerm !== '') {
         if (name.includes(searchTerm)) {
           return (
             <BlazeLink href={url} onClick={e => handleClick(e, url)}>
-              {name}
+              <div className="mt-2 mb-1">
+                <div className="flex justify-start items-center">
+                  {image.url ? <img src={image.url} alt={name} className="w-20 h-14" /> : null}
+                  <span className="ml-2">{name}</span>
+                </div>
+              </div>
             </BlazeLink>
           );
         }
 
         return null;
-      });
-    }
-
-    return [];
-  };
+      }
+    });
 
   const searchResultsMessage = searchTerm ? `Search results for: ${searchTerm}` : '';
 
@@ -164,7 +204,7 @@ SearchContent.propTypes = {
   placeholder: PropTypes.string,
   isMobile: PropTypes.bool,
   collapsible: PropTypes.bool,
-  entity: PropTypes.string.isRequired
+  entities: PropTypes.array.isRequired
 };
 
 SearchContent.defaultProps = {

package/src/helpers/build-props-query.js

@@ -22,23 +22,24 @@ const buildPropsQuery = (data, extraProps = [], cardOptions = null) => {
   const basicProps = uniqueProps
     .filter(prop => prop && !prop.includes('.'))
     .filter((prop, i, arr) => arr.indexOf(prop) === i);
-  const complexProps = buildComplexProps(shouldAddCategoryProps, uniqueProps);
-
+  const complexProps = buildComplexProps(shouldAddCategoryProps, uniqueProps, data);
   return [...basicProps, ...complexProps].join(',');
 };
 
-const buildComplexProps = (shouldAddCategoryProps, props) =>
+const buildComplexProps = (shouldAddCategoryProps, props, { getEntitySchema: { relations } }) =>
   props
     .filter(prop => prop && prop.includes('.'))
     .map(nested => nested.split('.')[0])
     .filter((prop, i, arr) => arr.indexOf(prop) === i)
     .map(base => {
+      const matchingRelation = relations.find(({ localField }) => localField === base);
       const nestedProps = props
         .filter(
           (extraProp, i, arr) =>
             extraProp && extraProp.startsWith(`${base}.`) && arr.indexOf(extraProp) === i
         )
         .map(nested => nested.split('.')[1]);
+      if (matchingRelation && !nestedProps.includes('id')) nestedProps.push('id');
 
       const jointNestedProps = nestedProps.join(',');
       if (base === 'category' && shouldAddCategoryProps)
@@ -70,6 +71,8 @@ const getTypeBaseProps = (data, cardOptions, extraPropsHaveCategory) => {
   typeBasedProps.push(...getCategoyProps(shouldAddCategoryProps, hasCategory, hasPreheader));
   typeBasedProps.push(...getContentProps(isContent));
 
+  if (properties.url || dynamicProperties.url) typeBasedProps.push('url');
+
   if (displayThumbnail && relations.find(({ localField }) => localField === 'image')) {
     typeBasedProps.push('image.id', 'image.url', 'image.data');
   }

package/tests/unit/src/helpers/build-props-query.test.js

@@ -33,6 +33,7 @@ describe('get card render props', () => {
       dynamicProperties: {}
     }
   };
+
   const cardProps = {};
 
   it('should be a function', () => {
@@ -159,4 +160,46 @@ describe('get card render props', () => {
       'id,name,url,sponsored,featured,category{name,listingPageId,listingPageEntity, id publishedListingPage{id, url}}'
     );
   });
+
+  it('should include url if property has url', () => {
+    testUrlProperty({ extraProperties: { url: 'url' }, cardProps });
+  });
+
+  it('should include url if dynamic property has url', () => {
+    testUrlProperty({ dynamicProperties: { url: 'url' }, cardProps });
+  });
+
+  it('should add id prop to nested relations', () => {
+    const _data = {
+      getEntitySchema: {
+        interfaces: [CONTENT_INTERFACE],
+        properties: {
+          id: 'id',
+          categoryId: 'catId'
+        },
+        relations: [{ localField: 'address' }],
+        dynamicProperties: {}
+      }
+    };
+    const query = buildPropsQuery(_data, ['address.country'], cardProps);
+    expect(query).toEqual(
+      'id,name,url,sponsored,featured,category{name,listingPageId,listingPageEntity, id publishedListingPage{id, url}},address{country,id}'
+    );
+  });
 });
+
+function testUrlProperty({ extraProperties = {}, dynamicProperties = {}, cardProps }) {
+  const dataWithUrlProperty = {
+    getEntitySchema: {
+      interfaces: [],
+      properties: {
+        id: 'id',
+        ...extraProperties
+      },
+      relations: [],
+      dynamicProperties
+    }
+  };
+  const query = buildPropsQuery(dataWithUrlProperty, [], cardProps);
+  expect(query).toEqual('id,name,url');
+}