@cnamts/synapse 1.0.26 → 1.1.0

package/src/components/Tables/common/filters/logics/tests/SelectFilterLogic.spec.ts

@@ -0,0 +1,111 @@
+import { describe, it, expect } from 'vitest'
+import filter from '../select'
+
+describe('Select filter logic', () => {
+	describe('filterValue scalaire (valeur unique)', () => {
+		it('retourne true pour une correspondance exacte de string', () => {
+			expect(filter('foo', 'foo')).toBe(true)
+		})
+
+		it('retourne false pour une non-correspondance de string', () => {
+			expect(filter('foo', 'bar')).toBe(false)
+		})
+
+		it('retourne true pour une correspondance exacte de number', () => {
+			expect(filter(42, 42)).toBe(true)
+		})
+
+		it('retourne false pour une non-correspondance de number', () => {
+			expect(filter(42, 43)).toBe(false)
+		})
+
+		it('retourne true pour null === null', () => {
+			expect(filter(null, null)).toBe(true)
+		})
+
+		it('retourne false pour null !== "foo"', () => {
+			expect(filter(null, 'foo')).toBe(false)
+		})
+
+		it('retourne true pour boolean true === true', () => {
+			expect(filter(true, true)).toBe(true)
+		})
+
+		it('retourne false pour boolean true !== false', () => {
+			expect(filter(true, false)).toBe(false)
+		})
+	})
+
+	describe('filterValue objet (comparaison JSON)', () => {
+		it('retourne true pour deux objets identiques', () => {
+			expect(filter({ id: 1, label: 'A' }, { id: 1, label: 'A' })).toBe(true)
+		})
+
+		it('retourne false pour deux objets différents', () => {
+			expect(filter({ id: 1, label: 'A' }, { id: 2, label: 'B' })).toBe(false)
+		})
+
+		it('retourne false si itemValue est une string et filterValue un objet', () => {
+			expect(filter('foo', { id: 1 })).toBe(false)
+		})
+
+		it('retourne true pour deux objets imbriqués identiques', () => {
+			const obj = { a: { b: 1 } }
+			expect(filter({ a: { b: 1 } }, obj)).toBe(true)
+		})
+	})
+
+	describe('filterValue tableau — itemValue scalaire', () => {
+		it('retourne true si itemValue est dans le tableau', () => {
+			expect(filter('foo', ['foo', 'bar'])).toBe(true)
+		})
+
+		it('retourne false si itemValue n\'est pas dans le tableau', () => {
+			expect(filter('baz', ['foo', 'bar'])).toBe(false)
+		})
+
+		it('retourne true pour un number inclus dans le tableau', () => {
+			expect(filter(2, [1, 2, 3])).toBe(true)
+		})
+
+		it('retourne false pour un number non inclus dans le tableau', () => {
+			expect(filter(5, [1, 2, 3])).toBe(false)
+		})
+
+		it('retourne false pour un tableau filterValue vide', () => {
+			expect(filter('foo', [])).toBe(false)
+		})
+	})
+
+	describe('filterValue tableau — itemValue tableau', () => {
+		it('retourne true si au moins un élément commun (primitifs)', () => {
+			expect(filter(['Vue', 'React'], ['Vue', 'Angular'])).toBe(true)
+		})
+
+		it('retourne false si aucun élément commun (primitifs)', () => {
+			expect(filter(['Svelte', 'Angular'], ['Vue', 'React'])).toBe(false)
+		})
+
+		it('retourne true si au moins un objet commun (comparaison JSON)', () => {
+			expect(filter(
+				[{ id: 1 }, { id: 2 }],
+				[{ id: 2 }, { id: 3 }],
+			)).toBe(true)
+		})
+
+		it('retourne false si aucun objet commun (comparaison JSON)', () => {
+			expect(filter(
+				[{ id: 1 }],
+				[{ id: 2 }],
+			)).toBe(false)
+		})
+
+		it('retourne false si itemValue est tableau vide', () => {
+			expect(filter([], ['foo'])).toBe(false)
+		})
+
+		it('retourne false si filterValue est tableau vide', () => {
+			expect(filter(['foo'], [])).toBe(false)
+		})
+	})
+})

