chore(deps): update dependency vite to v8.1.4

.github/workflows/build-test.yml

@@ -1,50 +0,0 @@
-name: Build Test
-
-on:
-  pull_request:
-
-jobs:
-  test:
-    runs-on: ubuntu-latest
-
-    steps:
-      - name: Retrieve Server Install Action
-        uses: actions/checkout@v6.0.2
-        with:
-          repository: Nodarx/action-server-install
-          ref: main
-          path: action-server-install
-          github-server-url: https://git.ktrix.dev
-
-      - name: Install Server
-        uses: ./action-server-install
-        with:
-          install-php: 'false'
-          install-node: 'true'
-          php-version: '8.5'
-          node-version: '24'
-          server-path: './server'
-
-      - name: Install Chrono Manager
-        uses: actions/checkout@v6.0.2
-        with:
-          repository: Nodarx/chrono_manager
-          ref: main
-          path: server/modules/chrono_manager
-          github-server-url: https://git.ktrix.dev
-
-      - name: Checkout Pull Request
-        uses: actions/checkout@v6.0.2
-        with:
-          repository: ${{ github.repository }}
-          ref: ${{ github.event.pull_request.head.sha }}
-          path: server/modules/chrono
-          github-server-url: https://git.ktrix.dev
-
-      - name: Install dependencies
-        run: npm ci
-        working-directory: server/modules/chrono
-
-      - name: Build
-        run: npm run build
-        working-directory: server/modules/chrono

.github/workflows/js-unit-tests.yml

@@ -1,50 +0,0 @@
-name: JS Unit Tests
-
-on:
-  pull_request:
-
-jobs:
-  test:
-    runs-on: ubuntu-latest
-
-    steps:
-      - name: Retrieve Server Install Action
-        uses: actions/checkout@v6.0.2
-        with:
-          repository: Nodarx/action-server-install
-          ref: main
-          path: action-server-install
-          github-server-url: https://git.ktrix.dev
-
-      - name: Install Server
-        uses: ./action-server-install
-        with:
-          install-php: 'false'
-          install-node: 'true'
-          php-version: '8.5'
-          node-version: '24'
-          server-path: './server'
-
-      - name: Install Chrono Manager
-        uses: actions/checkout@v6.0.2
-        with:
-          repository: Nodarx/chrono_manager
-          ref: main
-          path: server/modules/chrono_manager
-          github-server-url: https://git.ktrix.dev
-
-      - name: Checkout Pull Request
-        uses: actions/checkout@v6.0.2
-        with:
-          repository: ${{ github.repository }}
-          ref: ${{ github.event.pull_request.head.sha }}
-          path: server/modules/chrono
-          github-server-url: https://git.ktrix.dev
-
-      - name: Install dependencies
-        run: npm ci
-        working-directory: server/modules/chrono
-
-      - name: Run tests
-        run: npm run test:unit
-        working-directory: server/modules/chrono

.gitignore

@@ -15,7 +15,10 @@ node_modules/
 /vendor/
 /lib/vendor/
 coverage/
-*.cache
+phpunit.xml.cache
+.phpunit.result.cache
+.php-cs-fixer.cache
+.phpstan.cache
 .phpactor/
 
 # Editors

package.json

@@ -11,27 +11,19 @@
     "dev": "vite build --mode development --config vite.config.ts",
     "watch": "vite build --mode development --watch --config vite.config.ts",
     "typecheck": "vue-tsc --noEmit",
-    "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
-    "test": "vitest run --config tests/js/vitest.config.ts",
-    "test:unit": "vitest run --config tests/js/vitest.config.ts",
-    "test:watch": "vitest watch --config tests/js/vitest.config.ts",
-    "test:coverage": "vitest run --coverage --config tests/js/vitest.config.ts"
+    "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore"
   },
   "dependencies": {
-    "pinia": "^4.0.0",
+    "pinia": "^3.0.0",
     "vue": "^3.5.18",
     "vue-router": "^5.0.0",
     "vuetify": "^4.0.0"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^6.0.1",
-    "@vitest/coverage-v8": "^4.1.6",
-    "@vue/test-utils": "^2.4.10",
     "@vue/tsconfig": "^0.9.0",
-    "jsdom": "^30.0.0",
     "typescript": "~6.0.0",
     "vite": "^8.0.0",
-    "vitest": "^4.1.6",
     "vue-tsc": "^3.0.5"
   }
 }

