@cnamts/synapse 0.0.12-alpha → 0.0.14-alpha

package/src/utils/rules/isNotAfterDate/IsNotAfterDate.stories.ts

@@ -0,0 +1,109 @@
+import type { StoryObj } from '@storybook/vue3'
+import { VTextField } from 'vuetify/components'
+import { isNotAfterDateFn } from './index'
+import { ref } from 'vue'
+
+export default {
+	title: 'Guide du dev/Règles De Validation/isNotAfterDate',
+	component: isNotAfterDateFn,
+}
+
+export const Default: StoryObj<unknown> = {
+	render: () => {
+		return {
+			components: { VTextField },
+			setup() {
+				const date = isNotAfterDateFn('01/01/2022')
+				const model = ref('12/12/2023')
+
+				return { date, model }
+			},
+			template: `
+				<VTextField
+					v-model="model"
+					:rules="[date]"
+					label="Date"
+					variant="outlined"
+					validate-on="eager blur"
+				/>
+			`,
+		}
+	},
+	parameters: {
+		sourceCode: [
+			{
+				name: 'Script',
+				code: `
+				<script setup lang="ts">
+					import { VTextField } from 'vuetify/components'
+					import { isNotAfterDateFn } from '@cnamts/synapse'
+
+					const date = isNotAfterDateFn('01/01/2022')
+				</script>
+				`,
+			},
+			{
+				name: 'Template',
+				code: `
+				<template>
+					<VTextField
+						:rules="[date]"
+						label="Date"
+						variant="outlined"
+					/>
+				</template>
+				`,
+			},
+		],
+	},
+}
+
+export const CustomMessage: StoryObj<unknown> = {
+	render: () => {
+		return {
+			components: { VTextField },
+			setup() {
+				const date = isNotAfterDateFn('01/01/2022', {
+					default: (date: string) => `The date must not be after ${date}`,
+				})
+				return { date }
+			},
+			template: `
+				<VTextField
+					:rules="[date]"
+					label="Date"
+					variant="outlined"
+				/>
+			`,
+		}
+	},
+	parameters: {
+		sourceCode: [
+			{
+				name: 'Script',
+				code: `
+				<script setup lang="ts">
+					import { VTextField } from 'vuetify/components'
+					import { isNotAfterDateFn } from '@cnamts/synapse'
+
+					const date = isNotAfterDateFn('01/01/2022', {
+						default: (date: string) => \`The date must not be after \${date}\`,
+					})
+				</script>
+				`,
+			},
+			{
+				name: 'Template',
+				code: `
+				<template>
+					<VTextField
+						:rules="[date]"
+						label="Date"
+						variant="outlined"
+					/>
+				</template>
+				`,
+			},
+		],
+	},
+}

package/src/utils/rules/isNotAfterDate/index.ts

@@ -0,0 +1,25 @@
+import { formatDate } from '@/utils/formatDate'
+import { parseDate } from '@/utils/parseDate'
+import { ruleMessage } from '@/utils/ruleMessage'
+import { isDateAfter } from '../../functions/validation/isDateAfter'
+import type { ValidationResult, ValidationRule, Value } from '../types'
+import { defaultErrorMessages } from './locales'
+
+/** Check that the value is not after the specified date (DD/MM/YYYY format) */
+export function isNotAfterDateFn(
+	date: string,
+	errorMessages = defaultErrorMessages,
+): ValidationRule {
+	return (value: Value): ValidationResult => {
+		if (!value) {
+			return true
+		}
+
+		const formattedValue = formatDate(parseDate(date))
+
+		return (
+			!isDateAfter(date, value)
+			|| ruleMessage(errorMessages, 'default', [formattedValue])
+		)
+	}
+}

package/src/utils/rules/isNotAfterDate/locales.ts

@@ -0,0 +1,6 @@
+import type { ErrorMessages } from '../types'
+
+export const defaultErrorMessages: ErrorMessages = {
+	default: (date: string) =>
+		`La date doit être antérieure ou égale au ${date}.`,
+}

package/src/utils/rules/isNotAfterDate/tests/isNotAfterDate.spec.ts

