User Input Validation

TLDR;

1. Валідації – напряму повʼязані з карточками. Наразі (v25.08), зашиті та тісно інтегровані в карточку.

2. Валідація складається з 2х частин: Zod + Regle.

3. Zod схеми – "основа" валідації, самі перевірки. Генеруються в рамках пакету @webitel/api-services.

4. Regle – обгортка Zod для роботи у компонентах, з реактивністю, з методами та статус-флагами валідації.

Задачі Zod

1. Перевірка даних згідно його схеми валідації
2. Заповнення default значень
3. Формування текстів помилок (!)

Задачі Regle

1. Інтеграція з Vue
2. Реактивність
3. Розрахунок правильності, корисних для ui флагів стану

Як "під капотом" відбувається обгортування

Крок 1: @webitel/api-services

1. У @webitel/api-services: маємо згенеровану Zod-схему, яка описує валідацію.

Крок 2: @webitel/ui-datalist -> stores

2. У @webitel/ui-datalist: у сторі карточки очікуємо цю схему як параметр createCardStore().

3. Там же: обгортаємоZod-схему у Regle...

4. ... і return'мо цю схему зі стора.

Крок 3: crm

5. crm: при створенні конкретного стора карточки конкретної сутності, імпортуємо zod-схему з @webitel/api-services, та передаємо її у createCardStore().

6. crm: На рівні конкретної карточки імпортуємо цей стор з попереднього кроку, передаємо у useCardComponent composable,

Крок 4: Назад в @webitel/ui-datalist -> composables

7. @webitel/ui-datalist: з useCardComponent прокидаємо Regle-схему у useCardValidation composable, і вже там розраховується і вертається все необхідне.

FAQ

Як Zod у нас повʼязаний з Regle?

Regle: Schemas libraries