change design dashboards all page and search clinics

2025-05-27 22:27:02 +03:30
parent d95815d4aa
commit 38e243b4c7
17 changed files with 155 additions and 98 deletions
@@ -0,0 +1,54 @@
+import { Autocomplete, TextField } from "@mui/material";
+
+function AutoCompleteSearch({
+  data,
+  inputValue,
+  placeholder,
+  handleSearch,
+  setInputValue,
+  setSelectedOption,
+}) {
+  return (
+    <Autocomplete
+      freeSolo
+      options={data}
+      getOptionLabel={(option) => option.name}
+      inputValue={inputValue}
+      className="!w-full"
+      onInputChange={(event, newInputValue) => {
+        setInputValue && setInputValue(newInputValue);
+        handleSearch(newInputValue);
+      }}
+      onChange={(event, newValue) => {
+        setSelectedOption(newValue);
+        handleSearch(newValue ? newValue.name : "");
+      }}
+      renderInput={(params) => (
+        <TextField
+          {...params}
+          variant="standard"
+          placeholder={placeholder}
+          dir="rtl"
+          InputProps={{
+            ...params.InputProps,
+            disableUnderline: true,
+            style: { height: "100%" },
+          }}
+          sx={{
+            background: "transparent !important",
+            "& .MuiInputBase-input": {
+              background: "#FAFAFA",
+              color: "#6C757D",
+              padding: "0 16px",
+              fontSize: "14px",
+              fontFamily: "inherit",
+            },
+          }}
+          className="!shadow-none !w-full !px-5 !h-full !text-[14px] md:!text-[16px] !min-w-[50%] !rounded-0 !font-normal"
+        />
+      )}
+    />
+  );
+}
+
+export default AutoCompleteSearch;