fix: lint, format, types

Author: gcharest

scripts/cnf-fcen-qa.mjs

@@ -1,7 +1,6 @@
 #!/usr/bin/env node
-/* eslint-env node */
-// 'use strict' removed to allow usage of global 'console'
 /* global process */
+// 'use strict' removed to allow usage of global 'console'
 
 import fs from 'fs'
 import path from 'path'

scripts/test/loaders.stream.test.mjs

@@ -1,4 +1,3 @@
-/* eslint-env node */
 import { describe, it, expect, beforeEach, afterEach } from 'vitest'
 import fs from 'fs'
 import path from 'path'

src/App.vue

@@ -34,11 +34,14 @@ onMounted(() => {
 
     <!-- Main Content -->
     <main
-      id="content" class="min-h-screen transition-all duration-300" :class="[
-      'lg:ml-24', // Desktop: Add left margin for side rail
-      'pt-14 lg:pt-0', // Mobile: Add top padding for top bar
-      'pb-20 lg:pb-4' // Mobile: Add bottom padding for bottom nav
-    ]">
+      id="content"
+      class="min-h-screen transition-all duration-300"
+      :class="[
+        'lg:ml-24', // Desktop: Add left margin for side rail
+        'pt-14 lg:pt-0', // Mobile: Add top padding for top bar
+        'pb-20 lg:pb-4' // Mobile: Add bottom padding for bottom nav
+      ]"
+    >
       <div class="container mx-auto px-4 py-3">
         <!-- KeepAlive preserves component instances for stateful views (active session,
              active filters) across navigation, avoiding costly re-mounts. -->

src/components/base/BaseBottomNav.vue

@@ -1,22 +1,42 @@
 <template>
-  <nav class="fixed bottom-0 left-0 right-0 z-30 lg:hidden" :class="navClasses"
-    :aria-label="$t('navigation.mainNavigation')">
+  <nav
+    class="fixed bottom-0 left-0 right-0 z-30 lg:hidden"
+    :class="navClasses"
+    :aria-label="$t('navigation.mainNavigation')"
+  >
     <div class="flex justify-around items-center h-16 px-2 pb-safe">
-      <RouterLink v-for="item in bottomNavItems" :key="item.to" :to="item.to" class="nav-item relative"
-        :class="navItemClasses(item.to)" :aria-label="item.label">
+      <RouterLink
+        v-for="item in bottomNavItems"
+        :key="item.to"
+        :to="item.to"
+        class="nav-item relative"
+        :class="navItemClasses(item.to)"
+        :aria-label="item.label"
+      >
         <component :is="item.icon" class="w-6 h-6" />
-        <span v-if="item.showBadge"
-          class="absolute top-1 right-1 w-2 h-2 bg-primary-600 dark:bg-primary-400 rounded-full" aria-hidden="true" />
+        <span
+          v-if="item.showBadge"
+          class="absolute top-1 right-1 w-2 h-2 bg-primary-600 dark:bg-primary-400 rounded-full"
+          aria-hidden="true"
+        />
         <span class="sr-only">{{ item.label }}</span>
       </RouterLink>
 
       <!-- Menu Button -->
-      <button type="button" class="nav-item relative" :class="menuButtonClasses" :aria-label="$t('navigation.menu')"
-        @click="showMenu = true">
+      <button
+        type="button"
+        class="nav-item relative"
+        :class="menuButtonClasses"
+        :aria-label="$t('navigation.menu')"
+        @click="showMenu = true"
+      >
         <MoreHorizontalIcon class="w-6 h-6" />
         <!-- Show badge if any overflow item has a badge -->
-        <span v-if="hasOverflowBadge"
-          class="absolute top-1 right-1 w-2 h-2 bg-primary-600 dark:bg-primary-400 rounded-full" aria-hidden="true" />
+        <span
+          v-if="hasOverflowBadge"
+          class="absolute top-1 right-1 w-2 h-2 bg-primary-600 dark:bg-primary-400 rounded-full"
+          aria-hidden="true"
+        />
         <span class="sr-only">{{ $t('navigation.menu') }}</span>
       </button>
     </div>
