Add ability to limit where popupDialog appears with regex

cardigan/stories/components/PopupDialog/PopupDialog.stories.tsx

@@ -26,6 +26,7 @@ const meta: Meta<typeof PopupDialog> = {
           },
         ],
         isShown: true,
+        routeRegex: null,
       },
     },
   },

common/customtypes/popup-dialog/index.json

@@ -3,6 +3,7 @@
   "label": "Popup dialog",
   "repeatable": false,
   "status": true,
+  "format": "custom",
   "json": {
     "Popup dialog": {
       "openButtonText": {
@@ -44,8 +45,14 @@
           "default_value": false,
           "label": "Is shown?"
         }
+      },
+      "routeRegex": {
+        "type": "Text",
+        "config": {
+          "label": "Route regex",
+          "placeholder": "Pipe-separated (|) list of page paths here if you only want this on certain pages"
+        }
       }
     }
-  },
-  "format": "custom"
+  }
 }

common/prismicio-types.d.ts

@@ -4221,6 +4221,17 @@ interface PopupDialogDocumentData {
    * - **Documentation**: https://prismic.io/docs/field#boolean
    */
   isShown: prismic.BooleanField;
+
+  /**
+   * Route regex field in *Popup dialog*
+   *
+   * - **Field Type**: Text
+   * - **Placeholder**: Pipe-separated (|) list of page paths here if you only want this on certain pages
+   * - **API ID Path**: popup-dialog.routeRegex
+   * - **Tab**: Popup dialog
+   * - **Documentation**: https://prismic.io/docs/field#key-text
+   */
+  routeRegex: prismic.KeyTextField;
 }
 
 /**

common/server-data/prismic.ts

@@ -40,6 +40,7 @@ export const defaultValue = {
       openButtonText: null,
       text: [] as prismic.RichTextField,
       title: null,
+      routeRegex: null,
     },
   },
   collectionVenues: {

common/services/prismic/documents.ts

@@ -101,5 +101,6 @@ export function emptyPopupDialog(): RawPopupDialogDocument {
     openButtonText: null,
     text: [],
     title: null,
+    routeRegex: null,
   }) as RawPopupDialogDocument;
 }

common/test/fixtures/prismicData/prismic-data.ts

@@ -32,6 +32,7 @@ const prismicData: SimplifiedPrismicData = {
         url: 'https://interviewer.djsresearch.com/scripts/Dubinterviewer.dll/Frames?Quest=7577',
       },
       isShown: false,
+      routeRegex: null,
     },
   },
   collectionVenues: {

common/views/components/PageLayout/PageLayout.tsx

@@ -341,7 +341,11 @@ const PageLayoutComponent: FunctionComponent<Props> = ({
               }}
             />
           )}
-        {popupDialog.data.isShown && <PopupDialog document={popupDialog} />}
+        {popupDialog.data.isShown &&
+          (!popupDialog.data.routeRegex ||
+            urlString.match(new RegExp(popupDialog.data.routeRegex))) && (
+            <PopupDialog document={popupDialog} />
+          )}
         <div
           id="main"
           className="main"