fix

comps/filter/FilterContent.tsx

@@ -48,8 +48,7 @@ export const FilterContent: FC<{
               margin-top: 0 !important;
             }
             .field-outer {
-              margin-top: 3px;
-              margin-bottom: 3px;
+              margin: 3px;
             }
 
             .search-all {

comps/form/Form.tsx

@@ -223,11 +223,13 @@ export const Form: FC<FMProps> = (props) => {
               `
         )}
       >
+        <>
           {fm.status !== "init" && fm.size.width > 0 && (
             <PassProp fm={fm} submit={fm.submit}>
-            {body}
+              {!fm.data ? <>NO DATA</> : body}
             </PassProp>
           )}
+        </>
         <button type="submit" className="c-hidden"></button>
       </div>
     </form>

comps/form/field/type/TypeLink.tsx

@@ -4,7 +4,7 @@ import { FieldLoading, Spinner } from "lib/comps/ui/field-loading";
 import { hashSum } from "lib/utils/hash-sum";
 import { getPathname } from "lib/utils/pathname";
 import { useLocal } from "lib/utils/use-local";
-import { ArrowUpRight } from "lucide-react";
+import { ArrowUpRight, Construction, Cuboid, Loader } from "lucide-react";
 import { FC, ReactNode, useEffect } from "react";
 import { FMLocal, FieldLocal, FieldProp } from "../../typings";
 
@@ -30,14 +30,47 @@ export const FieldLink: FC<{
     const link_local = useLocal({
       navigating: false,
     });
+
+    const pk = Object.values(fm.field_def).find((e) => e.is_pk);
+    if (!pk) {
+      return <>No Primary Key</>;
+    }
+
+    if (!fm.data[pk.name]) {
+      return (
+        <div
+          className={cx(
+            css`
+              color: #999;
+            `,
+            "c-flex c-space-x-2 items-center"
+          )}
+        >
+          <div
+            className={cx(
+              css`
+                border: 1px solid #ececeb;
+              `,
+              "c-rounded c-flex c-space-x-1 items-center c-px-2"
+            )}
+          >
+            <Construction size={12} /> <div>Unsaved</div>
+          </div>
+          <div>No Item</div>
+        </div>
+      );
+    }
+
     return (
       <div
         className={cx(
           "c-my-1 c-px-2 c-rounded-md c-flex c-items-center cursor-pointer c-space-x-1 c-transition-all",
           css`
-            border: 1px solid #aaa;
+            border: 1px solid #bbb;
             &:hover {
-              background-color: #dcedfc;
+              border: 1px solid rgb(126, 167, 203);
+              background: rgb(220, 237, 252);
+              color: #001080;
             }
           `
         )}

comps/form/gen/gen-form.ts

@@ -57,14 +57,18 @@ export const generateForm = async (
           pks,
           opt: is_md
             ? {
-                after_load: `
+                after_load: `\
       if (typeof md === "object") {
         opt.fm.status = "ready";
         md.selected = opt.fm.data;
+        if (!md.selected) {
+          md.tab.active = "master";
+          alert("Data Not Found");
+          md.params.apply();
+        }
         md.header.render();
         md.render();
-      }
-`,
+      }`,
                 is_md: true,
               }
             : { is_md },
@@ -204,9 +208,10 @@ ${
 
     ${
       is_md &&
-      `\
-      if (typeof md !== "undefined") {
+      `if (typeof md !== "undefined") {
       fm.status = "ready";
+      fm.data = form;
+      md.selected = form;
       md.render();
       fm.render();
     }`

comps/form/gen/on_load.ts

@@ -70,11 +70,16 @@ ${
       ${pk}: id,
     };
     
+    try {
       const gen = generateSelect(fields);
       item = await table?.findFirst({
         where,
         select: gen.select,
       });
+    } catch (e) {
+      item = null;
+      console.error(e);
+    }
 
     setTimeout(() => {
       call_prasi_events("form", "after_load", [opt?.fm]);

comps/form/utils/init.tsx

@@ -64,13 +64,10 @@ export const formInit = (fm: FMLocal, props: FMProps) => {
           } else {
             result = on_load_result;
           }
-          if (!!result) {
-            fm.data = result;
-          }
 
-          if (!fm.data) {
-            fm.data = {};
-          }
+          fm.data = result;
+
+          if (result === undefined) fm.data = {};
 
           if (isEditor) {
             const item_id = props.item.id;

comps/md/MasterDetail.tsx

@@ -92,7 +92,21 @@ export const MasterDetail: FC<MDProps> = (arg) => {
     md.params.parse();
     if (pk) {
       const value = md.params.hash[md.name];
+      if (!value && md.selected && Object.keys(md.selected).length === 0) {
+        md.params.hash[md.name] = "+";
+        md.params.apply();
+      }
+
       if (value) {
+        if (value === "+") {
+          md.tab.active = "detail";
+          if (!md.selected) {
+            md.selected = {};
+          } else if (md.selected && md.selected[pk.name]) {
+            md.params.hash[md.name] = md.selected[pk.name];
+            md.params.apply();
+          }
+        } else {
           if (md.selected && md.selected[pk.name] === value) {
           } else {
             md.selected = { [pk.name]: value };
@@ -106,6 +120,7 @@ export const MasterDetail: FC<MDProps> = (arg) => {
         }
       }
     }
+  }
 
   if (isEditor) {
     useEffect(() => {

utils/prasi-events.ts

@@ -2,6 +2,7 @@ import { FieldLocal } from "lib/comps/form/typings";
 import { FMLocal } from "../..";
 import { Prisma } from "../../typings/prisma";
 import { set } from "./set";
+import { MDLocal } from "lib/comps/md/utils/typings";
 
 const events = {
   form: {
@@ -10,6 +11,12 @@ const events = {
     after_save: async (fm: FMLocal, record: any) => {},
     before_load: async (fm: FMLocal) => {},
     after_load: async (fm: FMLocal) => {},
+    before_delete: async (md: MDLocal, fm: FMLocal) => {
+      return {
+        preventDelete: false as boolean,
+        navigateBack: true as boolean,
+      };
+    },
   },
   field: {
     relation_load: async (fm: FMLocal, field: FieldLocal) => {