diff --git a/comps/form/Form.tsx b/comps/form/Form.tsx index a2c06f7..3b644db 100755 --- a/comps/form/Form.tsx +++ b/comps/form/Form.tsx @@ -119,7 +119,7 @@ export const Form: FC = (props) => { fm.status = "init"; fm.render(); } - }, [getPathname()]); + }, [getPathname({ hash: true })]); useEffect(() => { if (fm.status === "ready") { diff --git a/comps/form/base/BaseField.tsx b/comps/form/base/BaseField.tsx index 1a53682..36d58d5 100755 --- a/comps/form/base/BaseField.tsx +++ b/comps/form/base/BaseField.tsx @@ -124,7 +124,11 @@ export const BaseField = (prop: {
{errors.map((err) => { diff --git a/comps/form/field/Field.tsx b/comps/form/field/Field.tsx index 073ca2a..c62b19f 100755 --- a/comps/form/field/Field.tsx +++ b/comps/form/field/Field.tsx @@ -30,12 +30,10 @@ export const Field: FC = (arg) => { if (arg.on_change) { arg.on_change({ value: fm.data[name], name, fm }); } - if(!fm.events){ + if (!fm.events) { fm.events = { - on_change(name, new_value) { - - }, - } + on_change(name, new_value) {}, + }; } fm.events.on_change(name, fm.data[name]); @@ -52,8 +50,8 @@ export const Field: FC = (arg) => { }, [field]); if (field.status === "init" && !isEditor) return null; let errors = fm.error.get(name); - if(field.error){ - errors = [field.error] + if (field.error) { + errors = [field.error]; } const props = { ...arg.props }; @@ -122,14 +120,19 @@ export const Field: FC = (arg) => {
+ > {errors.map((err) => { return
{err}
; })}
- ) : <>} + ) : ( + <> + )}
); diff --git a/comps/form/utils/init.tsx b/comps/form/utils/init.tsx index 32b8f10..8b60e0e 100755 --- a/comps/form/utils/init.tsx +++ b/comps/form/utils/init.tsx @@ -1,10 +1,12 @@ import { parseGenField } from "@/gen/utils"; import get from "lodash.get"; -import { AlertTriangle, Check, Loader2 } from "lucide-react"; +import { AlertTriangle, Check, ChevronLeft, Loader2, Plus } from "lucide-react"; import { FMLocal, FMProps } from "../typings"; import { editorFormData } from "./ed-data"; import { formError } from "./error"; import { toast } from "lib/comps/ui/toast"; +import { Button } from "lib/comps/ui/button"; +import { MDLocal } from "lib/comps/md/utils/typings"; export const formInit = (fm: FMLocal, props: FMProps) => { for (const [k, v] of Object.entries(props)) { @@ -19,6 +21,107 @@ export const formInit = (fm: FMLocal, props: FMProps) => { fm.field_def[d.name] = d; } + const toastSuccess = (opt: { addNewText: string }) => { + const md = fm.deps.md as MDLocal; + if (md) { + toast.success( +
{ + toast.dismiss(); + }} + > +
+ + Record Saved +
+
+ + + +
+
, + { + duration: 60 * 1000, + className: css` + background: #e4ffed; + border: 2px solid green; + + .success-title { + margin-bottom: 20px; + } + `, + } + ); + } else { + toast.success( +
{}} + > +
+ + Saved +
+
, + { + duration: 60 * 1000, + className: css` + background: #e4ffed; + border: 2px solid green; + `, + } + ); + } + }; + fm.reload = async () => { fm.status = isEditor ? "ready" : "loading"; fm.render(); @@ -82,18 +185,7 @@ export const formInit = (fm: FMLocal, props: FMProps) => { if (fm.is_newly_created) { fm.is_newly_created = false; - toast.success( -
- - Saved -
, - { - className: css` - background: #e4ffed; - border: 2px solid green; - `, - } - ); + toastSuccess({ addNewText: "Add Another" }); } fm.status = "ready"; @@ -176,18 +268,7 @@ export const formInit = (fm: FMLocal, props: FMProps) => { } ); } else { - toast.success( -
- - Saved -
, - { - className: css` - background: #e4ffed; - border: 2px solid green; - `, - } - ); + toastSuccess({ addNewText: "Add New" }); } } return success; diff --git a/comps/ui/toast.tsx b/comps/ui/toast.tsx index aa388fd..8ee32a6 100755 --- a/comps/ui/toast.tsx +++ b/comps/ui/toast.tsx @@ -26,7 +26,7 @@ export const toast = { }, success: ( el: ReactElement, - props?: { dismissible?: boolean; className?: string } + props?: { dismissible?: boolean; className?: string; duration?: number } ) => { clearTimeout(timer.timeout); timer.timeout = setTimeout(() => { diff --git a/utils/pathname.ts b/utils/pathname.ts index ba2f060..1d92ac3 100755 --- a/utils/pathname.ts +++ b/utils/pathname.ts @@ -10,7 +10,7 @@ export const getPathname = (opt?: { hash?: boolean }) => { ) { const hash = location.hash; - if (hash !== "" && opt?.hash !== false) { + if (hash !== "" && opt?.hash === true) { return "/" + location.pathname.split("/").slice(3).join("/") + hash; } else { return "/" + location.pathname.split("/").slice(3).join("/");