@@ -0,0 +1,25 @@
+import { isNotAfterDateFn } from '..'
+import { describe, it, expect } from 'vitest'
+
+import dayjs from 'dayjs'
+import { formatDate } from '@/utils/formatDate'
+
+describe('notAfterDate', () => {
+	const currentDate = formatDate(dayjs())
+	const pastDate = formatDate(dayjs().subtract(1, 'year'))
+	const futureDate = formatDate(dayjs().add(1, 'year'))
+
+	const rule = isNotAfterDateFn(currentDate)
+
+	it('returns true with a past date', () => {
+		expect(rule(pastDate)).toBe(true)
+	})
+
+	it('returns an error with a future date', () => {
+		expect(typeof rule(futureDate)).toBe('string')
+	})
+
+	it('returns true if the value is falsy', () => {
+		expect(rule('')).toBe(true)
+	})
+})

package/src/utils/rules/isNotAfterToday/IsNotAfterToday.mdx

@@ -0,0 +1,83 @@
+import { Meta, Canvas, Source } from '@storybook/blocks';
+import * as IsNotAfterTodayStories from './IsNotAfterToday.stories';
+
+<Meta of={IsNotAfterTodayStories} />
+
+# Règle de validation `isNotAfterToday`
+
+La règle de validation `isNotAfterToday` permet de vérifier qu'une date n'est pas postérieure à la date du jour.
+
+## Usage
+
+Pour utiliser cette règle de validation, vous devez importer la règle `isNotAfterToday` depuis le package `@cnamts/synapse`.
+
+<Source dark code={`
+import { isNotAfterToday } from '@cnamts/synapse';
+`} />
+
+
+Vous pouvez ensuite utiliser la fonction comme règle d'un champs de formulaire.
+
+<Source dark code={`
+<script setup lang="ts">
+import { isNotAfterToday } from '@cnamts/synapse';
+import { VTextField } from 'vuetify/components';
+
+</script>
+
+<template>
+	<VTextField
+		:rules="[isNotAfterToday]"
+		label="Date"
+	/>
+</template>
+`} />
+
+## Customisation des messages d'erreur
+
+Vous pouvez personnaliser les messages d'erreur en passant un objet `errorMessages` en paramètre de la fonction `isNotAfterTodayFn`.
+Puis en utilisant la fonction retournée comme règle d'un champs de formulaire.
+
+<Source dark code={`
+<script setup lang="ts">
+import { isNotAfterTodayFn } from '@cnamts/synapse';
+import { VTextField } from 'vuetify/components';
+
+const notAfterToday = isNotAfterTodayFn({
+	default: \`The date must not be after today\`,
+});
+
+</script>
+
+<template>
+	<VTextField
+		:rules="[notAfterToday]"
+		label="Date"
+	/>
+</template>
+`} />
+
+## API
+
+<Source dark code={`
+
+isNotAfterTodayFn(
+	errorMessages?: {
+		default: string;
+	}
+): (value: string) => true | string;
+
+`} />
+
+### Arguments
+
+- `errorMessages` : objet optionnel permettant de personnaliser les messages d'erreur. Les clés disponibles sont :
+	- `default` : message d'erreur par défaut.
+
+### Valeurs de retour
+
+Retourne une fonction qui prend en paramètre une chaîne de caractères représentant une date et retourne `true` si la date n'est pas postérieure à la date du jour, sinon retourne un message d'erreur.
+
+## Exemples
+
+<Canvas of={IsNotAfterTodayStories.Default} />

package/src/utils/rules/isNotAfterToday/IsNotAfterToday.stories.ts

