From 1cbcc6b075d48b4f2ff48048608803ac0fa94160 Mon Sep 17 00:00:00 2001
From: Nicolas Giard <github@ngpixel.com>
Date: Thu, 13 Oct 2022 01:01:33 +0000
Subject: [PATCH 1/3] feat: js compiled url store

---
 client/agenda/AgendaDetailsModal.vue | 21 +++++++++++++++++----
 client/shared/urls.js                | 27 +++++++++++++++++++++++++++
 2 files changed, 44 insertions(+), 4 deletions(-)
 create mode 100644 client/shared/urls.js

diff --git a/client/agenda/AgendaDetailsModal.vue b/client/agenda/AgendaDetailsModal.vue
index a58e8f83f26..0a140b8c4e6 100644
--- a/client/agenda/AgendaDetailsModal.vue
+++ b/client/agenda/AgendaDetailsModal.vue
@@ -152,6 +152,7 @@ import {
 } from 'naive-ui'
 
 import { useAgendaStore } from './store'
+import { getUrl } from '../shared/urls'
 
 // PROPS
 
@@ -205,10 +206,22 @@ const eventDetails = computed(() => {
     title: props.event.type === 'regular' ? `${props.event.groupName} (${props.event.acronym})` : props.event.name,
     showAgenda: props.event.flags.showAgenda,
     materialsUrl: materialsUrl,
-    detailsUrl: `/meeting/${agendaStore.meeting.number}/session/${props.event.acronym}/`,
-    tarUrl: `/meeting/${agendaStore.meeting.number}/agenda/${props.event.acronym}-drafts.tgz`,
-    pdfUrl: `/meeting/${agendaStore.meeting.number}/agenda/${props.event.acronym}-drafts.pdf`,
-    notepadUrl: `https://notes.ietf.org/notes-ietf-${agendaStore.meeting.number}-${props.event.type === 'plenary' ? 'plenary' : props.event.acronym}`,
+    detailsUrl: getUrl('meetingDetails', {
+      meetingNumber: agendaStore.meeting.number,
+      eventAcronym: props.event.acronym
+    }),
+    tarUrl: getUrl('meetingMaterialsTar', {
+      meetingNumber: agendaStore.meeting.number,
+      eventAcronym: props.event.acronym
+    }),
+    pdfUrl: getUrl('meetingMaterialsPdf', {
+      meetingNumber: agendaStore.meeting.number,
+      eventAcronym: props.event.acronym
+    }),
+    notepadUrl: getUrl('meetingNotes', {
+      meetingNumber: agendaStore.meeting.number,
+      eventAcronym: props.event.type === 'plenary' ? 'plenary' : props.event.acronym
+    })
   }
 })
 
diff --git a/client/shared/urls.js b/client/shared/urls.js
new file mode 100644
index 00000000000..bd60a49fd0d
--- /dev/null
+++ b/client/shared/urls.js
@@ -0,0 +1,27 @@
+import template from 'lodash-es/template'
+import transform from 'lodash-es/transform'
+
+const urls = {
+  meetingDetails: '/meeting/{meetingNumber}/session/{eventAcronym}/',
+  meetingMaterialsPdf: '/meeting/{meetingNumber}/agenda/{eventAcronym}-drafts.pdf',
+  meetingMaterialsTar: '/meeting/{meetingNumber}/agenda/{eventAcronym}-drafts.tgz',
+  meetingNotes: 'https://notes.ietf.org/notes-ietf-{meetingNumber}-{eventAcronym}'
+}
+
+const interpolate = /{([\s\S]+?)}/g
+const compiled = transform(urls, (result, value, key) => {
+  result[key] = template(value, { interpolate })
+}, {})
+
+/**
+ * Get an URL and replace tokens with provided values.
+ *
+ * @param {string} key The key of the URL template to use.
+ * @param {Object} [tokens] An object of tokens to replace in the URL template.
+ * @returns {string} URL with tokens replaced with the provided values.
+ */
+export const getUrl = (key, tokens = {}) => {
+  if (!key) { throw new Error('Must provide a key for getUrl()') }
+  if (!compiled[key]) { throw new Error('Invalid getUrl() key') }
+  return compiled[key](tokens)
+}

From 4c8a3fcbdcf1deb090a6ff8c34ea26ac6b7ce95e Mon Sep 17 00:00:00 2001
From: Nicolas Giard <github@ngpixel.com>
Date: Thu, 13 Oct 2022 20:27:06 +0000
Subject: [PATCH 2/3] feat: use url store for
 AgendaFilter-MobileBar-QuickAccess components

---
 client/agenda/AgendaFilter.vue      | 3 ++-
 client/agenda/AgendaMobileBar.vue   | 7 ++++---
 client/agenda/AgendaQuickAccess.vue | 9 +++++----
 client/shared/urls.js               | 2 ++
 4 files changed, 13 insertions(+), 8 deletions(-)