@@ -26,34 +46,45 @@
   <BaseModal v-model:open="showMenu" :title="$t('navigation.menu')" size="sm">
     <nav class="space-y-2">
       <!-- Navigation Items (Home, About, Settings) -->
-      <RouterLink v-for="item in overflowItems" :key="item.to" :to="item.to"
+      <RouterLink
+        v-for="item in overflowItems"
+        :key="item.to"
+        :to="item.to"
         class="flex items-center justify-between px-4 py-3 rounded-lg text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors duration-150"
-        @click="showMenu = false">
+        @click="showMenu = false"
+      >
         <div class="flex items-center space-x-3">
           <component :is="item.icon" class="w-5 h-5" />
           <span>{{ item.label }}</span>
         </div>
         <!-- Badge indicator for items with notifications -->
-        <span v-if="item.showBadge" class="w-2 h-2 bg-primary-600 dark:bg-primary-400 rounded-full"
-          aria-hidden="true" />
+        <span
+          v-if="item.showBadge"
+          class="w-2 h-2 bg-primary-600 dark:bg-primary-400 rounded-full"
+          aria-hidden="true"
+        />
       </RouterLink>
 
       <!-- Divider -->
       <hr class="border-gray-200 dark:border-gray-700" />
 
       <!-- Theme Toggle -->
-      <button type="button"
+      <button
+        type="button"
         class="flex items-center space-x-3 px-4 py-3 rounded-lg text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors duration-150 w-full text-left"
-        @click="toggleTheme">
+        @click="toggleTheme"
+      >
         <SunIcon v-if="isDark" class="w-5 h-5" />
         <MoonIcon v-else class="w-5 h-5" />
         <span>{{ isDark ? $t('theme.light') : $t('theme.dark') }}</span>
       </button>
 
       <!-- Language Toggle -->
-      <button type="button"
+      <button
+        type="button"
         class="flex items-center space-x-3 px-4 py-3 rounded-lg text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors duration-150 w-full text-left"
-        @click="toggleLanguage">
+        @click="toggleLanguage"
+      >
         <LanguagesIcon class="w-5 h-5" />
         <span>{{ locale === 'en' ? 'Français' : 'English' }}</span>
       </button>
@@ -62,24 +93,37 @@
       <hr class="border-gray-200 dark:border-gray-700" />
 
       <!-- GitHub Link -->
-      <a href="https://github.com/gcharest/gluko" target="_blank" rel="noopener"
+      <a
+        href="https://github.com/gcharest/gluko"
+        target="_blank"
+        rel="noopener"
         class="flex items-center space-x-3 px-4 py-3 rounded-lg text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors duration-150"
-        @click="showMenu = false">
+        @click="showMenu = false"
+      >
         <!-- GitHub icon from Simple Icons -->
-        <svg class="w-5 h-5" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
+        <svg
+          class="w-5 h-5"
+          viewBox="0 0 24 24"
+          fill="currentColor"
+          xmlns="http://www.w3.org/2000/svg"
+        >
           <path
-            d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z" />
+            d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"
+          />
         </svg>
         <span>{{ $t('navigation.sourceCode') }}</span>
       </a>
     </nav>
 
     <!-- Version Info -->
     <div
-      class="mt-6 pt-4 border-t border-gray-200 dark:border-gray-700 text-center text-sm text-gray-500 dark:text-gray-400">
+      class="mt-6 pt-4 border-t border-gray-200 dark:border-gray-700 text-center text-sm text-gray-500 dark:text-gray-400"
+    >
       <p>Gluko © Guillaume Charest 2021-2023</p>
-      <p class="text-xs">ver. {{ version }} ({{ $t('settings.app.buildDate') }} {{ buildDate }}, {{
-        $t('settings.app.deployDate') }} {{ deployDate }})</p>
+      <p class="text-xs">
+        ver. {{ version }} ({{ $t('settings.app.buildDate') }} {{ buildDate }},
+        {{ $t('settings.app.deployDate') }} {{ deployDate }})
+      </p>
     </div>
   </BaseModal>
 </template>

src/components/base/BaseFooter.vue

@@ -12,8 +12,10 @@ const deployDate = new Date(__DEPLOY_DATE__).toISOString().slice(0, 10)
           <span class="text-muted small">
             Gluko © Guillaume Charest 2021-2023
             <br class="d-sm-none" />
