@triptease/tt-navbar 0.0.53 → 0.0.55

package/dist/web/urlMappings.js

@@ -1,26 +1,17 @@
 /**
-* @triptease/tt-navbar v0.0.53
+* @triptease/tt-navbar v0.0.55
 */
 
 // src/urlMappings.ts
 var urlMappings = {
-  "/paidsearch/$CLIENT_KEY/performance": "/channels",
-  "/meta/$CLIENT_KEY/performance": "/channels",
-  "/retargeting/$CLIENT_KEY/performance": "/channels",
-  "/retargeting/$CLIENT_KEY/ad-config": "/channels",
-  "/messages/$CLIENT_KEY/messages": "/channels",
-  "/messages/$CLIENT_KEY/messages/wizard": "/channels",
-  "/messages/$CLIENT_KEY/messages/type": "/channels",
-  "/messages/$CLIENT_KEY/messages/notifications": "/channels",
-  "/messages/$CLIENT_KEY/messages/templates/nudge": "/channels",
-  "/$CLIENT_KEY/email": "/channels",
-  "/pricematch/$CLIENT_KEY/performance": "/channels",
-  "/chat/insights/$CLIENT_KEY": "/channels",
-  "/settings/$CLIENT_KEY/branding": "/settings/$CLIENT_KEY/guides",
-  "/settings/$CLIENT_KEY/price-check": "/settings/$CLIENT_KEY/guides",
-  "/settings/$CLIENT_KEY/price-config": "/settings/$CLIENT_KEY/guides",
-  "/settings/$CLIENT_KEY/hotel-details-finder": "/settings/$CLIENT_KEY/guides",
-  "/settings/$CLIENT_KEY/deactivation-center": "/settings/$CLIENT_KEY/guides"
+  "/paidsearch/:clientKey/*": "/channels",
+  "/meta/:clientKey/*": "/channels",
+  "/retargeting/:clientKey/*": "/channels",
+  "/messages/:clientKey/*": "/channels",
+  "/:clientKey/email": "/channels",
+  "/pricematch/:clientKey/*": "/channels",
+  "/chat/insights/:clientKey": "/channels",
+  "/settings/:clientKey/*": "/settings/$CLIENT_KEY/guides"
 };
 export {
   urlMappings

package/dist/web/urlMappings.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/urlMappings.ts"],
-  "sourcesContent": ["type UrlMapping = Record<string, string>;\n\nconst urlMappings: UrlMapping = {\n  '/paidsearch/$CLIENT_KEY/performance': '/channels',\n  '/meta/$CLIENT_KEY/performance': '/channels',\n  '/retargeting/$CLIENT_KEY/performance': '/channels',\n  '/retargeting/$CLIENT_KEY/ad-config': '/channels',\n  '/messages/$CLIENT_KEY/messages': '/channels',\n  '/messages/$CLIENT_KEY/messages/wizard': '/channels',\n  '/messages/$CLIENT_KEY/messages/type': '/channels',\n  '/messages/$CLIENT_KEY/messages/notifications': '/channels',\n  '/messages/$CLIENT_KEY/messages/templates/nudge': '/channels',\n  '/$CLIENT_KEY/email': '/channels',\n  '/pricematch/$CLIENT_KEY/performance': '/channels',\n  '/chat/insights/$CLIENT_KEY': '/channels',\n  '/settings/$CLIENT_KEY/branding': '/settings/$CLIENT_KEY/guides',\n  '/settings/$CLIENT_KEY/price-check': '/settings/$CLIENT_KEY/guides',\n  '/settings/$CLIENT_KEY/price-config': '/settings/$CLIENT_KEY/guides',\n  '/settings/$CLIENT_KEY/hotel-details-finder': '/settings/$CLIENT_KEY/guides',\n  '/settings/$CLIENT_KEY/deactivation-center': '/settings/$CLIENT_KEY/guides',\n};\n\nexport { urlMappings };\n"],
-  "mappings": ";;;;;AAEA,IAAM,cAA0B;AAAA,EAC9B,uCAAuC;AAAA,EACvC,iCAAiC;AAAA,EACjC,wCAAwC;AAAA,EACxC,sCAAsC;AAAA,EACtC,kCAAkC;AAAA,EAClC,yCAAyC;AAAA,EACzC,uCAAuC;AAAA,EACvC,gDAAgD;AAAA,EAChD,kDAAkD;AAAA,EAClD,sBAAsB;AAAA,EACtB,uCAAuC;AAAA,EACvC,8BAA8B;AAAA,EAC9B,kCAAkC;AAAA,EAClC,qCAAqC;AAAA,EACrC,sCAAsC;AAAA,EACtC,8CAA8C;AAAA,EAC9C,6CAA6C;AAC/C;",
+  "sourcesContent": ["type UrlMapping = Record<string, string>;\n\nconst urlMappings: UrlMapping = {\n  '/paidsearch/:clientKey/*': '/channels',\n  '/meta/:clientKey/*': '/channels',\n  '/retargeting/:clientKey/*': '/channels',\n  '/messages/:clientKey/*': '/channels',\n  '/:clientKey/email': '/channels',\n  '/pricematch/:clientKey/*': '/channels',\n  '/chat/insights/:clientKey': '/channels',\n  '/settings/:clientKey/*': '/settings/$CLIENT_KEY/guides',\n};\n\nexport { urlMappings };\n"],
+  "mappings": ";;;;;AAEA,IAAM,cAA0B;AAAA,EAC9B,4BAA4B;AAAA,EAC5B,sBAAsB;AAAA,EACtB,6BAA6B;AAAA,EAC7B,0BAA0B;AAAA,EAC1B,qBAAqB;AAAA,EACrB,4BAA4B;AAAA,EAC5B,6BAA6B;AAAA,EAC7B,0BAA0B;AAC5B;",
   "names": []
 }

