@djb25/digit-ui-module-ekyc 1.0.0 → 1.0.2

package/src/components/Search.js

@@ -1,77 +0,0 @@
-import React, { useEffect, useRef } from "react";
-import { useForm, Controller } from "react-hook-form";
-import { TextInput, Label, LinkLabel, Dropdown } from "@djb25/digit-ui-react-components";
-import { useTranslation } from "react-i18next";
-
-const SearchApplication = ({ onSearch, searchFields, searchParams }) => {
-    const { t } = useTranslation();
-    const { register, handleSubmit, reset, watch, control } = useForm({
-        defaultValues: searchParams,
-    });
-
-    const onSubmitInput = (data) => {
-        onSearch(data);
-    };
-
-    function clearSearch() {
-        const resetValues = searchFields.reduce((acc, field) => ({ ...acc, [field?.name]: "" }), {});
-        reset(resetValues);
-        onSearch({ ...resetValues });
-    }
-
-    // Watch all fields
-    const watchedFields = watch();
-    const prevFields = useRef(watchedFields);
-
-    // Trigger search only when fields actually change and compare values to avoid loops
-    useEffect(() => {
-        const isChanged = JSON.stringify(prevFields.current) !== JSON.stringify(watchedFields);
-        if (isChanged) {
-            prevFields.current = watchedFields;
-            // Debounce or delay if needed, but for dropdowns immediate is fine
-            const timeoutId = setTimeout(() => {
-                onSearch(watchedFields);
-            }, 300); // Small debounce to be safe
-            return () => clearTimeout(timeoutId);
-        }
-    }, [watchedFields, onSearch]);
-
-    return (
-        <form onSubmit={handleSubmit(onSubmitInput)} style={{ flex: 1 }}>
-            <div className="search-container" style={{ backgroundColor: "#ffffffff", padding: "24px" }}>
-                <div className="complaint-input-container" style={{ display: "grid", gridTemplateColumns: "repeat(auto-fill, minmax(700px, 1fr))", gap: "20px", alignItems: "end" }}>
-                    {searchFields?.map((input) => (
-                        <div key={input.name} className="input-fields">
-                            <Label>{input.label}</Label>
-                            {input.type === "dropdown" ? (
-                                <Controller
-                                    control={control}
-                                    name={input.name}
-                                    render={(props) => (
-                                        <Dropdown
-                                            selected={props.value}
-                                            select={(val) => {
-                                                props.onChange(val);
-                                            }}
-                                            onBlur={props.onBlur}
-                                            option={input.options}
-                                            optionKey={input.optionsKey}
-                                            t={t}
-                                        />
-                                    )}
-                                />
-                            ) : (
-                                <TextInput {...input} inputRef={register} watch={watch} />
-                            )}
-                        </div>
-                    ))}
-                    {/* <div className="search-submit-wrapper" style={{ display: "flex", alignItems: "center", gap: "20px", height: "40px" }}>
-                        <LinkLabel onClick={clearSearch}>{t("ES_COMMON_CLEAR_ALL")}</LinkLabel>
-                    </div> */}
-                </div>
-            </div>
-        </form>
-    );
-};
-
-export default SearchApplication;