@@ -0,0 +1,110 @@
+import type { StoryObj } from '@storybook/vue3'
+import { VTextField } from 'vuetify/components'
+import { isNotAfterToday, isNotAfterTodayFn } from './index'
+import { ref } from 'vue'
+
+export default {
+	title: 'Guide du dev/Règles De Validation/isNotAfterToday',
+	component: isNotAfterTodayFn,
+}
+
+export const Default: StoryObj<unknown> = {
+	render: () => {
+		return {
+			components: { VTextField },
+			setup() {
+				const model = ref('12/12/2050')
+
+				return { model, isNotAfterToday }
+			},
+			template: `
+				<VTextField
+					v-model="model"
+					:rules="[isNotAfterToday]"
+					label="Date"
+					variant="outlined"
+					validate-on="eager blur"
+				/>
+			`,
+		}
+	},
+	parameters: {
+		sourceCode: [
+			{
+				name: 'Script',
+				code: `
+				<script setup lang="ts">
+					import { VTextField } from 'vuetify/components'
+					import { isNotAfterToday } from '@cnamts/synapse'
+				</script>
+				`,
+			},
+			{
+				name: 'Template',
+				code: `
+				<template>
+					<VTextField
+						:rules="[isNotAfterToday]"
+						label="Date"
+						variant="outlined"
+					/>
+				</template>
+				`,
+			},
+		],
+	},
+}
+
+export const CustomMessage: StoryObj<unknown> = {
+	render: () => {
+		return {
+			components: { VTextField },
+			setup() {
+				const messages = {
+					default: 'The date must not be after today.',
+				}
+				const dateRule = isNotAfterTodayFn(messages)
+
+				return { dateRule }
+			},
+			template: `
+				<VTextField
+					:rules="[dateRule]"
+					label="Date"
+					variant="outlined"
+					validate-on="eager blur"
+				/>
+			`,
+		}
+	},
+	parameters: {
+		sourceCode: [
+			{
+				name: 'Script',
+				code: `
+				<script setup lang="ts">
+					import { VTextField } from 'vuetify/components'
+					import { isNotAfterTodayFn } from '@cnamts/synapse'
+				
+					const messages = {
+						default: 'The date must not be after today.',
+					}
+					const dateRule = isNotAfterTodayFn(messages)
+				</script>
+				`,
+			},
+			{
+				name: 'Template',
+				code: `
+				<template>
+					<VTextField
+						:rules="[dateRule]"
+						label="Date"
+						variant="outlined"
+					/>
+				</template>
+				`,
+			},
+		],
+	},
+}

package/src/utils/rules/isNotAfterToday/index.ts

@@ -0,0 +1,28 @@
+import { formatDate } from '@/utils/formatDate'
+import { ruleMessage } from '@/utils/ruleMessage'
+import dayjs from 'dayjs'
+import { isDateAfter } from '../../functions/validation/isDateAfter'
+import type {
+	ErrorMessages,
+	ValidationResult,
+	ValidationRule,
+	Value,
+} from '../types'
+import { defaultErrorMessages } from './locales'
+
+/** Check that the value is not after today (DD/MM/YYYY format) */
+export function isNotAfterTodayFn(
+	errorMessages: ErrorMessages = defaultErrorMessages,
+): ValidationRule {
+	return (value: Value): ValidationResult => {
+		if (!value) {
+			return true
+		}
+
+		return (
+			!isDateAfter(formatDate(dayjs()), value) || ruleMessage(errorMessages, 'default')
+		)
+	}
+}
+
+export const isNotAfterToday = isNotAfterTodayFn()

package/src/utils/rules/isNotAfterToday/locales.ts

@@ -0,0 +1,5 @@
+import type { ErrorMessages } from '../types'
+
+export const defaultErrorMessages: ErrorMessages = {
+	default: 'La date doit être antérieure ou égale à aujourd’hui.',
+}

package/src/utils/rules/isNotAfterToday/tests/isNotAfterToday.spec.ts