src/components/CollectionList.vue

@@ -67,10 +67,10 @@ const onToggleVisibility = (collection: CollectionObject) => {
 <template>
   <div class="collection-selector">
     <div class="collection-selector-header">
-      <div class="d-flex align-center justify-space-between mb-1">
+      <div class="d-flex align-center justify-space-between mb-3">
         <div class="d-flex align-center">
-          <v-icon :icon="displayIcon" size="14" class="mr-2 text-medium-emphasis" />
-          <span class="sidebar-section-label">{{ displayTitle }}</span>
+          <v-icon :icon="displayIcon" size="small" class="mr-2" />
+          <span class="text-subtitle-2 font-weight-bold">{{ displayTitle }}</span>
         </div>
         <v-btn
           icon="mdi-plus"
@@ -83,7 +83,7 @@ const onToggleVisibility = (collection: CollectionObject) => {
       </div>
     </div>
     
-    <v-divider class="mb-2" />
+    <v-divider class="my-2" />
     
     <div class="collection-selector-content">
       <v-list density="compact" nav class="pa-0">
@@ -147,14 +147,6 @@ const onToggleVisibility = (collection: CollectionObject) => {
   cursor: pointer;
 }
 
-.sidebar-section-label {
-  font-size: 11px;
-  font-weight: 600;
-  letter-spacing: 0.09em;
-  text-transform: uppercase;
-  color: rgba(var(--v-theme-on-surface), 0.6);
-}
-
 .collection-edit-btn {
   opacity: 0;
   transition: opacity 0.15s ease;

src/components/Sidebar.vue

@@ -1,181 +0,0 @@
-<script setup lang="ts">
-import { computed, ref } from 'vue';
-import { storeToRefs } from 'pinia';
-import { useDisplay } from 'vuetify';
-import { useChronoOperationsStore } from '@/stores/chronoOperationsStore';
-import { useChronoUiStore } from '@/stores/chronoUiStore';
-import CollectionList from '@/components/CollectionList.vue';
-import MiniCalendar from '@/components/MiniCalendar.vue';
-
-const display = useDisplay();
-const isMobile = computed(() => display.mdAndDown.value);
-
-const chronoOperationsStore = useChronoOperationsStore();
-const chronoUiStore = useChronoUiStore();
-
-const { collections } = storeToRefs(chronoOperationsStore);
-const {
-  sidebarVisible,
-  selectedCollection,
-  currentDate,
-  isTasksSection,
-} = storeToRefs(chronoUiStore);
-
-const {
-  selectCollection,
-  openCollectionEditor,
-  createEvent,
-  createTask,
-  openImport,
-} = chronoUiStore;
-
-const { toggleCalendarVisibility } = chronoOperationsStore;
-
-// iCalendar import file picker
-const fileInputRef = ref<HTMLInputElement | null>(null);
-
-function handleImportStart() {
-  fileInputRef.value?.click();
-}
-
-async function handleImportSelect(event: Event) {
-  const input = event.target as HTMLInputElement;
-  const files = Array.from(input.files ?? []);
-  input.value = '';
-  if (files.length) await openImport(files);
-}
-
-// Settings placeholder (no settings dialog exists for this module yet)
-const showSettingsDialog = ref(false);
-</script>
-
-<template>
-  <v-navigation-drawer
-    v-model="sidebarVisible"
-    contained
-    :permanent="sidebarVisible && !isMobile"
-    :temporary="isMobile"
-    width="280"
-    class="chrono-sidebar"
-  >
-    <div class="pa-3 d-flex flex-column h-100">
-      <!-- Primary action -->
-      <v-menu>
-        <template #activator="{ props: menuProps }">
-          <v-btn
-            block
-            color="primary"
-            variant="tonal"
-            prepend-icon="mdi-plus"
-            append-icon="mdi-chevron-down"
-            class="mb-4 justify-start"
-            v-bind="menuProps"
-          >
-            {{ isTasksSection ? 'New Task' : 'New Event' }}
-          </v-btn>
-        </template>
-        <v-list density="compact">
-          <v-list-item @click="createEvent()">
-            <template #prepend>
-              <v-icon icon="mdi-calendar-plus" />
-            </template>
-            <v-list-item-title>Event</v-list-item-title>
-          </v-list-item>
-          <v-list-item @click="createTask()">
-            <template #prepend>
-              <v-icon icon="mdi-checkbox-marked-circle-plus-outline" />
-            </template>
-            <v-list-item-title>Task</v-list-item-title>
-          </v-list-item>
-        </v-list>
-      </v-menu>
-
-      <!-- Collections -->
-      <CollectionList
-        v-if="!isTasksSection"
-        :collections="collections"
-        :selected-collection="selectedCollection"
-        type="calendar"
-        @create="openCollectionEditor('calendar')"
-        @select="selectCollection"
-        @edit="openCollectionEditor('calendar', $event)"
-        @toggle-visibility="toggleCalendarVisibility"
-      />
-      <CollectionList
-        v-else
-        :collections="collections"
-        :selected-collection="selectedCollection"
-        type="tasklist"
-        @create="openCollectionEditor('tasklist')"
-        @select="selectCollection"
-        @edit="openCollectionEditor('tasklist', $event)"
-      />
-
-      <!-- Mini Calendar Widget -->
-      <v-card v-if="!isTasksSection" class="mt-4 flex-shrink-0" variant="outlined">
-        <v-card-text class="pa-2">
-          <MiniCalendar v-model="currentDate" />
-        </v-card-text>
-      </v-card>
-    </div>
-
-    <!-- Pinned utility footer -->
-    <template #append>
-      <v-divider />
-      <div class="pa-2">
-        <v-btn
-          block
-          variant="text"
-          size="small"
-          prepend-icon="mdi-calendar-import"
-          class="justify-start text-medium-emphasis"
-          @click="handleImportStart"
-        >
-          Import iCalendar
-        </v-btn>
-        <v-btn
-          block
-          variant="text"
-          size="small"
-          prepend-icon="mdi-cog"
-          class="justify-start text-medium-emphasis"
-          @click="showSettingsDialog = true"
-        >
-          Settings
-        </v-btn>
-        <input
-          ref="fileInputRef"
-          type="file"
-          accept=".ics,text/calendar"
-          multiple
-          class="d-none"
-          @change="handleImportSelect"
-        />
-      </div>
-    </template>
-  </v-navigation-drawer>
-
-  <!-- Settings placeholder dialog -->
-  <v-dialog v-model="showSettingsDialog" max-width="480">
-    <v-card>
-      <v-card-title class="d-flex align-center">
-        <v-icon icon="mdi-cog" size="small" class="mr-2" />
-        Chrono Settings
-      </v-card-title>
-      <v-card-text class="text-medium-emphasis">
-        No settings are available for this module yet.
-      </v-card-text>
-      <v-card-actions>
-        <v-spacer />
-        <v-btn variant="text" @click="showSettingsDialog = false">Close</v-btn>
-      </v-card-actions>
-    </v-card>
-  </v-dialog>
-</template>
-
-<style scoped>
-.chrono-sidebar {
-  border-right: 1px solid rgb(var(--v-border-color)) !important;
-  overflow-y: auto;
-}
-</style>

src/pages/ChronoPage.vue

@@ -1,7 +1,8 @@
 <script setup lang="ts">
-import { computed, onMounted, watch } from 'vue';
+import { computed, onMounted, ref, watch } from 'vue';
 import { storeToRefs } from 'pinia';
 import { useRoute } from 'vue-router';
+import { useDisplay } from 'vuetify';
 import { useModuleStore } from '@KTXC/stores/moduleStore';
 import { useChronoOperationsStore } from '@/stores/chronoOperationsStore';
 import { useChronoSettingsStore } from '@/stores/chronoSettingsStore';
@@ -9,15 +10,20 @@ import { useChronoUiStore } from '@/stores/chronoUiStore';
 import type { CalendarView as CalendarViewType } from '@/types';
 import { spanToDays, type AgendaViewSpan, type DaysViewSpan } from '@/types/spans';
 import { daysVisibleRange, monthGridVisibleRange } from '@/utils/date';
-import Sidebar from '@/components/Sidebar.vue';
+import CollectionList from '@/components/CollectionList.vue';
 import CollectionEditor from '@/components/CollectionEditor.vue';
 import CalendarView from '@/components/CalendarView.vue';
 import TaskView from '@/components/TaskView.vue';
 import EventEditor from '@/components/EventEditor.vue';
 import TaskEditor from '@/components/TaskEditor.vue';
+import MiniCalendar from '@/components/MiniCalendar.vue';
 import ImportDialog from '@/components/ImportDialog.vue';
 import { EpochSpan } from '@/types/date';
 
+// Vuetify display
+const display = useDisplay();
+const isMobile = computed(() => display.mdAndDown.value);
+
 // Check if chrono manager is available
 const moduleStore = useModuleStore();
 const isChronoManagerAvailable = computed(() => {
@@ -65,6 +71,8 @@ const {
   initialize,
   selectSection,
   selectDate,
+  selectCollection,
+  openCollectionEditor,
   createEventFromDate,
   startEditingSelectedEntity,
   cancelEditingSelectedEntity,
@@ -77,14 +85,18 @@ const {
   deleteTask,
   saveCollection,
   deleteCollection,
+  openImport,
   closeImport,
 } = chronoUiStore;
 
 const {
+  toggleCalendarVisibility,
   toggleTaskComplete,
   ensureTasksLoaded,
 } = chronoOperationsStore;
 
+const fileInputRef = ref<HTMLInputElement | null>(null)
+
 watch(() => route.fullPath, async () => {
   selectSectionFromRoute();
   if (isTasksSection.value) {
@@ -107,6 +119,17 @@ onMounted(async () => {
   }
 });
 
+function handleImportStart() {
+  fileInputRef.value?.click()
+}
+
+async function handleImportSelect(event: Event) {
+  const input = event.target as HTMLInputElement
+  const files = Array.from(input.files ?? [])
+  input.value = ''
+  if (files.length) await openImport(files)
+}
+
 function handleCalendarViewChange(view: CalendarViewType) {
   chronoSettingsStore.calendarView = view;
 }
@@ -177,7 +200,49 @@ function selectSectionFromRoute() {
     <!-- Main Content Area -->
     <div class="chrono-content">
       <!-- Sidebar Navigation Drawer -->
-      <Sidebar />
+      <v-navigation-drawer
+        v-model="sidebarVisible"
+        contained
+        :permanent="sidebarVisible && !isMobile"
+        :temporary="isMobile"
+        width="280"
+        class="chrono-sidebar"
+      >
+        <div class="pa-4">
+          <CollectionList
+            v-if="!isTasksSection"
+            :collections="collections"
+            :selected-collection="selectedCollection"
+            type="calendar"
+            @create="openCollectionEditor('calendar')"
+            @select="selectCollection"
+            @edit="openCollectionEditor('calendar', $event)"
+            @toggle-visibility="toggleCalendarVisibility"
+          />
+          <CollectionList
+            v-else
+            :collections="collections"
+            :selected-collection="selectedCollection"
+            type="tasklist"
+            @create="openCollectionEditor('tasklist')"
+            @select="selectCollection"
+            @edit="openCollectionEditor('tasklist', $event)"
+          />
+          
+          <v-divider class="my-3" />
+          <v-btn variant="text" prepend-icon="mdi-calendar-import" block class="justify-start" @click="handleImportStart">
+            Import iCalendar
+          </v-btn>
+          <input ref="fileInputRef" type="file" accept=".ics,text/calendar" multiple class="d-none" @change="handleImportSelect" />
+
+          <!-- Mini Calendar Widget -->
+          <v-card v-if="!isTasksSection" class="mt-4" variant="outlined">
+            <v-card-text class="pa-2">
+              <MiniCalendar v-model="currentDate" />
+            </v-card-text>
+          </v-card>
+        </div>
+      </v-navigation-drawer>
 
       <!-- Main Calendar/Task View -->
       <div class="chrono-main">
@@ -301,6 +366,11 @@ function selectSectionFromRoute() {
   position: relative;
 }
 
+.chrono-sidebar {
+  border-right: 1px solid rgb(var(--v-border-color)) !important;
+  overflow-y: auto;
+}
+
 .chrono-main {
   flex: 1;
   min-height: 0;

src/routes.ts

@@ -7,13 +7,13 @@ const routes = [
   {
     name: 'calendar',
     path: '/calendar',
-    component: () => import('@/pages/Main.vue'),
+    component: () => import('@/pages/ChronoPage.vue'),
     meta: { layout: 'fixed' },
   },
   {
     name: 'tasks',
     path: '/tasks',
-    component: () => import('@/pages/Main.vue'),
+    component: () => import('@/pages/ChronoPage.vue'),
     meta: { layout: 'fixed' },
   },
 ]

tests/js/unit/base.test.ts

@@ -1,30 +0,0 @@
-import { describe, it, expect } from 'vitest'
-
-describe('Basic Tests', () => {
-  it('should perform basic assertion', () => {
-    expect(true).toBe(true)
-  })
-
-  it('should test array operations', () => {
-    const array = ['foo', 'bar', 'baz']
-
-    expect(array).toHaveLength(3)
-    expect(array).toContain('bar')
-    expect(array[0]).toBe('foo')
-  })
-
-  it('should test string operations', () => {
-    const string = 'Hello, World!'
-
-    expect(string).toContain('World')
-    expect(string.length).toBe(13)
-  })
-
-  it('should test object operations', () => {
-    const obj = { foo: 'bar', count: 42 }
-
-    expect(obj).toHaveProperty('foo')
-    expect(obj.foo).toBe('bar')
-    expect(obj.count).toBeGreaterThan(40)
-  })
-})

tests/js/unit/entityInstances.test.ts

@@ -29,9 +29,9 @@ describe('entity instance expansion', () => {
       eventEntity('meeting', localIso(2026, 5, 15, 9), localIso(2026, 5, 15, 10)),
     )
 
-    expect(instance.duration).toBe(60 * 60 * 1000)
+    expect(instance.durationMs).toBe(60 * 60 * 1000)
     expect(new Date(instance.start).getHours()).toBe(9)
-    expect(new Date(instance.dayStart).getHours()).toBe(0)
+    expect(new Date(instance.dayStartMs).getHours()).toBe(0)
     expect(instance.instanceId).toBeNull()
     expect(instance.multiDay).toBe(false)
   })
@@ -56,7 +56,7 @@ describe('entity instance expansion', () => {
 
     const end = new Date(instance.end)
     expect([end.getDate(), end.getHours()]).toEqual([21, 0])
-    expect(new Date(instance.dayStart).getDate()).toBe(20)
+    expect(new Date(instance.dayStartMs).getDate()).toBe(20)
     expect(instance.multiDay).toBe(false)
   })
 
@@ -75,7 +75,7 @@ describe('entity instance expansion', () => {
       eventEntity('instant', localIso(2026, 5, 15, 9), null),
     )
 
-    expect(instance.duration).toBe(1)
+    expect(instance.durationMs).toBe(1)
   })
 
   it('omits a non-recurring event outside the requested range', () => {

tests/js/unit/recurrence.test.ts

@@ -40,7 +40,7 @@ describe('daily recurrence', () => {
     )
 
     expect(instances.map(instance => new Date(instance.start).getDate())).toEqual([5, 7, 9])
-    expect(instances.every(instance => instance.duration === 60 * 60 * 1000)).toBe(true)
+    expect(instances.every(instance => instance.durationMs === 60 * 60 * 1000)).toBe(true)
     expect(new Set(instances.map(instance => instance.key)).size).toBe(3)
   })
 
@@ -179,7 +179,7 @@ describe('recurrence mutations', () => {
 
     expect(instances).toHaveLength(2)
     expect(new Date(moved!.start).getHours()).toBe(14)
-    expect(moved!.duration).toBe(2 * 60 * 60 * 1000)
+    expect(moved!.durationMs).toBe(2 * 60 * 60 * 1000)
     expect(moved!.label).toBe('Moved standup')
     expect(moved!.color).toBe('#abcdef')
   })

tests/js/vitest.config.ts

@@ -1,33 +0,0 @@
-import { fileURLToPath } from 'node:url'
-import { defineConfig, configDefaults } from 'vitest/config'
-import vue from '@vitejs/plugin-vue'
-import path from 'path'
-
-const __filename = fileURLToPath(import.meta.url)
-const __dirname = path.dirname(__filename)
-
-export default defineConfig({
-  plugins: [vue()],
-  resolve: {
-    alias: {
-      '@': path.resolve(__dirname, '../../src'),
-      '@KTXC': path.resolve(__dirname, '../../../../core/src'),
-    },
-  },
-  test: {
-    environment: 'jsdom',
-    exclude: [...configDefaults.exclude, 'e2e/**'],
-    root: fileURLToPath(new URL('../../', import.meta.url)),
-    coverage: {
-      provider: 'v8',
-      reporter: ['text', 'json', 'html'],
-      exclude: [
-        'node_modules/',
-        'tests/',
-        '**/*.d.ts',
-        '**/*.config.*',
-        '**/dist/**',
-      ],
-    },
-  },
-})