style: do inputs design modification

src/app/(modules)/package/components/PackageDialog.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import type { ComponentProps } from 'react';
-import type { FieldErrors, UseFormRegister, UseFormReturn } from 'react-hook-form';
+import type { FieldErrors, UseFormRegister } from 'react-hook-form';
 import { Globe, Loader2, Package as PackageIcon } from 'lucide-react';
 
 import { FormField } from '@/components/form';
@@ -36,7 +36,7 @@ interface PackageDialogProps {
   onProjectChange: (projectId: string) => void;
   register: UseFormRegister<PackageFormValues>;
   errors: FieldErrors<PackageFormValues>;
-  touchedFields: UseFormReturn<PackageFormValues>['formState']['touchedFields'];
+  isSubmitted: boolean;
   onSubmit: ComponentProps<'form'>['onSubmit'];
   canSubmit: boolean;
   isSaving: boolean;
@@ -52,19 +52,15 @@ export function PackageDialog({
   onProjectChange,
   register,
   errors,
-  touchedFields,
+  isSubmitted,
   onSubmit,
   canSubmit,
   isSaving,
 }: PackageDialogProps) {
-  const projectErrorMessage = touchedFields.project_id ? errors.project_id?.message : undefined;
-  const nameErrorMessage = touchedFields.name ? errors.name?.message : undefined;
-  const startErrorMessage = touchedFields.chainage_start_km
-    ? errors.chainage_start_km?.message
-    : undefined;
-  const endErrorMessage = touchedFields.chainage_end_km
-    ? errors.chainage_end_km?.message
-    : undefined;
+  const projectErrorMessage = isSubmitted ? errors.project_id?.message : undefined;
+  const nameErrorMessage = isSubmitted ? errors.name?.message : undefined;
+  const startErrorMessage = isSubmitted ? errors.chainage_start_km?.message : undefined;
+  const endErrorMessage = isSubmitted ? errors.chainage_end_km?.message : undefined;
 
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
@@ -155,7 +151,12 @@ export function PackageDialog({
           </div>
 
           <DialogFooter>
-            <Button type="button" variant="outline" onClick={() => onOpenChange(false)} disabled={isSaving}>
+            <Button
+              type="button"
+              variant="outline"
+              onClick={() => onOpenChange(false)}
+              disabled={isSaving}
+            >
               Cancel
             </Button>
             <Button type="submit" disabled={isSaving || !canSubmit}>