package/src/components/Tables/common/tableStyles.scss

@@ -1,8 +1,8 @@
 @mixin tablestyles {
 	.v-table {
-		border: 1px solid rgb(var(--v-theme-grey-lighten80));
+		border: 1px solid rgb(var(--v-theme-disabled));
 
-		--sy-table-header-bg-pinned: color-mix(in srgb, rgb(var(--v-theme-blue-lighten80)) 20%, white);
+		--sy-table-header-bg-pinned: color-mix(in srgb, rgb(var(--v-theme-infoVariant)) 20%, white);
 
 		// Standardisation des z-index pour les tableaux
 		--sy-table-z-base: 1;
@@ -17,13 +17,13 @@
 
 	table thead tr.filters,
 	table thead tr.reset {
-		background-color: rgb(var(--v-theme-blue-lighten90));
+		background-color: rgb(var(--v-theme-infoVariant90));
 	}
 
 	caption,
 	table thead tr.headers,
 	table thead tr.reset {
-		background-color: rgba(var(--v-theme-blue-lighten80), 0.2);
+		background-color: rgba(var(--v-theme-infoVariant), 0.2);
 	}
 
 	&.fixed-min-height {
@@ -56,28 +56,28 @@
 
 	// Override Vuetify's checkbox styles to use primary color
 	.v-table .v-selection-control {
-		color: rgb(var(--v-theme-borderAccentPrimary)) !important;
+		color: rgb(var(--v-theme-primary)) !important;
 	}
 
 	.v-table .v-selection-control--dirty .v-selection-control__input::before {
-		background-color: rgb(var(--v-theme-borderAccentPrimary)) !important;
-		border-color: rgb(var(--v-theme-borderAccentPrimary)) !important;
+		background-color: rgb(var(--v-theme-primary)) !important;
+		border-color: rgb(var(--v-theme-primary)) !important;
 	}
 
 	// Target the header checkbox specifically
 	.v-data-table-header__checkbox .v-selection-control {
-		color: rgb(var(--v-theme-borderAccentPrimary)) !important;
+		color: rgb(var(--v-theme-primary)) !important;
 	}
 
 	// Target the row checkboxes specifically
 	.v-data-table-row__checkbox .v-selection-control {
-		color: rgb(var(--v-theme-borderAccentPrimary)) !important;
+		color: rgb(var(--v-theme-primary)) !important;
 	}
 
 	// Add a global style for all checkboxes in the table
 	.v-checkbox .v-selection-control__input::before,
 	.v-checkbox-btn .v-selection-control__input::before {
-		border-color: rgb(var(--v-theme-borderAccentPrimary)) !important;
+		border-color: rgb(var(--v-theme-primary)) !important;
 	}
 
 	.v-data-table-rows-no-data {

package/src/components/Tables/common/tests/SyTableFilter.spec.ts

@@ -1,4 +1,4 @@
-import { describe, it, expect } from 'vitest'
+import { describe, it, expect, afterEach, vi } from 'vitest'
 import { shallowMount, flushPromises } from '@vue/test-utils'
 import SyTableFilter from '../SyTableFilter.vue'
 import type { FilterOption, TableColumnHeader, FilterType } from '../types'
@@ -6,6 +6,13 @@ import type { FilterOption, TableColumnHeader, FilterType } from '../types'
 // Using shallowMount will automatically stub all child components
 
 describe('SyTableFilter', () => {
+	// Les filtres sont chargés via defineAsyncComponent(() => import(...)). On laisse ces
+	// imports dynamiques (et leurs dépendances : SyTextField, DatePicker…) se résoudre avant
+	// le teardown de l'environnement, sinon Vitest 4 lève une EnvironmentTeardownError.
+	afterEach(async () => {
+		await vi.dynamicImportSettled()
+	})
+
 	it('renders text filter correctly', async () => {
 		const filters: FilterOption[] = []
 		const header: TableColumnHeader = {

package/src/components/Tables/common/tests/filterByRange.spec.ts

@@ -7,6 +7,29 @@ import PeriodFilter from '../filters/PeriodFilter.vue'
 import SelectFilter from '../filters/SelectFilter.vue'
 import TextFilter from '../filters/TextFilter.vue'
 
+vi.mock('../../common/filters/getFilterComponent', () => {
+	return {
+		// eslint-disable-next-line @typescript-eslint/no-unused-vars
+		default: (filterType?: string, filterOptions?: unknown) => {
+			if (filterType === 'select') {
+				return SelectFilter
+			}
+			else if (filterType === 'date') {
+				return DateFilter
+			}
+			else if (filterType === 'period') {
+				return PeriodFilter
+			}
+			else if (filterType === 'number') {
+				return NumberFilter
+			}
+			else {
+				return TextFilter
+			}
+		},
+	}
+})
+
 const headers = [
 	{
 		title: 'Nom',
@@ -42,28 +65,6 @@ const items = [
 ]
 
 describe('SyTable - filterByRange', () => {
-	vi.mock('../../common/filters/getFilterComponent', () => {
-		return {
-			// eslint-disable-next-line @typescript-eslint/no-unused-vars
-			default: (filterType?: string, filterOptions?: unknown) => {
-				if (filterType === 'select') {
-					return SelectFilter
-				}
-				else if (filterType === 'date') {
-					return DateFilter
-				}
-				else if (filterType === 'period') {
-					return PeriodFilter
-				}
-				else if (filterType === 'number') {
-					return NumberFilter
-				}
-				else {
-					return TextFilter
-				}
-			},
-		}
-	})
 	afterAll(() => {
 		vi.resetModules()
 	})

package/src/components/Tables/common/types.ts

@@ -106,6 +106,7 @@ export type SyTableProps = {
 	pinnedColumnKey?: string
 	clickableRow?: boolean
 	pageInput?: boolean
+	hideDefaultFooter?: boolean
 }
 
 export type SyServerTableProps = {
@@ -134,4 +135,5 @@ export type SyServerTableProps = {
 	pinnedColumnKey?: string
 	clickableRow?: boolean
 	pageInput?: boolean
+	hideDefaultFooter?: boolean
 }

package/src/components/ToolbarContainer/tests/ToolbarContainer.visual.cy.ts

@@ -0,0 +1,34 @@
+import ToolbarContainer from '../ToolbarContainer.vue'
+import { h } from 'vue'
+import { VBtn } from 'vuetify/components'
+
+describe('ToolbarContainer - Visual regression tests', () => {
+	it('displays the toolbar container with buttons', () => {
+		cy.mountWithVuetify(ToolbarContainer, {
+			slots: {
+				default: () => [
+					h(VBtn, {}, () => 'Action 1'),
+					h(VBtn, {}, () => 'Action 2'),
+					h(VBtn, {}, () => 'Action 3'),
+				],
+			},
+		})
+
+		cy.get('.sy-toolbar').should('be.visible')
+		cy.matchImageSnapshot('toolbar-container-default', cy.get('.sy-toolbar'))
+	})
+
+	it('displays the toolbar container with links', () => {
+		cy.mountWithVuetify(ToolbarContainer, {
+			slots: {
+				default: () => [
+					h('a', { href: '#' }, 'Lien 1'),
+					h('a', { href: '#' }, 'Lien 2'),
+				],
+			},
+		})
+
+		cy.get('.sy-toolbar').should('be.visible')
+		cy.matchImageSnapshot('toolbar-container-links', cy.get('.sy-toolbar'))
+	})
+})

package/src/components/UploadWorkflow/tests/UploadWorkflow.spec.ts

@@ -1,11 +1,10 @@
-import { describe, it, expect, vi } from 'vitest'
+import { describe, it, expect, vi, afterEach } from 'vitest'
 import { mount } from '@vue/test-utils'
 import { nextTick } from 'vue'
 
 import UploadWorkflow from '../UploadWorkflow.vue'
 import { locales as fileListLocales } from '@/components/FileList/UploadItem/locales'
 import { locales as FileUploadLocales } from '@/components/FileUpload/locales'
-import { afterEach } from 'node:test'
 import { SySelect } from '@/components'
 
 describe('UploadWorkflow', () => {
@@ -48,10 +47,12 @@ describe('UploadWorkflow', () => {
 	})
 
 	it('handles undefined upload list without crashing', async () => {
+		const warnSpy = vi.spyOn(console, 'warn').mockImplementation(() => {})
 		const wrapper = mount(UploadWorkflow, {
 			/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
 			props: {} as any,
 		})
+		warnSpy.mockRestore()
 
 		expect(wrapper.html()).toMatchSnapshot()
 		expect(wrapper.findAll('.file-item')).toHaveLength(0)

package/src/components/UploadWorkflow/tests/UploadWorkflow.visual.cy.ts

@@ -0,0 +1,39 @@
+import UploadWorkflow from '../UploadWorkflow.vue'
+
+const defaultUploadList = [
+	{
+		id: '1',
+		title: 'Carte vitale',
+		state: 'initial',
+		showUploadBtn: true,
+	},
+	{
+		id: '2',
+		title: 'Justificatif',
+		state: 'success',
+		fileName: 'justificatif.pdf',
+	},
+]
+
+describe('UploadWorkflow - Visual regression tests', () => {
+	it('displays the upload workflow by default', () => {
+		cy.mountWithVuetify(UploadWorkflow, {
+			props: { uploadList: defaultUploadList },
+		})
+
+		cy.get('.v-application').should('be.visible')
+		cy.matchImageSnapshot('upload-workflow-default', cy.get('.v-application'))
+	})
+
+	it('displays the upload workflow with a section title', () => {
+		cy.mountWithVuetify(UploadWorkflow, {
+			props: {
+				uploadList: defaultUploadList,
+				sectionTitle: 'Documents à fournir',
+			},
+		})
+
+		cy.get('.v-application').should('be.visible')
+		cy.matchImageSnapshot('upload-workflow-with-title', cy.get('.v-application'))
+	})
+})

package/src/components/UserMenuBtn/tests/UserMenuBtn.visual.cy.ts

@@ -0,0 +1,42 @@
+import UserMenuBtn from '../UserMenuBtn.vue'
+
+const defaultMenuItems = [
+	{ text: 'Mon compte', value: 'account' },
+	{ text: 'Paramètres', value: 'settings' },
+]
+
+describe('UserMenuBtn - Visual regression tests', () => {
+	it('displays the user menu button by default', () => {
+		cy.mountWithVuetify(UserMenuBtn, {
+			props: { menuItems: defaultMenuItems },
+		})
+
+		cy.get('.user-menu-btn').should('be.visible')
+		cy.matchImageSnapshot('user-menu-btn-default', cy.get('.user-menu-btn'))
+	})
+
+	it('displays the user menu button with full name', () => {
+		cy.mountWithVuetify(UserMenuBtn, {
+			props: {
+				menuItems: defaultMenuItems,
+				fullName: 'Jean Dupont',
+				additionalInformation: 'N° 123456789',
+			},
+		})
+
+		cy.get('.user-menu-btn').should('be.visible')
+		cy.matchImageSnapshot('user-menu-btn-with-name', cy.get('.user-menu-btn'))
+	})
+
+	it('displays the user menu button without logout', () => {
+		cy.mountWithVuetify(UserMenuBtn, {
+			props: {
+				menuItems: defaultMenuItems,
+				hideLogoutBtn: true,
+			},
+		})
+
+		cy.get('.user-menu-btn').should('be.visible')
+		cy.matchImageSnapshot('user-menu-btn-no-logout', cy.get('.user-menu-btn'))
+	})
+})

package/src/components/index.ts

@@ -95,6 +95,7 @@ export { default as ChipList } from './ChipList/ChipList.vue'
 export * from './ChipList/types'
 export { default as CollapsibleList } from './CollapsibleList/CollapsibleList.vue'
 export { default as SyIcon } from './Customs/SyIcon/SyIcon.vue'
+export { default as SyIconButton } from './Customs/SyIconButton/SyIconButton.vue'
 export { default as DataList } from './DataList/DataList.vue'
 export { default as DataListGroup } from './DataListGroup/DataListGroup.vue'
 export { default as DataListItem } from './DataListItem/DataListItem.vue'

package/src/composables/date/tests/useDateFormatDayjs.spec.ts

@@ -96,5 +96,36 @@ describe('useDateFormatDayjs', () => {
 				process.env.TZ = previousTz
 			}
 		})
+
+		it('handles non-string non-Date input by converting to string', () => {
+			// Test avec un nombre qui sera converti en string
+			const result = parseDate(20230115 as unknown as string, 'YYYYMMDD')
+			expect(result).not.toBeNull()
+			expect(result?.getFullYear()).toBe(2023)
+		})
+
+		it('handles undefined input', () => {
+			expect(parseDate(undefined, 'DD/MM/YYYY')).toBeNull()
+		})
+	})
+
+	describe('useDateFormat composable', () => {
+		it('returns parseDate and formatDate functions', async () => {
+			const { useDateFormat } = await import('../useDateFormatDayjs')
+			const hook = useDateFormat()
+			expect(hook.parseDate).toBeDefined()
+			expect(hook.formatDate).toBeDefined()
+			expect(typeof hook.parseDate).toBe('function')
+			expect(typeof hook.formatDate).toBe('function')
+		})
+
+		it('uses returned functions correctly', async () => {
+			const { useDateFormat } = await import('../useDateFormatDayjs')
+			const { parseDate: hookParse, formatDate: hookFormat } = useDateFormat()
+
+			const date = hookParse('15/01/2023', 'DD/MM/YYYY')
+			expect(date).not.toBeNull()
+			expect(hookFormat(date, 'DD/MM/YYYY')).toBe('15/01/2023')
+		})
 	})
 })

package/src/composables/date/tests/useHolidayDay.spec.ts

@@ -0,0 +1,109 @@
+import { describe, it, expect } from 'vitest'
+import {
+	getJoursFeries,
+	isHolidayDay,
+	useHolidayDay,
+} from '../useHolidayDay'
+
+describe('useHolidayDay', () => {
+	const { calculPaquesGregorienne } = useHolidayDay()
+
+	describe('calculPaquesGregorienne', () => {
+		it('calculates Easter date for various years', () => {
+			// Pâques 2023: 9 avril
+			const paques2023 = calculPaquesGregorienne(2023)
+			expect(paques2023.jour).toBe(9)
+			expect(paques2023.mois).toBe(4)
+
+			// Pâques 2024: 31 mars
+			const paques2024 = calculPaquesGregorienne(2024)
+			expect(paques2024.jour).toBe(31)
+			expect(paques2024.mois).toBe(3)
+
+			// Pâques 2025: 20 avril
+			const paques2025 = calculPaquesGregorienne(2025)
+			expect(paques2025.jour).toBe(20)
+			expect(paques2025.mois).toBe(4)
+		})
+
+		it('handles years where sum <= 9 (Easter in March)', () => {
+			// Certaines années Pâques tombe en mars (sum <= 9)
+			const paques2016 = calculPaquesGregorienne(2016)
+			expect(paques2016.mois).toBe(3) // 27 mars 2016
+		})
+	})
+
+	describe('getJoursFeries', () => {
+		it('returns a Set of holidays for a given year', () => {
+			const holidays2023 = getJoursFeries(2023)
+			expect(holidays2023).toBeInstanceOf(Set)
+			expect(holidays2023.size).toBe(11) // 11 jours fériés fixes + variables
+		})
+
+		it('includes fixed holidays', () => {
+			const holidays2023 = getJoursFeries(2023)
+			expect(holidays2023.has('01/01/2023')).toBe(true) // Jour de l'an
+			expect(holidays2023.has('01/05/2023')).toBe(true) // Fête du travail
+			expect(holidays2023.has('08/05/2023')).toBe(true) // Victoire
+			expect(holidays2023.has('14/07/2023')).toBe(true) // Fête nationale
+			expect(holidays2023.has('15/08/2023')).toBe(true) // Assomption
+			expect(holidays2023.has('01/11/2023')).toBe(true) // Toussaint
+			expect(holidays2023.has('11/11/2023')).toBe(true) // Armistice
+			expect(holidays2023.has('25/12/2023')).toBe(true) // Noël
+		})
+
+		it('includes Easter-related holidays', () => {
+			const holidays2023 = getJoursFeries(2023)
+			// Pâques 2023: 9 avril
+			expect(holidays2023.has('10/04/2023')).toBe(true) // Lundi de Pâques
+			expect(holidays2023.has('18/05/2023')).toBe(true) // Ascension
+			expect(holidays2023.has('29/05/2023')).toBe(true) // Lundi de Pentecôte
+		})
+
+		it('accepts custom format', () => {
+			const holidays2023 = getJoursFeries(2023, 'YYYY-MM-DD')
+			expect(holidays2023.has('2023-01-01')).toBe(true)
+			expect(holidays2023.has('2023-12-25')).toBe(true)
+		})
+	})
+
+	describe('isHolidayDay', () => {
+		it('returns true for holidays', () => {
+			expect(isHolidayDay(new Date(2023, 0, 1))).toBe(true) // Jour de l'an
+			expect(isHolidayDay(new Date(2023, 4, 1))).toBe(true) // Fête du travail
+			expect(isHolidayDay(new Date(2023, 11, 25))).toBe(true) // Noël
+		})
+
+		it('returns false for non-holidays', () => {
+			expect(isHolidayDay(new Date(2023, 0, 2))).toBe(false) // 2 janvier
+			expect(isHolidayDay(new Date(2023, 5, 15))).toBe(false) // 15 juin
+		})
+
+		it('accepts string dates', () => {
+			expect(isHolidayDay('01/01/2023', 'DD/MM/YYYY')).toBe(true)
+			expect(isHolidayDay('02/01/2023', 'DD/MM/YYYY')).toBe(false)
+		})
+
+		it('accepts custom format', () => {
+			expect(isHolidayDay('2023-01-01', 'YYYY-MM-DD')).toBe(true)
+			expect(isHolidayDay('2023-12-25', 'YYYY-MM-DD')).toBe(true)
+		})
+
+		it('returns false for invalid dates', () => {
+			expect(isHolidayDay('invalid-date', 'DD/MM/YYYY')).toBe(false)
+			expect(isHolidayDay('', 'DD/MM/YYYY')).toBe(false)
+		})
+	})
+
+	describe('useHolidayDay composable', () => {
+		it('returns all functions', () => {
+			const hook = useHolidayDay()
+			expect(hook.getJoursFeries).toBeDefined()
+			expect(hook.isHolidayDay).toBeDefined()
+			expect(hook.calculPaquesGregorienne).toBeDefined()
+			expect(typeof hook.getJoursFeries).toBe('function')
+			expect(typeof hook.isHolidayDay).toBe('function')
+			expect(typeof hook.calculPaquesGregorienne).toBe('function')
+		})
+	})
+})