Add @vanilla-extract/recipes

axonivy · Dec 16, 2024 · 5ecde92 · 5ecde92
1 parent 2c11b56
commit 5ecde92
Show file tree

Hide file tree

Showing 5 changed files with 120 additions and 7 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/dataclass-editor/package.json b/packages/dataclass-editor/package.json
@@ -30,6 +30,7 @@
   "devDependencies": {
     "@testing-library/react": "^16.1.0",
     "@types/react": "^18.3.3",
+    "@vanilla-extract/recipes": "^0.5.5",
     "@vitejs/plugin-react": "^4.3.4",
     "eslint-plugin-testing-library": "^7.1.1",
     "jsdom": "^25.0.1",

diff --git a/packages/dataclass-editor/src/detail/field/entity/FieldEntityAssociation.tsx b/packages/dataclass-editor/src/detail/field/entity/FieldEntityAssociation.tsx
@@ -1,5 +1,14 @@
 import type { Association } from '@axonivy/dataclass-editor-protocol';
-import { BasicCheckbox, BasicField, BasicSelect, Collapsible, CollapsibleContent, CollapsibleTrigger, Flex } from '@axonivy/ui-components';
+import {
+  BasicCheckbox,
+  BasicField,
+  BasicSelect,
+  Collapsible,
+  CollapsibleContent,
+  CollapsibleTrigger,
+  Flex,
+  type MessageData
+} from '@axonivy/ui-components';
 import { useAppContext } from '../../../context/AppContext';
 import { useEntityField } from '../../../context/FieldContext';
 import { useMeta } from '../../../context/useMeta';
@@ -36,7 +45,7 @@ const cardinalityItems: Array<{ value: Association; label: string }> = [
   { value: 'MANY_TO_ONE', label: 'Many-to-One' }
 ] as const;
 
-export const cardinalityMessage = (cardinality?: Association) => {
+export const cardinalityMessage = (cardinality?: Association): MessageData | undefined => {
   if (cardinality === 'ONE_TO_MANY') {
     return {
       message: 'A One-to-Many association comes with a significant performance impact. Only use it if it is absolutely necessary.',

diff --git a/packages/dataclass-editor/src/master/AddFieldDialog.tsx b/packages/dataclass-editor/src/master/AddFieldDialog.tsx
@@ -27,22 +27,24 @@ import type { DataClass, Field } from '@axonivy/dataclass-editor-protocol';
 import { isEntity } from '../data/dataclass-utils';
 import { InputFieldWithTypeBrowser } from '../detail/field/InputFieldWithTypeBrowser';
 
-export const validateFieldName = (name: string, dataClass: DataClass): MessageData => {
+export const validateFieldName = (name: string, dataClass: DataClass) => {
   if (name.trim() === '') {
     return toErrorMessage('Name cannot be empty.');
   }
   if (dataClass.fields.some(field => field.name === name)) {
     return toErrorMessage('Name is already taken.');
   }
+  return;
 };
 
-export const validateFieldType = (type: string): MessageData => {
+export const validateFieldType = (type: string) => {
   if (type.trim() === '') {
     return toErrorMessage('Type cannot be empty.');
   }
+  return;
 };
 
-const toErrorMessage = (message: string) => {
+const toErrorMessage = (message: string): MessageData => {
   return { message: message, variant: 'error' };
 };
 

diff --git a/packages/dataclass-editor/src/master/useValidation.ts b/packages/dataclass-editor/src/master/useValidation.ts
@@ -1,10 +1,10 @@
 import type { MessageData } from '@axonivy/ui-components';
 import { useAppContext } from '../context/AppContext';
-import type { Field } from '@axonivy/dataclass-editor-protocol';
+import type { Field, Severity } from '@axonivy/dataclass-editor-protocol';
 
 export const useValidation = (field?: Field): Array<MessageData> => {
   const { validationMessages } = useAppContext();
   return validationMessages
     .filter(message => message.path === field?.name)
-    .map(message => ({ message: message.message, variant: message.severity.toLowerCase() }));
+    .map(message => ({ message: message.message, variant: message.severity.toLowerCase() as Lowercase<Severity> }));
 };