chore(deps): update dependency vuetify to v4.1.8

feat(editor): improve desing
Signed-off-by: Sebastian Krupinski <krupinski01@gmail.com>
2026-08-08 03:02:21 +00:00 · 2026-08-06 21:45:03 -04:00 · 2026-08-06 11:47:38 -04:00
11 changed files with 259 additions and 146 deletions
@@ -19,7 +19,7 @@
        "@vitest/coverage-v8": "^4.1.6",
        "@vue/test-utils": "^2.4.10",
        "@vue/tsconfig": "^0.9.0",
-        "jsdom": "^30.0.0",
+        "jsdom": "^29.1.1",
        "typescript": "~6.0.0",
        "vite": "^8.0.0",
        "vitest": "^4.1.6",
@@ -27,38 +27,56 @@
      }
    },
    "node_modules/@asamuzakjp/css-color": {
-      "version": "6.0.5",
-      "resolved": "https://registry.npmjs.org/@asamuzakjp/css-color/-/css-color-6.0.5.tgz",
-      "integrity": "sha512-mbhpPMmnw/kwW19aRNmSUl1QzLbdGo1SCuE49BT98MNwqF6zaHb3o2owssFc/PEO/4t2UjqtCNwocuDtJornzA==",
+      "version": "5.1.11",
+      "resolved": "https://registry.npmjs.org/@asamuzakjp/css-color/-/css-color-5.1.11.tgz",
+      "integrity": "sha512-KVw6qIiCTUQhByfTd78h2yD1/00waTmm9uy/R7Ck/ctUyAPj+AEDLkQIdJW0T8+qGgj3j5bpNKK7Q3G+LedJWg==",
      "dev": true,
      "license": "MIT",
      "dependencies": {
-        "@csstools/css-calc": "^3.2.1",
-        "@csstools/css-color-parser": "^4.1.9",
+        "@asamuzakjp/generational-cache": "^1.0.1",
+        "@csstools/css-calc": "^3.2.0",
+        "@csstools/css-color-parser": "^4.1.0",
        "@csstools/css-parser-algorithms": "^4.0.0",
-        "@csstools/css-tokenizer": "^4.0.0",
-        "lru-cache": "^11.5.2"
+        "@csstools/css-tokenizer": "^4.0.0"
      },
      "engines": {
-        "node": "^22.13.0 || >=24.0.0"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
      }
    },
    "node_modules/@asamuzakjp/dom-selector": {
-      "version": "8.3.0",
-      "resolved": "https://registry.npmjs.org/@asamuzakjp/dom-selector/-/dom-selector-8.3.0.tgz",
-      "integrity": "sha512-UJLfKXBhrc8i1vH2eJXuYQMwlsLKWFw3O+CPqXSuVEiikeAim3UgrfWX0k4tA/X8cRFM8iZ7OaqBokFGbYusdg==",
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/@asamuzakjp/dom-selector/-/dom-selector-7.1.1.tgz",
+      "integrity": "sha512-67RZDnYRc8H/8MLDgQCDE//zoqVFwajkepHZgmXrbwybzXOEwOWGPYGmALYl9J2DOLfFPPs6kKCqmbzV895hTQ==",
      "dev": true,
      "license": "MIT",
      "dependencies": {
+        "@asamuzakjp/generational-cache": "^1.0.1",
+        "@asamuzakjp/nwsapi": "^2.3.9",
        "bidi-js": "^1.0.3",
        "css-tree": "^3.2.1",
-        "is-potential-custom-element-name": "^1.0.1",
-        "lru-cache": "^11.5.2"
+        "is-potential-custom-element-name": "^1.0.1"
      },
      "engines": {
-        "node": "^22.13.0 || >=24.0.0"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
      }
    },