-            <span class="d-none d-sm-inline">| </span>ver. {{ version }} ({{ $t('settings.app.buildDate') }} {{
-            buildDate }}, {{ $t('settings.app.deployDate') }} {{ deployDate }})
+            <span class="d-none d-sm-inline">| </span>ver. {{ version }} ({{
+              $t('settings.app.buildDate')
+            }}
+            {{ buildDate }}, {{ $t('settings.app.deployDate') }} {{ deployDate }})
           </span>
         </div>
       </div>

src/components/calculator/MealCalculator.vue

@@ -8,9 +8,13 @@ import { useToast } from '@/composables/useToast'
 import type { Nutrient } from '@/types/meal-history'
 import { BookPlusIcon } from 'lucide-vue-next'
 
-const ConfirmationModal = defineAsyncComponent(() => import('@/components/modals/ConfirmationModal.vue'))
+const ConfirmationModal = defineAsyncComponent(
+  () => import('@/components/modals/ConfirmationModal.vue')
+)
 const SaveMealModal = defineAsyncComponent(() => import('@/components/modals/SaveMealModal.vue'))
-const TagManagementModal = defineAsyncComponent(() => import('@/components/modals/TagManagementModal.vue'))
+const TagManagementModal = defineAsyncComponent(
+  () => import('@/components/modals/TagManagementModal.vue')
+)
 
 const store = useMealStore()
 const toast = useToast()

src/components/nutrients/NutrientListItem.vue

@@ -6,7 +6,9 @@ import BaseCard from '@/components/base/BaseCard.vue'
 import BaseButton from '@/components/base/BaseButton.vue'
 import { EditIcon, TrashIcon } from 'lucide-vue-next'
 
-const ConfirmationModal = defineAsyncComponent(() => import('@/components/modals/ConfirmationModal.vue'))
+const ConfirmationModal = defineAsyncComponent(
+  () => import('@/components/modals/ConfirmationModal.vue')
+)
 
 const mealStore = useMealStore()
 const props = defineProps({

src/i18n/locales/en.json

@@ -552,4 +552,4 @@
     "whyTitle": "Why Gluko?",
     "whyDescription": "Managing Type 1 Diabetes requires constant attention to carbohydrate intake for proper insulin dosing. Gluko makes this easier by providing quick access to reliable nutritional information, enabling easy calculation of complex meals, and supporting families and caregivers with comprehensive meal tracking."
   }
-}
+}

src/i18n/locales/fr.json

@@ -546,4 +546,4 @@
     "whyTitle": "Pourquoi Gluko?",
     "whyDescription": "La gestion du diabète de type 1 nécessite une attention constante à l'apport en glucides pour un dosage approprié de l'insuline. Gluko facilite cela en fournissant un accès rapide à des informations nutritionnelles fiables, en permettant le calcul facile de repas complexes et en soutenant les familles et les soignants avec un suivi complet des repas."
   }
-}
+}

src/stores/nutrientsFile.ts

@@ -40,7 +40,7 @@ const tokenizeWithAccents = (str: string) => {
     .toLowerCase()
     .normalize('NFD') // Decompose accented characters
     .replace(/[\u0300-\u036f]/g, '') // Remove diacritics (é → e, ç → c, etc.)
-    .split(/[\s\-\.\/,]+/) // Split on whitespace and common separators
+    .split(/[\s\-.,/]+/) // Split on whitespace and common separators
     .filter((token) => token.length > 0)
 }
 
@@ -60,7 +60,13 @@ export const useNutrientFileStore = defineStore('nutrientsFile', () => {
   const initializeSearch = () => {
     miniSearch = new MiniSearch<NutrientFile>({
       fields: ['FoodDescription', 'FoodDescriptionF'],
-      storeFields: ['FoodID', 'FoodDescription', 'FoodDescriptionF', 'FoodGroupName', 'FoodGroupNameF'],
+      storeFields: [
+        'FoodID',
+        'FoodDescription',
+        'FoodDescriptionF',
+        'FoodGroupName',
+        'FoodGroupNameF'
+      ],
       idField: 'FoodID',
       tokenize: tokenizeWithAccents,
       processTerm: (term: string) => term || null,