➕ Add slug input field (wip)

thunderbird · Sep 11, 2024 · e069134 · e069134
1 parent 4e5cce1
commit e069134
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 8 deletions.
diff --git a/frontend/src/components/ScheduleCreation.vue b/frontend/src/components/ScheduleCreation.vue
@@ -101,6 +101,9 @@ const scheduleInput = ref({ ...defaultSchedule });
 // For comparing changes, and resetting to default.
 const referenceSchedule = ref({ ...defaultSchedule });
 
+// Separate input for user link, since it's not directly part of the schedule object
+const slugInput = ref(user.mySlug);
+
 onMounted(() => {
  // Retrieve the current external connections
  externalConnectionStore.fetch(call);
@@ -339,14 +342,6 @@ const toggleBookingConfirmation = (newValue: boolean) => {
  scheduleInput.value.booking_confirmation = newValue;
 };
 
-// track if steps were already visited
-watch(
- () => scheduleInput.value.active,
- (newValue) => {
- emit('updated', newValue ? getScheduleAppointment() : null);
- },
-);
-
 // track if steps were already visited
 watch(
  () => state.value,
@@ -361,6 +356,7 @@ watch(
 // track changes and send schedule updates
 watch(
  () => [
+ scheduleInput.value.active,
  scheduleInput.value.name,
  scheduleInput.value.calendar_id,
  scheduleInput.value.start_date,
@@ -701,6 +697,19 @@ watch(
  </div>
  <div v-show="activeStep4" class="flex flex-col gap-2">
  <hr/>
+ <!-- custom quick link -->
+ <label class="relative flex flex-col gap-1">
+ <div class="font-medium text-gray-500 dark:text-gray-300">
+ {{ t("label.quickLink") }}
+ </div>
+ <div class="flex gap-2">
+ <input
+ type="text"
+ v-model="slugInput"
+ class="w-full rounded-md disabled:cursor-not-allowed"
+ />
+ </div>
+ </label>
  <!-- option to deactivate confirmation -->
  <div class="flex flex-col gap-3">
  <switch-toggle

diff --git a/frontend/src/locales/de.json b/frontend/src/locales/de.json
@@ -256,6 +256,7 @@
  "preferredEmail": "Bevorzugte E-Mail-Adresse",
  "primaryTimeZone": "Primäre Zeitzone",
  "privacy": "Datenschutz",
+ "quickLink": "Kurzlink",
  "refresh": "Erneuern",
  "refreshLink": "Link erneuern",
  "remove": "Entfernen",

diff --git a/frontend/src/locales/en.json b/frontend/src/locales/en.json
@@ -256,6 +256,7 @@
  "preferredEmail": "Preferred Email",
  "primaryTimeZone": "Primary time zone",
  "privacy": "Privacy",
+ "quickLink": "Quick link",
  "refresh": "Refresh",
  "refreshLink": "Refresh link",
  "remove": "Remove",

diff --git a/frontend/src/stores/user-store.ts b/frontend/src/stores/user-store.ts
@@ -38,6 +38,14 @@ export const useUserStore = defineStore('user', () => {
  return data.value.signedUrl;
  });
 
+ /**
+ * Return the last unique URL part of the users link
+ */
+ const mySlug = computed((): string => {
+ const link = myLink.value.replace(/\/+$/, '');
+ return link.slice(link.lastIndexOf('/')+1);
+ });
+
  const authenticated = computed((): boolean => data.value.accessToken !== null);
  /**
  * @deprecated - Use authenticated
@@ -202,6 +210,7 @@ export const useUserStore = defineStore('user', () => {
  login,
  logout,
  myLink,
+ mySlug,
  updateUser,
  finishFTUE,
  };