+    "node_modules/@asamuzakjp/generational-cache": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@asamuzakjp/generational-cache/-/generational-cache-1.0.1.tgz",
+      "integrity": "sha512-wajfB8KqzMCN2KGNFdLkReeHncd0AslUSrvHVvvYWuU8ghncRJoA50kT3zP9MVL0+9g4/67H+cdvBskj9THPzg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@asamuzakjp/nwsapi": {
+      "version": "2.3.9",
+      "resolved": "https://registry.npmjs.org/@asamuzakjp/nwsapi/-/nwsapi-2.3.9.tgz",
+      "integrity": "sha512-n8GuYSrI9bF7FFZ/SjhwevlHc8xaVlb/7HmHelnc/PZXBD2ZR49NnN9sMMuDdEGPeeRQ5d0hqlSlEpgCX3Wl0Q==",
+      "dev": true,
+      "license": "MIT"
+    },
    "node_modules/@babel/generator": {
      "version": "8.0.0",
      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-8.0.0.tgz",
@@ -1798,39 +1816,39 @@
      "license": "MIT"
    },
    "node_modules/jsdom": {
-      "version": "30.0.0",
-      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-30.0.0.tgz",
-      "integrity": "sha512-JQHfRGmmKmaZoUAvIgff5jjG/0SzTQlGz8c7t72KzBzo8ZULEjAjnYE0sNwBOUA4QtWwYE2xoYitg8NFsmiYxA==",
+      "version": "29.1.1",
+      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-29.1.1.tgz",
+      "integrity": "sha512-ECi4Fi2f7BdJtUKTflYRTiaMxIB0O6zfR1fX0GXpUrf6flp8QIYn1UT20YQqdSOfk2dfkCwS8LAFoJDEppNK5Q==",
      "dev": true,
      "license": "MIT",
      "dependencies": {
-        "@asamuzakjp/css-color": "^6.0.5",
-        "@asamuzakjp/dom-selector": "^8.2.5",
+        "@asamuzakjp/css-color": "^5.1.11",
+        "@asamuzakjp/dom-selector": "^7.1.1",
        "@bramus/specificity": "^2.4.2",
-        "@csstools/css-syntax-patches-for-csstree": "^1.1.6",
-        "@exodus/bytes": "^1.15.1",
+        "@csstools/css-syntax-patches-for-csstree": "^1.1.3",
+        "@exodus/bytes": "^1.15.0",
        "css-tree": "^3.2.1",
        "data-urls": "^7.0.0",
        "decimal.js": "^10.6.0",
        "html-encoding-sniffer": "^6.0.0",
        "is-potential-custom-element-name": "^1.0.1",
-        "lru-cache": "^11.5.2",
+        "lru-cache": "^11.3.5",
        "parse5": "^8.0.1",
        "saxes": "^6.0.0",
        "symbol-tree": "^3.2.4",
-        "tough-cookie": "^6.0.2",
-        "undici": "^8.7.0",
+        "tough-cookie": "^6.0.1",
+        "undici": "^7.25.0",
        "w3c-xmlserializer": "^5.0.0",
        "webidl-conversions": "^8.0.1",
        "whatwg-mimetype": "^5.0.0",
-        "whatwg-url": "^17.1.0",
+        "whatwg-url": "^16.0.1",
        "xml-name-validator": "^5.0.0"
      },
      "engines": {
-        "node": "^22.22.2 || ^24.15.0 || >=26.0.0"
+        "node": "^20.19.0 || ^22.13.0 || >=24.0.0"
      },
      "peerDependencies": {
-        "canvas": "^3.2.3"
+        "canvas": "^3.0.0"
      },
      "peerDependenciesMeta": {
        "canvas": {
@@ -1838,21 +1856,6 @@
        }
      }
    },