@@ -0,0 +1,30 @@
+import dayjs from 'dayjs'
+import { it, describe, expect } from 'vitest'
+import { isNotAfterTodayFn } from '..'
+import { defaultErrorMessages } from '../locales'
+
+const DATE_FORMAT = 'DD/MM/YYYY'
+
+const pastDate = dayjs().subtract(1, 'year').format(DATE_FORMAT)
+const futureDate = dayjs().add(1, 'year').format(DATE_FORMAT)
+const today = dayjs().format(DATE_FORMAT)
+
+describe('notAfterTodayFn', () => {
+	const notAfterToday = isNotAfterTodayFn(defaultErrorMessages)
+
+	it('returns true when value is null', () => {
+		expect(notAfterToday(null)).toBe(true)
+	})
+
+	it('returns true when value is a date before today', () => {
+		expect(notAfterToday(pastDate)).toBe(true)
+	})
+
+	it('returns error message when value is a date after today', () => {
+		expect(notAfterToday(futureDate)).toBe(defaultErrorMessages.default)
+	})
+
+	it('returns true when value is today', () => {
+		expect(notAfterToday(today)).toBe(true)
+	})
+})

package/src/utils/rules/isNotBeforeDate/IsNotBeforeDate.mdx

@@ -0,0 +1,68 @@
+import { Meta, Canvas, Source } from '@storybook/blocks';
+import * as IsNotBeforeDateStories from './IsNotBeforeDate.stories';
+
+<Meta of={IsNotBeforeDateStories} />
+
+# Règle de validation `isNotBeforeDate`
+
+La règle de validation `isNotBeforeDate` permet de vérifier qu'une date n'est pas antérieure à une date de référence.
+
+## Usage
+
+Pour utiliser cette règle de validation, vous devez importer la fonction d'ordre supérieur `isNotBeforeDateFn` depuis le package `@cnamts/synapse`.
+
+<Source dark code={`
+import { isNotBeforeDateFn } from '@cnamts/synapse';
+`} />
+
+Vous devez ensuite faire appel à cette fonction en lui passant en paramètre la date de référence.
+
+<Source dark code={`
+const notBeforeToday = isNotBeforeDateFn('01/01/2022');
+`} />
+
+Vous pouvez ensuite utiliser la fonction retournée comme règle d'un champs de formulaire.
+
+<Source dark code={`
+<script setup lang="ts">
+import { isNotBeforeDateFn } from '@cnamts/synapse';
+import { VTextField } from 'vuetify/components';
+
+const notBefore = isNotBeforeDateFn('01/01/2022');
+
+</script>
+
+<template>
+	<VTextField
+		:rules="[notBefore]"
+		label="Date"
+	/>
+</template>
+`} />
+
+## API
+
+<Source dark code={`
+
+isNotBeforeDateFn(
+	date: string,
+	errorMessages?: {
+		default?: (date: string) => string;
+	}
+): (value: string) => true | string;
+
+`} />
+
+### Arguments
+
+- `date` : chaîne de caractères représentant la date de référence. La date doit être au format `JJ/MM/AAAA`.
+- `errorMessages` : objet optionnel permettant de personnaliser les messages d'erreur. Les clés disponibles sont :
+	- `default` : message d'erreur par défaut. Vous pouvez utiliser la variable `{{ date }}` pour afficher la date de référence.
+
+### Valeurs de retour
+
+Retourne une fonction de validation utilisable dans un champs de formulaire Vuetify qui permet de vérifier si la date passée en paramètre n'est pas antérieure à la date de référence.
+
+## Exemples
+
+<Canvas of={IsNotBeforeDateStories.Default} />

package/src/utils/rules/isNotBeforeDate/IsNotBeforeDate.stories.ts

