src/components/Expenses/ManageExpense.jsx

@@ -32,6 +32,8 @@ import Label from "../common/Label";
 import EmployeeSearchInput from "../common/EmployeeSearchInput";
 import Filelist from "./Filelist";
 import { DEFAULT_CURRENCY } from "../../utils/constants";
+import SelectEmployeeServerSide, { SelectProjectField } from "../common/Forms/SelectFieldServerSide";
+import { useAllocationServiceProjectTeam } from "../../hooks/useServiceProject";
 
 const ManageExpense = ({ closeModal, expenseToEdit = null }) => {
   const {
@@ -40,6 +42,7 @@ const ManageExpense = ({ closeModal, expenseToEdit = null }) => {
     error: ExpenseErrorLoad,
   } = useExpense(expenseToEdit);
   const [expenseCategory, setExpenseCategory] = useState();
+  const [selectedEmployees, setSelectedEmployees] = useState([]);
   const dispatch = useDispatch();
   const {
     expenseCategories,
@@ -83,11 +86,11 @@ const ManageExpense = ({ closeModal, expenseToEdit = null }) => {
     loading: StatusLoadding,
     error: stausError,
   } = useExpenseStatus();
-  const {
+  // const {
-    data: employees,
+  //   data: employees,
-    isLoading: EmpLoading,
+  //   isLoading: EmpLoading,
-    isError: isEmployeeError,
+  //   isError: isEmployeeError,
-  } = useEmployeesNameByProject(selectedproject);
+  // } = useEmployeesNameByProject(selectedproject);
 
   const files = watch("billAttachments");
   const onFileChange = async (e) => {
@@ -150,6 +153,15 @@ const ManageExpense = ({ closeModal, expenseToEdit = null }) => {
     }
   };
 
+  const { mutate: AllocationTeam, isPending1 } = useAllocationServiceProjectTeam(
+    () => {
+      setSelectedEmployees([]);
+      setSeletingEmp({
+        employee: null,
+        isOpen: false,
+      });
+    }
+  );
   useEffect(() => {
     if (expenseToEdit && data) {
       reset({
@@ -180,7 +192,7 @@ const ManageExpense = ({ closeModal, expenseToEdit = null }) => {
           : [],
       });     
     }
-  }, [data, reset, employees]);
+  }, [data, reset]);
   const { mutate: ExpenseUpdate, isPending } = useUpdateExpense(() =>
     handleClose()
   );
@@ -223,7 +235,7 @@ const ManageExpense = ({ closeModal, expenseToEdit = null }) => {
       </h5>
       <form id="expenseForm" onSubmit={handleSubmit(onSubmit)}>
         <div className="row my-2 text-start">
-          <div className="col-md-6">
+          {/* <div className="col-md-6">
             <Label className="form-label" required>
               Select Project
             </Label>
@@ -245,6 +257,24 @@ const ManageExpense = ({ closeModal, expenseToEdit = null }) => {
             {errors.projectId && (
               <small className="danger-text">{errors.projectId.message}</small>
             )}
+          </div> */}
+          <div className="col-12 col-md-6 mb-2">
+            <SelectProjectField
+              label="Project"
+              required
+              placeholder="Select Project"
+              value={watch("projectId")}
+
+              onChange={(val) =>
+                setValue("projectId", val, {
+                  shouldDirty: true,
+                  shouldValidate: true,
+                })
+              }
+            />
+            {errors.projectId && (
+              <small className="danger-text">{errors.projectId.message}</small>
+            )}
           </div>
 
           <div className="col-md-6">
@@ -314,7 +344,7 @@ const ManageExpense = ({ closeModal, expenseToEdit = null }) => {
               control={control}
               name="paidById"
               projectId={null}
-              forAll={expenseToEdit ? true : false}
+              forAll={true}
             />
           </div>         
         </div>

src/components/common/EmployeeSearchInput.jsx

@@ -7,6 +7,7 @@ import Avatar from "./Avatar";
 const EmployeeSearchInput = ({
   control,
   name,
+  size = "sm",
   projectId,
   placeholder,
   forAll,
@@ -46,7 +47,7 @@ const EmployeeSearchInput = ({
       <input
         type="text"
         ref={ref}
-        className={`form-control form-control-sm`}
+        className={`form-control form-control-sm-${size}`}
         placeholder={placeholder}
         value={search}
         onChange={(e) => {