refactor: fix validation for add gacha roll item

- Pisahkan type dan schema untuk gacha roll item
- Perbaiki validasi gacha roll item
- Parsing angka pada component ControlledInputField
- Update type number untuk component Input dan InputField

libs/service/src/schemas/gacha/index.ts

@@ -0,0 +1,23 @@
+import { z } from 'zod';
+
+export const gachaRollItemSchema = z.object({
+  itemName: z
+    .string({
+      required_error: 'Nama item tidak boleh kosong',
+      invalid_type_error: 'Nama item harus berupa string',
+    })
+    .min(1, 'Nama item tidak boleh kosong'),
+  quantity: z
+    .number({
+      required_error: 'Quantity tidak boleh kosong',
+      invalid_type_error: 'Quantity harus berupa angka',
+    })
+    .min(1, 'Quantity paling sedikit adalah 1'),
+  chanceRate: z
+    .number({
+      required_error: 'Chance rate tidak boleh kosong',
+      invalid_type_error: 'Chance rate harus berupa angka',
+    })
+    .min(0.1, 'Chance rate paling sedikit adalah 0,1')
+    .max(1, 'Chance rate paling banyak adalah 1'),
+});

libs/service/src/schemas/index.ts

@@ -1 +1,2 @@
 export * from './auth';
+export * from './gacha';

libs/service/src/types/gacha/index.ts

@@ -1 +1,5 @@
-export {};
+export type TGachaRollItem = {
+  itemName: string;
+  quantity: number;
+  chanceRate: number;
+};

libs/ui/src/atoms/input/input.tsx

@@ -9,7 +9,7 @@ import { EyeInvisibleOutlined, EyeOutlined } from '@ant-design/icons'; // Import
 import { cn } from '@imphnen-frontend-service/utils';
 import { Button } from '../button';
 
-type TInputType = 'text' | 'email' | 'password' | 'file';
+type TInputType = 'text' | 'email' | 'number' | 'password' | 'file';
 type TInputSize = 'sm' | 'md' | 'lg';
 
 type TInputProps = Omit<

libs/ui/src/molecules/input-field/input-field.tsx

@@ -7,7 +7,7 @@ import {
 import { Input } from '../../atoms';
 import { cn } from '@imphnen-frontend-service/utils';
 
-export type TInputType = 'text' | 'email' | 'password' | 'file';
+export type TInputType = 'text' | 'email' | 'number' | 'password' | 'file';
 export type TInputSize = 'sm' | 'md' | 'lg';
 export type TInputFieldProps = Omit<
   DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>,

libs/ui/src/organisms/controlled-field/controlled-input-field.tsx

@@ -15,7 +15,19 @@ export const ControlledInputField = <T extends FieldValues>(
   props: TControlledInputFieldProps<T>
 ) => {
   const { field, fieldState } = useController<T>(props);
+
+  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    const value =
+      props.type === 'number' ? Number(e.target.value) : e.target.value;
+    field.onChange(value);
+  };
+
   return (
-    <InputField error={fieldState.error?.message} {...{ ...props, ...field }} />
+    <InputField
+      error={fieldState.error?.message}
+      {...props}
+      {...field}
+      onChange={handleChange}
+    />
   );
 };