-    "node_modules/jsdom/node_modules/whatwg-url": {
-      "version": "17.1.0",
-      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-17.1.0.tgz",
-      "integrity": "sha512-3GeworPmc2ZfEEHP7lEbUfBX/L75wdEsi0rLNhXcXxnoN5jyq0SL5gCy06SGW2cyTIZdTvWIDQNQoza++vKeaw==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@exodus/bytes": "^1.15.1",
-        "tr46": "^6.0.0",
-        "webidl-conversions": "^8.0.1"
-      },
-      "engines": {
-        "node": "^22.14.0 || >=24.0.0"
-      }
-    },
    "node_modules/jsesc": {
      "version": "3.1.0",
      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-3.1.0.tgz",
@@ -2925,13 +2928,13 @@
      "license": "MIT"
    },
    "node_modules/undici": {
-      "version": "8.9.0",
-      "resolved": "https://registry.npmjs.org/undici/-/undici-8.9.0.tgz",
-      "integrity": "sha512-aWZpUj7XoGonMClx4gdDRfgBjqeA+F473aDmROQQbM9n6PRfK/u1q/a0X4wMTgcHfT8H6fpbt98PFuDUwFg2YA==",
+      "version": "7.28.0",
+      "resolved": "https://registry.npmjs.org/undici/-/undici-7.28.0.tgz",
+      "integrity": "sha512-cRZYrTDwWznlnRiPjggAGxZXanty6M8RV1ff8Wm4LWXBp7/IG8v5DnOm74DtUBp9OONpK75YlPnIjQqX0dBDtA==",
      "dev": true,
      "license": "MIT",
      "engines": {
-        "node": ">=22.19.0"
+        "node": ">=20.18.1"
      }
    },
    "node_modules/unplugin": {
@@ -3275,9 +3278,9 @@
      }
    },
    "node_modules/vuetify": {
-      "version": "4.1.6",
-      "resolved": "https://registry.npmjs.org/vuetify/-/vuetify-4.1.6.tgz",
-      "integrity": "sha512-VOsRTsNfs+FE4JXMONZkqX2yznSqC/FXG9/pgVVjsoqIjUvJg+CfFTuOlgyWVFrZYY+crk7LV9uaiN8bZREV/g==",
+      "version": "4.1.8",
+      "resolved": "https://registry.npmjs.org/vuetify/-/vuetify-4.1.8.tgz",
+      "integrity": "sha512-003D/8b5462uZCD5CMRTZF3smADmOn47mzthNY0aP/xkslovR5yIc1qXjPdFN0LHcu+p3GEAVmMQabldaIQ5pg==",
      "license": "MIT",
      "funding": {
        "type": "github",
@@ -3286,7 +3289,7 @@
      "peerDependencies": {
        "typescript": ">=4.7",
        "vite-plugin-vuetify": ">=2.1.0",
-        "vue": "^3.5.0",
+        "vue": "^3.5.0 || ^3.6.0-0",
        "webpack-plugin-vuetify": ">=3.1.0"
      },
      "peerDependenciesMeta": {
@@ -28,7 +28,7 @@
    "@vitest/coverage-v8": "^4.1.6",
    "@vue/test-utils": "^2.4.10",
    "@vue/tsconfig": "^0.9.0",
-    "jsdom": "^30.0.0",
+    "jsdom": "^29.1.1",
    "typescript": "~6.0.0",
    "vite": "^8.0.0",
    "vitest": "^4.1.6",
@@ -148,8 +148,8 @@ watch(
 </script>

 <template>
-  <v-sheet class="pa-2 text-start overflow-auto" min-height="84vh" max-height="84vh">
-    <div class="event-editor-header d-flex justify-space-between pa-4">
+  <v-sheet class="text-start overflow-auto" color="surface" min-height="84vh" max-height="84vh">
+    <v-sheet class="event-editor-header d-flex justify-space-between pa-4" color="surface">
      <div>
        <v-icon :icon="entityIcon" class="mr-2" />
        {{ entityObject?.label || 'Nothing Selected' }}
@@ -180,7 +180,7 @@ watch(
          @click="$emit('close')"
        />
      </div>
-    </div>
+    </v-sheet>

    <div class="event-editor-fields">
      <v-divider />
@@ -215,6 +215,12 @@ watch(
          @update:description="entityObject!.description = $event"
        />

+        <EventEditorTags
+          :mode="mode"
+          :tags="entityObject!.tags"
+          @update:tags="entityObject!.tags = $event"
+        />
+
        <EventEditorDates
          :mode="mode"
          :starts-on="entityObject!.startsOn"
@@ -260,12 +266,6 @@ watch(
          @remove-notification="removeNotification"
        />

-        <EventEditorTags
-          :mode="mode"
-          :tags="entityObject!.tags"
-          @update:tags="entityObject!.tags = $event"
-        />
-
        <!-- Metadata for view mode -->
        <div v-if="mode === 'view' && entityObject!.created" class="event-editor-section">
          <v-divider class="mb-4"></v-divider>
@@ -285,7 +285,7 @@ watch(
      <v-divider/>
    </div>

-    <div class="event-editor-footer d-flex text-end justify-space-between pa-4">
+    <v-sheet class="event-editor-footer d-flex text-end justify-space-between pa-4" color="surface">
      <v-btn v-if="mode === 'edit'"
        variant="text"
        @click="cancelEdit"
@@ -301,7 +301,7 @@ watch(
        :loading="saving">
        Save
      </v-btn>
-    </div>
+    </v-sheet>
  </v-sheet>
 </template>

@@ -309,4 +309,18 @@ watch(
 .event-editor-section {
  margin-bottom: 1.5rem;
 }
+
+.event-editor-header,
+.event-editor-footer {
+  position: sticky;
+  z-index: 2;
+}
+
+.event-editor-header {
+  top: 0;
+}
+
+.event-editor-footer {
+  bottom: 0;
+}
 </style>
@@ -0,0 +1,96 @@
+<script setup lang="ts">
+import { ref, watch } from 'vue'
+import { formatDisplayDate, formatDisplayTime, formatLocalIsoDate, formatLocalIsoTime } from '@/utils/format'
+
+interface Props {
+  modelValue?: string | null
+}
+
+const props = defineProps<Props>()
+
+const emit = defineEmits<{
+  'update:modelValue': [value: string | null]
+}>()
+
+const dateValue = ref('')
+const timeValue = ref('')
+const dateMenu = ref(false)
+const timeMenu = ref(false)
+
+watch(() => props.modelValue, (value) => {
+  const date = value ? new Date(value) : new Date()
+  dateValue.value = formatLocalIsoDate(date)
+  timeValue.value = formatLocalIsoTime(date)
+}, { immediate: true })
+
+const emitValue = () => {
+  if (!dateValue.value || !timeValue.value) return
+  emit('update:modelValue', new Date(`${dateValue.value}T${timeValue.value}`).toISOString())
+}
+
+const pickerDate = (value: string): Date | null => value ? new Date(`${value}T00:00:00`) : null
+
+const normalizePickerDate = (value: unknown): string => {
+  const selected = Array.isArray(value) ? value[0] : value
+  const date = selected instanceof Date ? selected : new Date(String(selected))
+  return Number.isNaN(date.getTime()) ? '' : formatLocalIsoDate(date)
+}
+
+const selectDate = (value: unknown) => {
+  const date = normalizePickerDate(value)
+  if (date) dateValue.value = date
+  dateMenu.value = false
+  emitValue()
+}
+
+watch(timeValue, () => emitValue())
+</script>
+
+<template>
+  <v-row dense>
+    <v-col cols="6">
+      <v-menu v-model="dateMenu" :close-on-content-click="false" location="bottom start">
+        <template #activator="{ props: activatorProps }">
+          <v-text-field
+            v-bind="activatorProps"
+            :model-value="formatDisplayDate(dateValue)"
+            label="Date"
+            prepend-inner-icon="mdi-calendar"
+            variant="outlined"
+            density="compact"
+            hide-details
+            readonly
+          />
+        </template>
+        <v-date-picker
+          :model-value="pickerDate(dateValue)"
+          color="primary"
+          show-adjacent-months
+          @update:model-value="selectDate"
+        />
+      </v-menu>
+    </v-col>
+    <v-col cols="6">
+      <v-menu v-model="timeMenu" :close-on-content-click="false" location="bottom start">
+        <template #activator="{ props: activatorProps }">
+          <v-text-field
+            v-bind="activatorProps"
+            :model-value="formatDisplayTime(timeValue)"
+            label="Time"
+            prepend-inner-icon="mdi-clock-outline"
+            variant="outlined"
+            density="compact"
+            hide-details
+            readonly
+          />
+        </template>
+        <v-card>
+          <v-time-picker v-model="timeValue" color="primary" format="ampm" />
+          <v-card-actions class="justify-end">
+            <v-btn variant="text" @click="timeMenu = false">Done</v-btn>
+          </v-card-actions>
+        </v-card>
+      </v-menu>
+    </v-col>
+  </v-row>
+</template>
@@ -137,8 +137,6 @@ watch([startDate, startTime, endDate, endTime, timelessValue], () => {

 <template>
  <div class="event-editor-section">
-    <div class="text-subtitle-1 mb-2">Date & Time</div>
-    
    <!-- Read-only view -->
    <div v-if="mode === 'view'">
      <div class="mb-2 pa-2">
@@ -164,7 +162,6 @@ watch([startDate, startTime, endDate, endTime, timelessValue], () => {
      />

      <div class="mb-3">
-        <div class="text-subtitle-2 mb-2">Start</div>
        <v-row dense>
          <v-col cols="12" md="6">
            <v-menu v-model="startDateMenu" :close-on-content-click="false" location="bottom start">
@@ -212,7 +209,6 @@ watch([startDate, startTime, endDate, endTime, timelessValue], () => {
      </div>

      <div class="mb-3">
-        <div class="text-subtitle-2 mb-2">End</div>
        <v-row dense>
          <v-col cols="12" md="6">
            <v-menu v-model="endDateMenu" :close-on-content-click="false" location="bottom start">
@@ -20,7 +20,6 @@ const descriptionValue = computed({

 <template>
  <div v-if="descriptionValue || mode === 'edit'" class="event-editor-section">
-    <div class="text-subtitle-1 mb-2">Description</div>
    <!-- Read-only view -->
    <div v-if="mode === 'view'" class="mb-4">
      <div class="mb-2 pa-2 white-space-pre-wrap">{{ descriptionValue || 'No description' }}</div>
@@ -20,7 +20,6 @@ const labelValue = computed({

 <template>
  <div class="event-editor-section">
-    <div class="text-subtitle-1 mb-2">Title</div>
    <!-- Read-only view -->
    <div v-if="mode === 'view'" class="mb-4">
      <div class="mb-2 pa-2">{{ labelValue || 'Untitled Event' }}</div>
@@ -27,7 +27,7 @@ const hasLocations = () => {
    <!-- Physical Locations -->
    <div v-if="Object.keys(locationsPhysical || {}).length > 0 || mode === 'edit'" class="mb-4">
      <div class="d-flex align-center justify-space-between mb-2">
-        <div class="text-subtitle-2">Physical Locations</div>
+        <div class="text-subtitle-2">Physical</div>
        <v-btn v-if="mode === 'edit'"
          size="small"
          variant="outlined"
@@ -49,8 +49,7 @@ const hasLocations = () => {
      <!-- Edit view -->
      <div v-else>
        <div v-for="(location, key) in locationsPhysical" :key="key" class="mb-3 pa-3 border rounded">
-          <div class="d-flex align-center justify-space-between mb-2">
-            <strong>{{ location.label || 'Physical Location' }}</strong>
+          <div class="d-flex justify-end mb-2">
            <v-btn
              icon="mdi-delete"
              size="small"
@@ -102,7 +101,7 @@ const hasLocations = () => {
    <!-- Virtual Locations -->
    <div v-if="Object.keys(locationsVirtual || {}).length > 0 || mode === 'edit'">
      <div class="d-flex align-center justify-space-between mb-2">
-        <div class="text-subtitle-2">Virtual Locations</div>
+        <div class="text-subtitle-2">Virtual</div>
        <v-btn v-if="mode === 'edit'"
          size="small"
          variant="outlined"
@@ -126,8 +125,7 @@ const hasLocations = () => {
      <!-- Edit view -->
      <div v-else>
        <div v-for="(location, key) in locationsVirtual" :key="key" class="mb-3 pa-3 border rounded">
-          <div class="d-flex align-center justify-space-between mb-2">
-            <strong>{{ location.label || 'Virtual Location' }}</strong>
+          <div class="d-flex justify-end mb-2">
            <v-btn
              icon="mdi-delete"
              size="small"
@@ -1,4 +1,6 @@
 <script setup lang="ts">
+import EventEditorDateTimeField from './EventEditorDateTimeField.vue'
+
 interface Props {
  mode: 'edit' | 'view'
  notifications: Record<string, any>
@@ -13,14 +15,12 @@ const emit = defineEmits<{

 const typeOptions = [
  { title: 'Email', value: 'email' },
-  { title: 'Visual (Display)', value: 'visual' },
-  { title: 'Audible (Sound)', value: 'audible' }
+  { title: 'Display', value: 'visual' }
 ]

 const patternOptions = [
-  { title: 'Absolute (Specific Time)', value: 'absolute' },
-  { title: 'Relative (Before Event)', value: 'relative' },
-  { title: 'Unknown', value: 'unknown' }
+  { title: 'Relative', value: 'relative' },
+  { title: 'Absolute', value: 'absolute' },
 ]

 const anchorOptions = [
@@ -28,6 +28,18 @@ const anchorOptions = [
  { title: 'End Time', value: 'end' }
 ]

+const offsetPresets = [
+  { title: '5 minutes before', value: 'PT5M' },
+  { title: '10 minutes before', value: 'PT10M' },
+  { title: '15 minutes before', value: 'PT15M' },
+  { title: '30 minutes before', value: 'PT30M' },
+  { title: '1 hour before', value: 'PT1H' },
+  { title: '2 hours before', value: 'PT2H' },
+  { title: '1 day before', value: 'P1D' },
+  { title: '2 days before', value: 'P2D' },
+  { title: '1 week before', value: 'P1W' },
+]
+
 const formatNotification = (notification: any) => {
  if (notification.pattern === 'absolute' && notification.when) {
    return `At ${new Date(notification.when).toLocaleString()}`
@@ -48,7 +60,7 @@ const formatNotification = (notification: any) => {
        variant="outlined"
        @click="$emit('add-notification')">
        <v-icon left>mdi-plus</v-icon>
-        Add Notification
+        Add
      </v-btn>
    </div>

@@ -69,9 +81,65 @@ const formatNotification = (notification: any) => {

    <!-- Edit view -->
    <div v-else>
-      <div v-for="(notification, key) in notifications" :key="key" class="mb-3 pa-3 border rounded">
-        <div class="d-flex align-center justify-space-between mb-2">
-          <strong>Notification</strong>
+      <div v-for="(notification, key) in notifications" :key="key" class="mb-2 pa-2 border rounded">
+        <div class="d-flex align-center ga-2">
+          <v-row dense class="flex-grow-1">
+            <v-col cols="6" sm="3">
+              <v-select
+                v-model="notification.type"
+                :items="typeOptions"
+                label="Type"
+                variant="outlined"
+                density="compact"
+                hide-details
+                :rules="[v => !!v || 'Type is required']"
+              />
+            </v-col>
+            <v-col cols="6" sm="3">
+              <v-select
+                v-model="notification.pattern"
+                :items="patternOptions"
+                label="Pattern"
+                variant="outlined"
+                density="compact"
+                hide-details
+                :rules="[v => !!v || 'Pattern is required']"
+              />
+            </v-col>
+
+            <v-col v-if="notification.pattern === 'absolute'" cols="12" sm="6">
+              <EventEditorDateTimeField
+                :model-value="notification.when"
+                @update:model-value="notification.when = $event"
+              />
+            </v-col>
+
+            <template v-else-if="notification.pattern === 'relative'">
+              <v-col cols="6" sm="3">
+                <v-select
+                  v-model="notification.anchor"
+                  :items="anchorOptions"
+                  label="Anchor"
+                  variant="outlined"
+                  density="compact"
+                  hide-details
+                />
+              </v-col>
+              <v-col cols="6" sm="3">
+                <v-combobox
+                  v-model="notification.offset"
+                  :items="offsetPresets"
+                  item-title="title"
+                  item-value="value"
+                  label="Offset"
+                  variant="outlined"
+                  density="compact"
+                  hide-details
+                />
+              </v-col>
+            </template>
+          </v-row>
+
          <v-btn
            icon="mdi-delete"
            size="small"
@@ -80,63 +148,6 @@ const formatNotification = (notification: any) => {
            @click="$emit('remove-notification', key)">
          </v-btn>
        </div>
-
-        <v-row dense class="mb-2">
-          <v-col cols="12" md="6">
-            <v-select
-              v-model="notification.type"
-              :items="typeOptions"
-              label="Type"
-              variant="outlined"
-              density="compact"
-              :rules="[v => !!v || 'Type is required']"
-            />
-          </v-col>
-          <v-col cols="12" md="6">
-            <v-select
-              v-model="notification.pattern"
-              :items="patternOptions"
-              label="Pattern"
-              variant="outlined"
-              density="compact"
-              :rules="[v => !!v || 'Pattern is required']"
-            />
-          </v-col>
-        </v-row>
-
-        <div v-if="notification.pattern === 'absolute'">
-          <v-text-field
-            v-model="notification.when"
-            label="When (ISO Date)"
-            type="datetime-local"
-            variant="outlined"
-            density="compact"
-            hint="Specific date and time for notification"
-          />
-        </div>
-
-        <div v-else-if="notification.pattern === 'relative'">
-          <v-row dense>
-            <v-col cols="12" md="6">
-              <v-text-field
-                v-model="notification.offset"
-                label="Offset (e.g., PT15M)"
-                variant="outlined"
-                density="compact"
-                hint="ISO 8601 duration before event"
-              />
-            </v-col>
-            <v-col cols="12" md="6">
-              <v-select
-                v-model="notification.anchor"
-                :items="anchorOptions"
-                label="Anchor"
-                variant="outlined"
-                density="compact"
-              />
-            </v-col>
-          </v-row>
-        </div>
      </div>
    </div>
  </div>
@@ -90,7 +90,7 @@ const hasParticipants = () => {
          variant="outlined"
          @click="$emit('add-participant')">
          <v-icon left>mdi-plus</v-icon>
-          Add Participant
+          Add
        </v-btn>
      </div>

@@ -131,8 +131,7 @@ const hasParticipants = () => {
      <!-- Edit view -->
      <div v-else>
        <div v-for="(participant, key) in participants" :key="key" class="mb-3 pa-3 border rounded">
-          <div class="d-flex align-center justify-space-between mb-2">
-            <strong>{{ participant.name || 'Participant' }}</strong>
+          <div class="d-flex justify-end mb-2">
            <v-btn
              icon="mdi-delete"
              size="small"
@@ -20,8 +20,6 @@ const tagsValue = computed({

 <template>
  <div v-if="tagsValue.length > 0 || mode === 'edit'" class="event-editor-section">
-    <div class="text-subtitle-1 mb-2">Tags</div>
-    
    <!-- Read-only view -->
    <div v-if="mode === 'view'" class="mb-4">
      <div v-if="tagsValue.length > 0" class="pa-2">
Author	SHA1	Message	Date
Sebastian	f379d86877	chore(deps): update dependency vuetify to v4.1.8 Build Test / test (pull_request) Successful in 1m16s Details JS Unit Tests / test (pull_request) Successful in 1m15s Details	2026-08-08 03:02:21 +00:00
Sebastian	e5ec5bb6a0	feat(editor): improve desing Signed-off-by: Sebastian Krupinski <krupinski01@gmail.com>	2026-08-06 21:45:03 -04:00
Sebastian	1ea9d18b5d	feat: move tags up in the editor Signed-off-by: Sebastian Krupinski <krupinski01@gmail.com>	2026-08-06 11:47:38 -04:00