add validation empty field on create and update form

src/pages/master/municipios/blocks/AddDialog.tsx

@@ -72,12 +72,12 @@ const AddDialog = () => {
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
-    if (formField.name === '') {
+    if (formField.name.trim() === '') {
       setAlert({ show: true, message: 'Please fill name field.' });
       return;
     }
 
-    doCreateMunicipio(e);
+    // doCreateMunicipio(e);
     console.log(parsedUser.email);
     console.log(formField);
     setAlert({ show: false, message: '' });

src/pages/master/municipios/blocks/EditDialog.tsx

@@ -77,7 +77,7 @@ const EditDialog = () => {
   const handleUpdate = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
-    if (formField.name === '') {
+    if (formField.name.trim() === '') {
       setAlert({ show: true, message: 'Please fill name field.' });
       return;
     }
@@ -88,7 +88,7 @@ const EditDialog = () => {
     //   created_at: formattedTime
     // });
 
-    doUpdateMunicipios(e);
+    // doUpdateMunicipios(e);
     console.log(formField);
     setAlert({ show: false, message: '' });
   };

src/pages/master/municipios/blocks/ListToolbar.tsx

@@ -29,8 +29,8 @@ const ListToolbar = () => {
               <input
                 type="text"
                 placeholder="Search Municipios"
-                value={searchName}
+                value={(table.getColumn('name')?.getFilterValue() as string) ?? ''}
-                onChange={(event) => setSearchName(event.target.value)}
+                onChange={(event) => table.getColumn('name')?.setFilterValue(event.target.value)}
               />
             </label>
             <DefaultTooltip title={'Filter'} placement={'top'}>

src/pages/master/municipios/hooks/ManageMunicipiosContext.tsx

@@ -113,8 +113,9 @@ const ManageMunicipiosProvider = ({ children }: { children: React.ReactNode }) =
         }
       },
       {
-        accessorFn: (row) => row.name,
+        // accessorFn: (row) => row.name,
-        id: 'name',
+        // id: 'name',
+        accessorKey: 'name',
         header: ({ column }) => <DataGridColumnHeader title="Municipios Name" column={column} />,
         enableSorting: true,
         enableHiding: false,

src/pages/master/postoadms/blocks/AddDialog.tsx

@@ -83,7 +83,7 @@ const AddDialog = () => {
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
-    if (formField.name === '' || formField.municipio_id === 0) {
+    if (formField.name.trim() === '' || formField.municipio_id === 0) {
       setAlert({ show: true, message: 'Please fill in all required fields.' });
       return;
     }

src/pages/master/postoadms/blocks/EditDialog.tsx

@@ -83,7 +83,7 @@ const EditDialog = () => {
   const handleUpdate = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
-    if (formField.name === '' || formField.municipio_id === 0) {
+    if (formField.name.trim() === '' || formField.municipio_id === 0) {
       setAlert({ show: true, message: 'Please fill in all required fields.' });
       return;
     }

src/pages/master/products/blocks/AddDialog.tsx

@@ -71,21 +71,21 @@ const AddDialog = () => {
     e.preventDefault();
 
     if (
-      formField.name === '' ||
+      formField.name.trim() === '' ||
-      formField.description === '' ||
+      formField.description.trim() === '' ||
       formField.price_point === 0 ||
       formField.price_cash === 0 ||
       formField.cashback_point === 0 ||
       formField.cashback_cash === 0 ||
-      formField.status === '' ||
+      formField.status.trim() === '' ||
-      formField.created_by === '' ||
+      formField.created_by.trim() === '' ||
-      formField.created_at === ''
+      formField.created_at.trim() === ''
     ) {
       setAlert({ show: true, message: 'Please fill in all required fields.' });
       return;
     }
 
-    doCreateProduct(e);
+    // doCreateProduct(e);
     console.log(formField);
     setAlert({ show: false, message: '' });
   };

src/pages/master/products/blocks/EditDialog.tsx

@@ -70,15 +70,15 @@ const EditDialog = () => {
     e.preventDefault();
 
     if (
-      formField.name === '' ||
+      formField.name.trim() === '' ||
-      formField.description === '' ||
+      formField.description.trim() === '' ||
       formField.price_point === 0 ||
       formField.price_cash === 0 ||
       formField.cashback_point === 0 ||
       formField.cashback_cash === 0 ||
       formField.status === '' ||
-      formField.updated_by === '' ||
+      formField.updated_by.trim() === '' ||
-      formField.updated_at === ''
+      formField.updated_at.trim() === ''
     ) {
       setAlert({ show: true, message: 'Please fill in all required fields.' });
       return;

src/pages/master/profession/blocks/AddDialog.tsx

@@ -61,7 +61,7 @@ const AddDialog = () => {
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
-    if (formField.name === '') {
+    if (formField.name.trim() === '') {
       setAlert({ show: true, message: 'Please fill name field.' });
       return;
     }

src/pages/master/profession/blocks/EditDialog.tsx

@@ -65,7 +65,7 @@ const EditDialog = () => {
   const handleUpdate = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
-    if (formField.name === '') {
+    if (formField.name.trim() === '') {
       setAlert({ show: true, message: 'Please fill name field.' });
       return;
     }

src/pages/master/provider/blocks/AddDialog.tsx

@@ -100,12 +100,12 @@ const AddDialog = () => {
     e.preventDefault();
 
     if (
-      formField.name === '' ||
+      formField.name.trim() === '' ||
-      formField.description === '' ||
+      formField.description.trim() === '' ||
-      formField.type === '' ||
+      formField.type.trim() === '' ||
-      formField.status === '' ||
+      formField.status.trim() === '' ||
-      formField.transactionTypeId === '' ||
+      formField.transactionTypeId.trim() === '' ||
-      formField.agentId === ''
+      formField.agentId.trim() === ''
     ) {
       setAlert({ show: true, message: 'Please fill in all required fields.' });
       return;

src/pages/master/provider/blocks/EditDialog.tsx

@@ -114,12 +114,12 @@ const EditDialog = () => {
     e.preventDefault();
 
     if (
-      formField.name === '' ||
+      formField.name.trim() === '' ||
-      formField.description === '' ||
+      formField.description.trim() === '' ||
-      formField.type === '' ||
+      formField.type.trim() === '' ||
-      formField.status === '' ||
+      formField.status.trim() === '' ||
-      formField.transactionTypeId === '' ||
+      formField.transactionTypeId.trim() === '' ||
-      formField.agentId === ''
+      formField.agentId.trim() === ''
     ) {
       setAlert({ show: true, message: 'Please fill in all required fields.' });
       return;

src/pages/master/sucos/blocks/AddDialog.tsx

@@ -62,7 +62,7 @@ const AddDialog = () => {
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
-    if (formField.name === '' || formField.posto_adm_id === 0) {
+    if (formField.name.trim() === '' || formField.posto_adm_id === 0) {
       setAlert({ show: true, message: 'Please fill in all required fields.' });
       return;
     }

src/pages/master/sucos/blocks/EditDialog.tsx

@@ -68,7 +68,7 @@ const EditDialog = () => {
   const handleUpdate = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
 
-    if (formField.name === '' || formField.posto_adm_id === 0) {
+    if (formField.name.trim() === '' || formField.posto_adm_id === 0) {
       setAlert({ show: true, message: 'Please fill in all required fields.' });
       return;
     }