From b5531a74d1ce295abbd5f8394dcd38b154961f4a Mon Sep 17 00:00:00 2001
From: rizky <me@rizrmd.com>
Date: Mon, 1 Apr 2024 07:22:38 -0700
Subject: [PATCH] fix

---
 comps/form/Field.tsx | 15 +++++++--
 comps/form/Form.tsx  | 75 +++++++++++++++++++++++++-------------------
 gen/utils.ts         |  2 +-
 3 files changed, 56 insertions(+), 36 deletions(-)

diff --git a/comps/form/Field.tsx b/comps/form/Field.tsx
index f9dd7da..6a3e73e 100755
--- a/comps/form/Field.tsx
+++ b/comps/form/Field.tsx
@@ -38,7 +38,8 @@ export const Field: FC<{
     | "datetime"
     | "money"
     | "slider"
-    | "master-link";
+    | "master-link"
+    | "custom";
   required: "y" | "n";
   options: FieldOptions;
   slider: () => Promise<SliderOptions>;
@@ -76,7 +77,8 @@ export const Field: FC<{
   rel_table,
   rel_query,
 }) => {
-  const value = form?.hook.getValues()[name];
+  const values = form?.hook.getValues();
+  const value = values[name];
   const local = useLocal({
     date: {
       // label: "",
@@ -177,6 +179,15 @@ export const Field: FC<{
             </FormLabel>
             <FormControl>
               <>
+                {type === "custom" && (
+                  <div
+                    className={cx(
+                      "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50"
+                    )}
+                  >
+                    {custom}
+                  </div>
+                )}
                 {type === "slider" && (
                   <div className="c-flex-1 c-min-h-[40px] c-flex">
                     <div className="c-flex c-flex-col c-items-center">
diff --git a/comps/form/Form.tsx b/comps/form/Form.tsx
index 64d2b42..882d4c1 100755
--- a/comps/form/Form.tsx
+++ b/comps/form/Form.tsx
@@ -1,7 +1,7 @@
 import { Form as FForm } from "@/comps/ui/form";
 import { Toaster } from "@/comps/ui/sonner";
 import { useLocal } from "@/utils/use-local";
-import { FC, useEffect } from "react";
+import { FC, useEffect, useState } from "react";
 import { createPortal } from "react-dom";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
@@ -9,6 +9,7 @@ import { FormHook } from "./utils/utils";
 import { AlertTriangle, Check, Loader2 } from "lucide-react";
 import { cn } from "@/utils";
 import { Skeleton } from "../ui/skeleton";
+import { getPathname } from "../../..";
 
 export const Form: FC<{
   on_init: (arg: { submit: any; reload: any }) => any;
@@ -88,41 +89,46 @@ export const Form: FC<{
         }
       }
 
-      await on_submit({
+      const res = on_submit({
         form: data,
         error: form.hook.formState.errors,
       });
-      toast.dismiss();
 
-      if (Object.keys(form.hook.formState.errors).length > 0) {
-        toast.error(
-          <div className="c-flex c-text-red-600 c-items-center">
-            <AlertTriangle className="c-h-4 c-w-4 c-mr-1" />
-            Save Failed, please correct{" "}
-            {Object.keys(form.hook.formState.errors).length} errors.
-          </div>,
-          {
-            dismissible: true,
-            className: css`
-              background: #ffecec;
-              border: 2px solid red;
-            `,
-          }
-        );
-      } else {
-        toast.success(
-          <div className="c-flex c-text-blue-700 c-items-center">
-            <Check className="c-h-4 c-w-4 c-mr-1 " />
-            Done
-          </div>,
-          {
-            className: css`
-              background: #e4f5ff;
-              border: 2px solid blue;
-            `,
-          }
-        );
-      }
+      await res;
+      toast.dismiss();
+      setTimeout(() => {
+        toast.dismiss();
+
+        if (Object.keys(form.hook.formState.errors).length > 0) {
+          toast.error(
+            <div className="c-flex c-text-red-600 c-items-center">
+              <AlertTriangle className="c-h-4 c-w-4 c-mr-1" />
+              Save Failed, please correct{" "}
+              {Object.keys(form.hook.formState.errors).length} errors.
+            </div>,
+            {
+              dismissible: true,
+              className: css`
+                background: #ffecec;
+                border: 2px solid red;
+              `,
+            }
+          );
+        } else {
+          toast.success(
+            <div className="c-flex c-text-blue-700 c-items-center">
+              <Check className="c-h-4 c-w-4 c-mr-1 " />
+              Done
+            </div>,
+            {
+              className: css`
+                background: #e4f5ff;
+                border: 2px solid blue;
+              `,
+            }
+          );
+        }
+      }, 100);
     }, 300);
   };
 
@@ -141,11 +147,13 @@ export const Form: FC<{
         local.render();
       },
     });
+
     const res = on_load();
     const loaded = (values: any) => {
       setTimeout(() => {
         toast.dismiss();
       });
+
       if (!!values) {
         for (const [k, v] of Object.entries(values)) {
           form.hook.setValue(k, v);
@@ -224,7 +232,8 @@ export const Form: FC<{
               } else {
                 local.layout = "2-col";
               }
-              local.render();
+
+              local.render(true);
             }
           }}
           className={cx(
diff --git a/gen/utils.ts b/gen/utils.ts
index f1f305a..29cfdbd 100755
--- a/gen/utils.ts
+++ b/gen/utils.ts
@@ -1,7 +1,7 @@
 import { createId } from "@paralleldrive/cuid2";
 import capitalize from "lodash.capitalize";
 
-export type GFCol = {
+export type GFCol = { 
   name: string;
   type: string;
   is_pk: boolean;