@@ -0,0 +1,114 @@
+import type { StoryObj } from '@storybook/vue3'
+import { VTextField } from 'vuetify/components'
+
+import { isNotBeforeDateFn } from './index'
+import { ref } from 'vue'
+
+export default {
+	title: 'Guide du dev/Règles De Validation/isNotBeforeDate',
+	component: isNotBeforeDateFn,
+}
+
+export const Default: StoryObj<unknown> = {
+	render: () => {
+		return {
+			components: { VTextField },
+			setup() {
+				const date = isNotBeforeDateFn('01/01/2022')
+				const model = ref('12/12/2021')
+
+				return { date, model }
+			},
+			template: `
+				<VTextField
+					v-model="model"
+					:rules="[date]"
+					label="Date"
+					variant="outlined"
+					validate-on="eager blur"
+				/>
+			`,
+		}
+	},
+	parameters: {
+		sourceCode: [
+			{
+				name: 'Script',
+				code: `
+				<script setup lang="ts">
+					import { VTextField } from 'vuetify/components'
+					import { isNotBeforeDateFn } from '@cnamts/synapse'
+
+					const date = isNotBeforeDateFn('01/01/2022')
+				</script>
+				`,
+			},
+			{
+				name: 'Template',
+				code: `
+				<template>
+					<VTextField
+						:rules="[date]"
+						label="Date"
+						variant="outlined"
+					/>
+				</template>
+				`,
+			},
+		],
+	},
+}
+
+export const WithCustomMessage: StoryObj<unknown> = {
+	render: () => {
+		return {
+			components: { VTextField },
+			setup() {
+				const date = isNotBeforeDateFn('01/01/2022', {
+					default: (date: string) => `the date must not be before ${date}`,
+				})
+				const model = ref('12/12/2021')
+
+				return { date, model }
+			},
+			template: `
+				<VTextField
+					v-model="model"
+					:rules="[date]"
+					label="Date after 2022"
+					variant="outlined"
+					validate-on="eager blur"
+				/>
+			`,
+		}
+	},
+	parameters: {
+		sourceCode: [
+			{
+				name: 'Script',
+				code: `
+				<script setup lang="ts">
+					import { VTextField } from 'vuetify/components'
+					import { isNotBeforeDateFn } from '@cnamts/synapse'
+
+					const date = isNotBeforeDateFn('01/01/2022', {
+						default: (date: string) => \`the date must not be before \${date}\`,
+					})
+				</script>
+				`,
+			},
+			{
+				name: 'Template',
+				code: `
+				<template>
+					<VTextField
+						:rules="[date]"
+						label="Date after 2022"
+						variant="outlined"
+					/>
+				</template>
+				`,
+			},
+		],
+	},
+}

package/src/utils/rules/isNotBeforeDate/index.ts

@@ -0,0 +1,25 @@
+import type { ValidationRule, ValidationResult, Value } from '../types'
+import { defaultErrorMessages } from './locales'
+import { isDateBefore } from '../../functions/validation/isDateBefore'
+import { formatDate } from '@/utils/formatDate'
+import { parseDate } from '@/utils/parseDate'
+import { ruleMessage } from '@/utils/ruleMessage'
+
+/** Check that the value is not after the specified date (DD/MM/YYYY format) */
+export function isNotBeforeDateFn(
+	date: string,
+	errorMessages = defaultErrorMessages,
+): ValidationRule {
+	return (value: Value): ValidationResult => {
+		if (!value) {
+			return true
+		}
+
+		const formattedValue = formatDate(parseDate(date))
+
+		return (
+			!isDateBefore(date, value)
+			|| ruleMessage(errorMessages, 'default', [formattedValue])
+		)
+	}
+}

package/src/utils/rules/isNotBeforeDate/locales.ts

@@ -0,0 +1,6 @@
+import type { ErrorMessages } from '../types'
+
+export const defaultErrorMessages: ErrorMessages = {
+	default: (date: string) =>
+		`La date doit être postérieure ou égale au ${date}.`,
+}

package/src/utils/rules/isNotBeforeDate/tests/IsNotBeforeDate.spec.ts

@@ -0,0 +1,25 @@
+import { isNotBeforeDateFn } from '..'
+import { describe, it, expect } from 'vitest'
+
+import dayjs from 'dayjs'
+import { formatDate } from '@/utils/formatDate'
+
+describe('isNotBeforeDate', () => {
+	const currentDate = formatDate(dayjs())
+	const pastDate = formatDate(dayjs().subtract(1, 'year'))
+	const futureDate = formatDate(dayjs().add(1, 'year'))
+
+	const rule = isNotBeforeDateFn(currentDate)
+
+	it('returns true with a future date', () => {
+		expect(rule(futureDate)).toBe(true)
+	})
+
+	it('returns an error with a past date', () => {
+		expect(typeof rule(pastDate)).toBe('string')
+	})
+
+	it('returns true if the value is falsy', () => {
+		expect(rule('')).toBe(true)
+	})
+})