diff --git a/client/agenda/AgendaFilter.vue b/client/agenda/AgendaFilter.vue
index 5209b174ac1..e6ab90a62c8 100644
--- a/client/agenda/AgendaFilter.vue
+++ b/client/agenda/AgendaFilter.vue
@@ -60,7 +60,7 @@ n-drawer(v-model:show='state.isShown', placement='bottom', :height='state.drawer
                 )
                 template(#trigger)
                   span.badge BoF
-                span #[a(href='https://www.ietf.org/how/bofs/', target='_blank') Birds of a Feather] sessions (BoFs) are initial discussions about a particular topic of interest to the IETF community.
+                span #[a(:href='getUrl(`bofDefinition`)', target='_blank') Birds of a Feather] sessions (BoFs) are initial discussions about a particular topic of interest to the IETF community.
 </template>
 
 <script setup>
@@ -77,6 +77,7 @@ import {
 } from 'naive-ui'
 
 import { useAgendaStore } from './store'
+import { getUrl } from '../shared/urls'
 
 // STORES
 
diff --git a/client/agenda/AgendaMobileBar.vue b/client/agenda/AgendaMobileBar.vue
index 08a28d451bb..423647cdf7e 100644
--- a/client/agenda/AgendaMobileBar.vue
+++ b/client/agenda/AgendaMobileBar.vue
@@ -32,6 +32,7 @@ import {
 
 import { useAgendaStore } from './store'
 import { useSiteStore } from '../shared/store';
+import { getUrl } from '../shared/urls'
 
 // MESSAGE PROVIDER
 
@@ -64,11 +65,11 @@ function downloadIcs (key) {
   let icsUrl = ''
   if (agendaStore.pickerMode) {
     const sessionKeywords = agendaStore.scheduleAdjusted.map(s => s.sessionKeyword)
-    icsUrl = `/meeting/${agendaStore.meeting.number}/agenda.ics?show=${sessionKeywords.join(',')}`
+    icsUrl = `${getUrl('meetingCalIcs', { meetingNumber: agendaStore.meeting.number })}?show=${sessionKeywords.join(',')}`
   } else if (agendaStore.selectedCatSubs.length > 0) {
-    icsUrl = `/meeting/${agendaStore.meeting.number}/agenda.ics?show=${agendaStore.selectedCatSubs.join(',')}`
+    icsUrl = `${getUrl('meetingCalIcs', { meetingNumber: agendaStore.meeting.number })}?show=${agendaStore.selectedCatSubs.join(',')}`
   } else {
-    icsUrl = `/meeting/${agendaStore.meeting.number}/agenda.ics`
+    icsUrl = `${getUrl('meetingCalIcs', { meetingNumber: agendaStore.meeting.number })}`
   }
   if (key === 'subscribe') {
     window.location.assign(`webcal://${window.location.host}${icsUrl}`)
diff --git a/client/agenda/AgendaQuickAccess.vue b/client/agenda/AgendaQuickAccess.vue
index 326d78f911c..8823ca13e76 100644
--- a/client/agenda/AgendaQuickAccess.vue
+++ b/client/agenda/AgendaQuickAccess.vue
@@ -120,7 +120,8 @@ import {
 } from 'naive-ui'
 
 import { useAgendaStore } from './store'
-import { useSiteStore } from '../shared/store';
+import { useSiteStore } from '../shared/store'
+import { getUrl } from '../shared/urls'
 
 // MESSAGE PROVIDER
 
@@ -181,11 +182,11 @@ function downloadIcs (key) {
   let icsUrl = ''
   if (agendaStore.pickerMode) {
     const sessionKeywords = agendaStore.scheduleAdjusted.map(s => s.sessionKeyword)
-    icsUrl = `/meeting/${agendaStore.meeting.number}/agenda.ics?show=${sessionKeywords.join(',')}`
+    icsUrl = `${getUrl('meetingCalIcs', { meetingNumber: agendaStore.meeting.number })}?show=${sessionKeywords.join(',')}`
   } else if (agendaStore.selectedCatSubs.length > 0) {
-    icsUrl = `/meeting/${agendaStore.meeting.number}/agenda.ics?show=${agendaStore.selectedCatSubs.join(',')}`
+    icsUrl = `${getUrl('meetingCalIcs', { meetingNumber: agendaStore.meeting.number })}?show=${agendaStore.selectedCatSubs.join(',')}`
   } else {
-    icsUrl = `/meeting/${agendaStore.meeting.number}/agenda.ics`
+    icsUrl = `${getUrl('meetingCalIcs', { meetingNumber: agendaStore.meeting.number })}`
   }
   if (key === 'subscribe') {
     window.location.assign(`webcal://${window.location.host}${icsUrl}`)
diff --git a/client/shared/urls.js b/client/shared/urls.js
index bd60a49fd0d..478c0b4f4cf 100644
--- a/client/shared/urls.js
+++ b/client/shared/urls.js
@@ -2,6 +2,8 @@ import template from 'lodash-es/template'
 import transform from 'lodash-es/transform'
 
 const urls = {
+  bofDefinition: 'https://www.ietf.org/how/bofs/',
+  meetingCalIcs: '/meeting/{meetingNumber}/agenda.ics',
   meetingDetails: '/meeting/{meetingNumber}/session/{eventAcronym}/',
   meetingMaterialsPdf: '/meeting/{meetingNumber}/agenda/{eventAcronym}-drafts.pdf',
   meetingMaterialsTar: '/meeting/{meetingNumber}/agenda/{eventAcronym}-drafts.tgz',

From 51beecb50cb6d94c380926f59d9e41d842269bf2 Mon Sep 17 00:00:00 2001
From: Nicolas Giard <github@ngpixel.com>
Date: Fri, 14 Oct 2022 04:27:07 +0000
Subject: [PATCH 3/3] feat: use url store for AgendaScheduleList (wip)

---
 client/agenda/AgendaScheduleList.vue | 21 +++++++++++++++++----
 client/shared/urls.js                |  1 +
 2 files changed, 18 insertions(+), 4 deletions(-)

diff --git a/client/agenda/AgendaScheduleList.vue b/client/agenda/AgendaScheduleList.vue
index e3356913c0a..64c6eabc016 100644
--- a/client/agenda/AgendaScheduleList.vue
+++ b/client/agenda/AgendaScheduleList.vue
@@ -202,6 +202,7 @@ import AgendaDetailsModal from './AgendaDetailsModal.vue'
 
 import { useAgendaStore } from './store'
 import { useSiteStore } from '../shared/store'
+import { getUrl } from '../shared/urls'
 
 // MESSAGE PROVIDER
 
@@ -275,14 +276,20 @@ const meetingEvents = computed(() => {
           id: `lnk-${item.id}-tar`,
           label: 'Download meeting materials as .tar archive',
           icon: 'file-zip',
-          href: `/meeting/${agendaStore.meeting.number}/agenda/${item.acronym}-drafts.tgz`,
+          href: getUrl('meetingMaterialsTar', {
+            meetingNumber: agendaStore.meeting.number,
+            eventAcronym: item.acronym
+          }),
           color: 'brown'
         })
         links.push({
           id: `lnk-${item.id}-pdf`,
           label: 'Download meeting materials as PDF file',
           icon: 'file-pdf',
-          href: `/meeting/${agendaStore.meeting.number}/agenda/${item.acronym}-drafts.pdf`,
+          href: getUrl('meetingMaterialsPdf', {
+            meetingNumber: agendaStore.meeting.number,
+            eventAcronym: item.acronym
+          }),
           color: 'red'
         })
       }
@@ -291,7 +298,10 @@ const meetingEvents = computed(() => {
           id: `lnk-${item.id}-note`,
           label: 'Notepad for note-takers',
           icon: 'journal-text',
-          href: `https://notes.ietf.org/notes-ietf-${agendaStore.meeting.number}-${item.type === 'plenary' ? 'plenary' : item.acronym}`,
+          href: getUrl('meetingNotes', {
+            meetingNumber: agendaStore.meeting.number,
+            eventAcronym: item.type === 'plenary' ? 'plenary' : item.acronym
+          }),
           color: 'blue'
         })
       }
@@ -404,7 +414,10 @@ const meetingEvents = computed(() => {
               id: `lnk-${item.id}-rec`,
               label: 'Session recording',
               icon: 'film',
-              href: `https://www.meetecho.com/ietf${agendaStore.meeting.number}/recordings#${item.acronym.toUpperCase()}`,
+              href: getUrl('meetingMeetechoRecordings', {
+                meetingNumber: agendaStore.meeting.number,
+                eventAcronym: item.acronym.toUpperCase()
+              }),
               color: 'purple'
             })
           }
diff --git a/client/shared/urls.js b/client/shared/urls.js
index 478c0b4f4cf..b60d656fe99 100644
--- a/client/shared/urls.js
+++ b/client/shared/urls.js
@@ -7,6 +7,7 @@ const urls = {
   meetingDetails: '/meeting/{meetingNumber}/session/{eventAcronym}/',
   meetingMaterialsPdf: '/meeting/{meetingNumber}/agenda/{eventAcronym}-drafts.pdf',
   meetingMaterialsTar: '/meeting/{meetingNumber}/agenda/{eventAcronym}-drafts.tgz',
+  meetingMeetechoRecordings: 'https://www.meetecho.com/ietf{meetingNumber}/recordings#{eventAcronym}',
   meetingNotes: 'https://notes.ietf.org/notes-ietf-{meetingNumber}-{eventAcronym}'
 }