package/package.json

@@ -3,7 +3,7 @@
   "description": "Webcomponent tt-navbar following open-wc recommendations",
   "license": "MIT",
   "author": "tt-navbar",
-  "version": "0.0.53",
+  "version": "0.0.55",
   "type": "module",
   "main": "dist/src/index.js",
   "module": "dist/src/index.js",

package/src/TtNavbar.ts

@@ -1,5 +1,5 @@
 import { html, LitElement } from 'lit';
-import { property, queryAll, state } from 'lit/decorators.js';
+import { property, query, queryAll, state } from 'lit/decorators.js';
 import { unsafeSVG } from 'lit/directives/unsafe-svg.js';
 import {
   campaigns,
@@ -66,6 +66,9 @@ export class TtNavbar extends LitElement {
   @queryAll('a')
   protected allNavLinks!: Array<HTMLAnchorElement>;
 
+  @query(`a#${Routes.CampaignManager}`)
+  private campaignManagerLink!: HTMLAnchorElement;
+
   protected firstUpdated() {
     this.setActiveState();
   }
@@ -91,6 +94,12 @@ export class TtNavbar extends LitElement {
     super.disconnectedCallback();
   }
 
+  // eslint-disable-next-line no-undef
+  private get mappedUrlPatterns(): URLPattern[] {
+    // eslint-disable-next-line no-undef
+    return Object.keys(urlMappings).map(pattern => new URLPattern({ pathname: pattern, baseURL: window.location.origin }));
+  }
+
   /*
    * Set the active state for the current page.
    *
@@ -119,16 +128,20 @@ export class TtNavbar extends LitElement {
 
     // Check special cases first, as everything will always match on / and return Dashboard
     if (this.activeRoute === Routes.CampaignManager) {
-      const links = Object.values(this.allNavLinks);
-      bestMatch = links.find(link => link.id === Routes.CampaignManager);
+      bestMatch = this.campaignManagerLink;
     }
     if (!bestMatch && this.clientKey) {
       const parsedPath = currentPath.replace(this.clientKey, '$CLIENT_KEY');
-      const mappedUrl = urlMappings[parsedPath];
+      let mappedUrl: string | undefined = urlMappings[parsedPath];
+
+      const matchedPattern = this.mappedUrlPatterns.find(pattern => pattern.test(currentPath, window.location.origin))?.pathname;
+
+      if (matchedPattern) {
+        mappedUrl = urlMappings[matchedPattern];
+      }
+
       if (mappedUrl) {
-        const clientSpecificUrl = mappedUrl.includes('$CLIENT_KEY')
-          ? mappedUrl.replace('$CLIENT_KEY', this.clientKey)
-          : mappedUrl;
+        const clientSpecificUrl= mappedUrl.replace('$CLIENT_KEY', this.clientKey);
         const links = Object.values(this.allNavLinks);
         bestMatch = links.find(link => link.href.includes(clientSpecificUrl));
       }

package/src/styles.ts

@@ -295,6 +295,7 @@ export const styles = css`
     display: flex;
     align-items: center;
     padding: var(--space-scale-1) 0;
+    margin-bottom: var(--space-scale-2);
   }
 
   #client-selector tt-combobox {

package/src/urlMappings.ts

@@ -1,23 +1,14 @@
 type UrlMapping = Record<string, string>;
 
 const urlMappings: UrlMapping = {
-  '/paidsearch/$CLIENT_KEY/performance': '/channels',
-  '/meta/$CLIENT_KEY/performance': '/channels',
-  '/retargeting/$CLIENT_KEY/performance': '/channels',
-  '/retargeting/$CLIENT_KEY/ad-config': '/channels',
-  '/messages/$CLIENT_KEY/messages': '/channels',
-  '/messages/$CLIENT_KEY/messages/wizard': '/channels',
-  '/messages/$CLIENT_KEY/messages/type': '/channels',
-  '/messages/$CLIENT_KEY/messages/notifications': '/channels',
-  '/messages/$CLIENT_KEY/messages/templates/nudge': '/channels',
-  '/$CLIENT_KEY/email': '/channels',
-  '/pricematch/$CLIENT_KEY/performance': '/channels',
-  '/chat/insights/$CLIENT_KEY': '/channels',
-  '/settings/$CLIENT_KEY/branding': '/settings/$CLIENT_KEY/guides',
-  '/settings/$CLIENT_KEY/price-check': '/settings/$CLIENT_KEY/guides',
-  '/settings/$CLIENT_KEY/price-config': '/settings/$CLIENT_KEY/guides',
-  '/settings/$CLIENT_KEY/hotel-details-finder': '/settings/$CLIENT_KEY/guides',
-  '/settings/$CLIENT_KEY/deactivation-center': '/settings/$CLIENT_KEY/guides',
+  '/paidsearch/:clientKey/*': '/channels',
+  '/meta/:clientKey/*': '/channels',
+  '/retargeting/:clientKey/*': '/channels',
+  '/messages/:clientKey/*': '/channels',
+  '/:clientKey/email': '/channels',
+  '/pricematch/:clientKey/*': '/channels',
+  '/chat/insights/:clientKey': '/channels',
+  '/settings/:clientKey/*': '/settings/$CLIENT_KEY/guides',
 };
 
 export { urlMappings };

package/test/tt-navbar.test.ts

@@ -296,6 +296,7 @@ describe('TtNavbar', () => {
     [`/${CLIENT_KEY}/email`, 'Channels'],
     [`/pricematch/${CLIENT_KEY}/performance`, 'Channels'],
     [`/chat/insights/${CLIENT_KEY}`, 'Channels'],
+    [`/messages/${CLIENT_KEY}/messages/new/save-the-search`, 'Channels'],
 
     // Settings routes
     [`/settings/${CLIENT_KEY}/branding`, 'Group settings'],