diff --git a/comps/filter/FilterContent.tsx b/comps/filter/FilterContent.tsx
index 663e48d..a71019b 100755
--- a/comps/filter/FilterContent.tsx
+++ b/comps/filter/FilterContent.tsx
@@ -13,7 +13,7 @@ export const FilterContent: FC<{
   child: any;
   _item: PrasiItem;
 }> = ({ mode, filter, PassProp, child, _item, onSubmit }) => {
-  const internal = useLocal({});
+  filter.PassProp = PassProp;
   return (
     <div
       className={cx(
@@ -94,7 +94,6 @@ export const FilterContent: FC<{
             left: 50%;
             transform: translate(-50%, -50%);
             z-index: 1000;
-            /* Styles specific to popup */
           }
 
           .form-inner {
@@ -104,61 +103,100 @@ export const FilterContent: FC<{
       )}
     >
       <BaseForm
+        tag="blank"
         data={filter.data}
-        onSubmit={async (form) => {
-          const fm = form.fm;
+        name={filter.name}
+        onSubmit={async ({ fm }) => {
           try {
-            if (typeof form.fm?.data === "object") {
-              form.render();
-              form.fm.render();
+            if (typeof fm.data === "object") {
+              fm.render();
+            }
+
+            if (mode === "raw" && fm) {
+              const submit = async (fm: FMLocal) => {
+                fm.render();
+                if (typeof onSubmit === "function") {
+                  const data = await onSubmit(fm);
+                  if (typeof fm.data === "object") {
+                    fm.data = {
+                      __status: "submit",
+                      ...fm.data,
+                      _where: data,
+                    };
+                    fm.render();
+                    filter.data = {
+                      __status: "submit",
+                      ...fm.data,
+                      _where: data,
+                    };
+                    filter.render();
+                  }
+                }
+              };
+              await submit(fm);
+            }
+            const f = getFilter(filter.name);
+            if (f) {
+              for (const list of Object.values(f.list.ref)) {
+                list.reload();
+              }
             }
           } catch (ex) {}
-
-          if (mode === "raw" && fm) {
-            if (form && form.fm) {
-              Object.keys(form.fm.data).map((e) => {
-                if (!form?.fm.data?.[e]) {
-                  delete form.fm?.data[e];
-                }
-              });
-            }
-            const submit = async (fm: FMLocal) => {
-              fm.render();
-              if (typeof onSubmit === "function") {
-                const data = await onSubmit(fm);
-                if (typeof form.fm?.data === "object") {
-                  form.fm.data = {
-                    __status: "submit",
-                    ...form.fm.data,
-                    _where: data,
-                  };
-                  form.fm.render();
-                  filter.data = {
-                    __status: "submit",
-                    ...form.fm.data,
-                    _where: data,
-                  };
-                  filter.render();
-                }
-              }
-            };
-            await submit(fm);
-          }
-          const f = getFilter(filter.name);
-          if (f) {
-            for (const list of Object.values(f.list.ref)) {
-              list.reload();
-            }
-          }
+          return true;
         }}
-        render={internal.render}
+        // onSubmit={async (form) => {
+        //   const fm = form.fm;
+        //   try {
+        //     if (typeof form.fm?.data === "object") {
+        //       form.render();
+        //       form.fm.render();
+        //     }
+        //   } catch (ex) {}
+
+        //   if (mode === "raw" && fm) {
+        //     if (form && form.fm) {
+        //       Object.keys(form.fm.data).map((e) => {
+        //         if (!form?.fm.data?.[e]) {
+        //           delete form.fm?.data[e];
+        //         }
+        //       });
+        //     }
+        //     const submit = async (fm: FMLocal) => {
+        //       fm.render();
+        //       if (typeof onSubmit === "function") {
+        //         const data = await onSubmit(fm);
+        //         if (typeof form.fm?.data === "object") {
+        //           form.fm.data = {
+        //             __status: "submit",
+        //             ...form.fm.data,
+        //             _where: data,
+        //           };
+        //           form.fm.render();
+        //           filter.data = {
+        //             __status: "submit",
+        //             ...form.fm.data,
+        //             _where: data,
+        //           };
+        //           filter.render();
+        //         }
+        //       }
+        //     };
+        //     await submit(fm);
+        //   }
+        //   const f = getFilter(filter.name);
+        //   if (f) {
+        //     for (const list of Object.values(f.list.ref)) {
+        //       list.reload();
+        //     }
+        //   }
+        // }}
       >
-        {(form) => {
-          filter.form = form;
+        {({ fm }) => {
+          filter.fm = fm;
           return (
             <>
               {!!(PassProp && child) && (
-                <PassProp filter={filter} fm={form.fm}>
+                <PassProp filter={filter} fm={filter.fm}>
                   {child}
                 </PassProp>
               )}
diff --git a/comps/filter/FilterField.tsx b/comps/filter/FilterField.tsx
index 8cc623b..9202255 100755
--- a/comps/filter/FilterField.tsx
+++ b/comps/filter/FilterField.tsx
@@ -20,8 +20,9 @@ export const FilterField: FC<{
     search_timeout: null as any,
   });
   if (!name) return <>No Name</>;
-  if (!filter.form) return <div>Loading...</div>;
+  if (!filter.fm) return <div>Loading...</div>;
 
+  const fm = filter.fm;
   filter.types[name] = type;
 
   const singleOptions = ["equal", "not_equal"];
@@ -32,167 +33,183 @@ export const FilterField: FC<{
     internal.render_timeout = setTimeout(() => {
       filter_window.prasiContext.render();
     }, 500);
-  }, [filter.form]);
+  }, [fm]);
 
   let show_modifier = filter.mode !== "inline";
-  return null;
-  // return (
-  //   <BaseField
-  //     {...filter.form.fieldProps({
-  //       name: name || "",
-  //       label: label || name || "",
-  //       render: internal.render,
-  //       prefix: show_modifier
-  //         ? () => (
-  //             <FieldModifier
-  //               onChange={(modifier) => {
-  //                 filter.modifiers[name] = modifier;
-  //                 filter.render();
-  //                 filter_window.prasiContext.render();
-  //               }}
-  //               modifier={filter.modifiers[name]}
-  //               type={type}
-  //             />
-  //           )
-  //         : undefined,
-  //       onLoad() {
-  //         return [{ label: "halo", value: "asda" }];
-  //       },
-  //       subType: singleOptions.includes(filter.modifiers[name])
-  //         ? "dropdown"
-  //         : "typeahead",
-  //     })}
-  //   >
-  //     {(field) => {
-  //       if (type === "search-all") {
-  //         return (
-  //           <div className={cx("search-all c-flex items-center")}>
-  //             <div className="c-pl-2">
-  //               <svg
-  //                 xmlns="http://www.w3.org/2000/svg"
-  //                 width="14"
-  //                 height="14"
-  //                 viewBox="0 0 24 24"
-  //                 fill="none"
-  //                 stroke="currentColor"
-  //                 strokeWidth="2"
-  //                 strokeLinecap="round"
-  //                 strokeLinejoin="round"
-  //               >
-  //                 <circle cx="11" cy="11" r="8" />
-  //                 <path d="m21 21-4.3-4.3" />
-  //               </svg>
-  //             </div>
-  //             <input
-  //               type="search"
-  //               value={field.fm?.data?.[name]}
-  //               placeholder={field.field.label}
-  //               onBlur={() => {
-  //                 // clearTimeout(internal.search_timeout);
-  //                 // filter.form?.submit();
-  //               }}
-  //               spellCheck={false}
-  //               className="c-flex-1 c-transition-all c-bg-transparent c-outline-none c-px-2 c-text-sm c-w-full"
-  //               onChange={(e) => {
-  //                 field.fm.data[name] = e.currentTarget.value;
-  //                 field.fm.render();
-  //                 clearTimeout(internal.search_timeout);
-  //                 internal.search_timeout = setTimeout(() => {
-  //                   filter.form?.submit();
-  //                 }, 1500);
-  //               }}
-  //             />
-  //           </div>
-  //         );
-  //       }
+  const arg = {
+    name: name || "",
+    fm,
+    label: label || name || "",
+    render: internal.render,
+    prefix: show_modifier
+      ? () => (
+          <FieldModifier
+            onChange={(modifier) => {
+              filter.modifiers[name] = modifier;
+              filter.render();
+              filter_window.prasiContext.render();
+            }}
+            modifier={filter.modifiers[name]}
+            type={type}
+          />
+        )
+      : undefined,
+    onLoad() {
+      return [{ label: "halo", value: "asda" }];
+    },
+    subType: singleOptions.includes(filter.modifiers[name])
+      ? "dropdown"
+      : "typeahead",
+  };
 
-  //       return (
-  //         <>
-  //           {type === "text" && (
-  //             <FieldTypeInput
-  //               {...field}
-  //               prop={{
-  //                 type: "input",
-  //                 sub_type: "text",
-  //               }}
-  //             />
-  //           )}
-  //           {type === "number" && (
-  //             <>
-  //               <FieldTypeInput
-  //                 {...field}
-  //                 field={{
-  //                   ...field.field,
-  //                   name:
-  //                     filter.modifiers[name] === "between"
-  //                       ? name
-  //                       : `${name}_from`,
-  //                 }}
-  //                 prop={{
-  //                   type: "input",
-  //                   sub_type: "number",
-  //                 }}
-  //               />
-  //               {filter.modifiers[name] === "between" && (
-  //                 <FieldTypeInput
-  //                   {...field}
-  //                   field={{ ...field.field, name: `${name}_to` }}
-  //                   prop={{
-  //                     type: "input",
-  //                     sub_type: "number",
-  //                   }}
-  //                 />
-  //               )}
-  //             </>
-  //           )}
-  //           {type === "date" && (
-  //             <>
-  //               <FieldTypeInput
-  //                 {...field}
-  //                 field={{
-  //                   ...field.field,
-  //                   name:
-  //                     filter.modifiers[name] === "between"
-  //                       ? name
-  //                       : `${name}_from`,
-  //                 }}
-  //                 prop={{
-  //                   type: "input",
-  //                   sub_type: "date",
-  //                 }}
-  //               />
-  //               {filter.modifiers[name] === "between" && (
-  //                 <FieldTypeInput
-  //                   {...field}
-  //                   field={{ ...field.field, name: `${name}_to` }}
-  //                   prop={{
-  //                     type: "input",
-  //                     sub_type: "date",
-  //                   }}
-  //                 />
-  //               )}
-  //             </>
-  //           )}
-  //           {type === "boolean" && (
-  //             <FieldCheckbox
-  //               arg={field.arg}
-  //               field={field.field}
-  //               fm={field.fm}
-  //             />
-  //           )}
-  //           {type === "options" && (
-  //             <>
-  //               {singleOptions.includes(filter.modifiers[name]) && (
-  //                 <SingleOption {...field} />
-  //               )}
-  //               {multiOptions.includes(filter.modifiers[name]) && (
-  //                 <MultiOption {...field} />
-  //               )}
-  //             </>
-  //           )}
-  //         </>
-  //       );
-  //     }}
-  //   </BaseField>
-  // );
+  return (
+    <BaseField
+      fm={fm}
+      label={label || name}
+      name={name || ""}
+      PassProp={filter.PassProp}
+    >
+      {(field) => {
+        if (type === "search-all") {
+          return (
+            <div className={cx("search-all c-flex items-center")}>
+              <div className="c-pl-2">
+                <svg
+                  xmlns="http://www.w3.org/2000/svg"
+                  width="14"
+                  height="14"
+                  viewBox="0 0 24 24"
+                  fill="none"
+                  stroke="currentColor"
+                  strokeWidth="2"
+                  strokeLinecap="round"
+                  strokeLinejoin="round"
+                >
+                  <circle cx="11" cy="11" r="8" />
+                  <path d="m21 21-4.3-4.3" />
+                </svg>
+              </div>
+              <input
+                type="search"
+                value={field.fm?.data?.[name]}
+                placeholder={field.field.label}
+                onBlur={() => {
+                  // clearTimeout(internal.search_timeout);
+                  // filter.form?.submit();
+                }}
+                spellCheck={false}
+                className="c-flex-1 c-transition-all c-bg-transparent c-outline-none c-px-2 c-text-sm c-w-full"
+                onChange={(e) => {
+                  field.fm.data[name] = e.currentTarget.value;
+                  field.fm.render();
+                  clearTimeout(internal.search_timeout);
+                  if (!field.fm.data[name]) {
+                    fm.submit();
+                  } else {
+                    internal.search_timeout = setTimeout(() => {
+                      fm?.submit();
+                    }, 1500);
+                  }
+                }}
+                onKeyDown={(e) => {
+                  if (e.key === "Enter") {
+                    clearTimeout(internal.search_timeout);
+                    fm?.submit();
+                  }
+                }}
+              />
+            </div>
+          );
+        }
+
+        return (
+          <>
+            {type === "text" && (
+              <FieldTypeInput
+                {...field}
+                arg={arg}
+                prop={{
+                  type: "input",
+                  sub_type: "text",
+                }}
+              />
+            )}
+            {type === "number" && (
+              <>
+                <FieldTypeInput
+                  arg={arg}
+                  {...field}
+                  field={{
+                    ...field.field,
+                    name:
+                      filter.modifiers[name] === "between"
+                        ? name
+                        : `${name}_from`,
+                  }}
+                  prop={{
+                    type: "input",
+                    sub_type: "number",
+                  }}
+                />
+                {filter.modifiers[name] === "between" && (
+                  <FieldTypeInput
+                    arg={arg}
+                    {...field}
+                    field={{ ...field.field, name: `${name}_to` }}
+                    prop={{
+                      type: "input",
+                      sub_type: "number",
+                    }}
+                  />
+                )}
+              </>
+            )}
+            {type === "date" && (
+              <>
+                <FieldTypeInput
+                  arg={arg}
+                  {...field}
+                  field={{
+                    ...field.field,
+                    name:
+                      filter.modifiers[name] === "between"
+                        ? name
+                        : `${name}_from`,
+                  }}
+                  prop={{
+                    type: "input",
+                    sub_type: "date",
+                  }}
+                />
+                {filter.modifiers[name] === "between" && (
+                  <FieldTypeInput
+                    arg={arg}
+                    {...field}
+                    field={{ ...field.field, name: `${name}_to` }}
+                    prop={{
+                      type: "input",
+                      sub_type: "date",
+                    }}
+                  />
+                )}
+              </>
+            )}
+            {type === "boolean" && (
+              <FieldCheckbox arg={arg} field={field.field} fm={field.fm} />
+            )}
+            {type === "options" && (
+              <>
+                {singleOptions.includes(filter.modifiers[name]) && (
+                  <SingleOption arg={arg} {...field} />
+                )}
+                {multiOptions.includes(filter.modifiers[name]) && (
+                  <MultiOption arg={arg} {...field} />
+                )}
+              </>
+            )}
+          </>
+        );
+      }}
+    </BaseField>
+  );
 };
diff --git a/comps/filter/MasterFilter.tsx b/comps/filter/MasterFilter.tsx
index 085ef94..0f96678 100755
--- a/comps/filter/MasterFilter.tsx
+++ b/comps/filter/MasterFilter.tsx
@@ -73,7 +73,6 @@ export const MasterFilter: FC<FilterProps> = ({
                   }
                   filter.raw_status = "ready";
                   filter.render();
-                  
                 });
               } else {
                 filter.raw_status = "ready";
@@ -95,6 +94,7 @@ export const MasterFilter: FC<FilterProps> = ({
   if (mode === "raw" && filter.raw_status !== "ready") {
     return <FieldLoading />;
   }
+
   return (
     <>
       <FilterContent
diff --git a/comps/filter/utils/types.tsx b/comps/filter/utils/types.tsx
index 72887ab..762e97d 100755
--- a/comps/filter/utils/types.tsx
+++ b/comps/filter/utils/types.tsx
@@ -1,5 +1,4 @@
-import { BaseFormLocal } from "../../form/base/types";
-import { GenField } from "../../form/typings";
+import { FMLocal, GenField } from "../../form/typings";
 
 export type FilterFieldType =
   | "search-all"
@@ -14,7 +13,8 @@ export const default_filter_local = {
   columns: [] as string[],
   fields: [] as GenField[],
   tableName: "",
-  form: null as null | BaseFormLocal<any>,
+  fm: null as null | FMLocal,
+  PassProp: null as null | any,
   modifiers: {} as Record<string, string>,
   types: {} as Record<string, FilterFieldType>,
   name: "",