added organization api and successfuly created invoice

public/assets/css/core-extend.css

@@ -11,6 +11,18 @@
   top: var(--sticky-top, 0px) !important;
   z-index: 1025;
 }
+.form-control-md {
+  min-height: calc(1.6em + 0.65rem + calc(var(--bs-border-width) * 2));
+  padding: 0.18rem 0.60rem;
+  font-size: 0.875rem;  /* ~14px */
+  border-radius: var(--bs-border-radius);
+}
+
+.form-control-md::file-selector-button {
+  padding: 0.32rem 0.75rem;
+  margin: -0.32rem -0.75rem;
+  margin-inline-end: 0.75rem;
+}
 
 
 /* ===========================% Background_Colors %========================================================== */

src/components/common/Forms/SelectFieldServerSide.jsx

@@ -200,7 +200,9 @@ export const SelectProjectField = ({
   isFullObject = false,
   isMultiple = false,
   isAllProject = false,
-  disabled
+  disabled,
+  className,
+  errors,
 }) => {
   const [searchText, setSearchText] = useState("");
   const debounce = useDebounce(searchText, 300);
@@ -303,7 +305,10 @@ export const SelectProjectField = ({
         </span>
       </button>
 
-      {/* DROPDOWN */}
+      {errors?.projectId && (
+        <div className="danger-text">{errors.projectId.message}</div>
+      )}
+      
       {open && (
         <ul
           className="dropdown-menu w-100 shadow-sm show animate__fadeIn h-64 overflow-auto rounded"
@@ -326,6 +331,7 @@ export const SelectProjectField = ({
               placeholder="Search..."
             />
           </div>
+            <div className="overflow-auto px-1" style={{ maxHeight: "200px" }}>
 
           {isLoading && (
             <li className="dropdown-item text-muted text-center">Loading...</li>
@@ -358,6 +364,7 @@ export const SelectProjectField = ({
                 </li>
               );
             })}
+            </div>
         </ul>
       )}
     </div>
@@ -366,7 +373,7 @@ export const SelectProjectField = ({
 
 export const SelectFieldSearch = ({
   label = "Select",
-  placeholder = "Select ",
+  placeholder = "Select",
   required = false,
   value = null,
   onChange,
@@ -377,6 +384,7 @@ export const SelectFieldSearch = ({
   isMultiple = false,
   hookParams,
   useFetchHook,
+  errors = null,
 }) => {
   const [searchText, setSearchText] = useState("");
   const debounce = useDebounce(searchText, 300);
@@ -386,108 +394,75 @@ export const SelectFieldSearch = ({
   const [open, setOpen] = useState(false);
   const dropdownRef = useRef(null);
 
-  const getDisplayName = (entity) => {
-    if (!entity) return "";
-    return `${entity[labelKey] || ""}`.trim();
-  };
+  const getDisplayName = (entity) =>
+    entity ? `${entity[labelKey] || ""}`.trim() : "";
 
-  /** -----------------------------
-   * SELECTED OPTION (SINGLE)
-   * ----------------------------- */
+  /** ----------------------------- SELECTED OPTION ----------------------------- */
   let selectedSingle = null;
-
   if (!isMultiple) {
     if (isFullObject && value) selectedSingle = value;
     else if (!isFullObject && value)
       selectedSingle = options.find((o) => o[valueKey] === value);
   }
 
-  /** -----------------------------
-   * SELECTED OPTION (MULTIPLE)
-   * ----------------------------- */
   let selectedList = [];
   if (isMultiple && Array.isArray(value)) {
-    if (isFullObject) selectedList = value;
-    else {
-      selectedList = options.filter((opt) => value.includes(opt[valueKey]));
-    }
+    selectedList = isFullObject
+      ? value
+      : options.filter((opt) => value.includes(opt[valueKey]));
   }
 
-  /** Main button label */
   const displayText = !isMultiple
     ? getDisplayName(selectedSingle) || placeholder
-    : selectedList.length > 0
+    : selectedList.length
     ? selectedList.map((e) => getDisplayName(e)).join(", ")
     : placeholder;
 
-  /** -----------------------------
-   * HANDLE OUTSIDE CLICK
-   * ----------------------------- */
+  /** ----------------------------- OUTSIDE CLICK ----------------------------- */
   useEffect(() => {
     const handleClickOutside = (e) => {
-      if (dropdownRef.current && !dropdownRef.current.contains(e.target)) {
+      if (dropdownRef.current && !dropdownRef.current.contains(e.target))
         setOpen(false);
-      }
     };
-
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
 
-  // MERGED OPTIONS TO ENSURE SELECTED VALUE APPEARS EVEN IF NOT IN SEARCH RESULT
-  const [mergedOptions, setMergedOptions] = useState([]);
+  /** ----------------------------- MERGED OPTIONS ----------------------------- */
+  const [mergedOptions, setMergedOptions] = useState(options);
 
   useEffect(() => {
     let finalList = [...options];
 
-    if (!isMultiple && value && !isFullObject) {
-      // already selected option inside options?
-      const exists = options.some((o) => o[valueKey] === value);
-
-      // if selected item not found, try to get from props (value) as fallback
-      if (!exists && typeof value === "object") {
-        finalList.unshift(value);
-      }
+    if (!isMultiple && value && !isFullObject && typeof value === "object") {
+      const exists = options.some((o) => o[valueKey] === value[valueKey]);
+      if (!exists) finalList.unshift(value);
     }
 
     if (isMultiple && Array.isArray(value)) {
       value.forEach((val) => {
         const id = isFullObject ? val[valueKey] : val;
         const exists = options.some((o) => o[valueKey] === id);
-
-        if (!exists && typeof val === "object") {
-          finalList.unshift(val);
-        }
+        if (!exists && typeof val === "object") finalList.unshift(val);
       });
     }
 
-    setMergedOptions(finalList);
-  }, [options, value]);
+    // Only update if different to avoid infinite loop
+    const oldKeys = mergedOptions.map((o) => o[valueKey]).join(",");
+    const newKeys = finalList.map((o) => o[valueKey]).join(",");
+    if (oldKeys !== newKeys) setMergedOptions(finalList);
+  }, [options, value, isMultiple, isFullObject, valueKey, mergedOptions]);
 
-  /** -----------------------------
-   * HANDLE SELECT
-   * ----------------------------- */
+  /** ----------------------------- HANDLE SELECT ----------------------------- */
   const handleSelect = (option) => {
     if (!isMultiple) {
-      // SINGLE SELECT
-      if (isFullObject) onChange(option);
-      else onChange(option[valueKey]);
+      onChange(isFullObject ? option : option[valueKey]);
     } else {
-      // MULTIPLE SELECT
-      let updated = [];
-
       const exists = selectedList.some((e) => e[valueKey] === option[valueKey]);
-
-      if (exists) {
-        // remove
-        updated = selectedList.filter((e) => e[valueKey] !== option[valueKey]);
-      } else {
-        // add
-        updated = [...selectedList, option];
-      }
-
-      if (isFullObject) onChange(updated);
-      else onChange(updated.map((x) => x[valueKey]));
+      const updated = exists
+        ? selectedList.filter((e) => e[valueKey] !== option[valueKey])
+        : [...selectedList, option];
+      onChange(isFullObject ? updated : updated.map((x) => x[valueKey]));
     }
   };
 
@@ -499,10 +474,9 @@ export const SelectFieldSearch = ({
         </Label>
       )}
 
-      {/* MAIN BUTTON */}
       <button
         type="button"
-        className={`select2-icons form-select d-flex align-items-center justify-content-between  ${
+        className={`select2-icons form-select d-flex align-items-center justify-content-between ${
           open ? "show" : ""
         }`}
         disabled={disabled}
@@ -513,17 +487,17 @@ export const SelectFieldSearch = ({
         </span>
       </button>
 
-      {/* DROPDOWN */}
+      {errors && <div className="danger-text">{errors.message}</div>}
+
       {open && (
         <ul
-          className="dropdown-menu w-100 shadow-sm show animate__fadeIn h-64 overflow-auto rounded overflow-x-hidden"
+          className="dropdown-menu w-100 shadow-sm show animate__fadeIn h-64 overflow-auto rounded rounded-top-0 overflow-x-hidden"
           style={{
             position: "absolute",
             top: "100%",
             left: 0,
             zIndex: 1050,
-            marginTop: "2px",
-            borderRadius: "0.375rem",
+            marginTop: "1px",
             overflow: "hidden",
           }}
         >
@@ -537,36 +511,40 @@ export const SelectFieldSearch = ({
               disabled={disabled}
             />
           </div>
+          <div className="overflow-auto px-1" style={{ maxHeight: "200px" }}>
+            {isLoading && (
+              <li className="dropdown-item text-muted text-center">
+                Loading...
+              </li>
+            )}
+            {!isLoading && mergedOptions.length === 0 && (
+              <li className="dropdown-item text-muted text-center">
+                No results found
+              </li>
+            )}
 
-          {isLoading && (
-            <li className="dropdown-item text-muted text-center">Loading...</li>
-          )}
+            {!isLoading &&
+              mergedOptions.map((option) => {
+                const isActive = isMultiple
+                  ? selectedList.some((x) => x[valueKey] === option[valueKey])
+                  : selectedSingle &&
+                    selectedSingle[valueKey] === option[valueKey];
 
-          {!isLoading && options.length === 0 && (
-            <li className="dropdown-item text-muted text-center">
-              No results found
-            </li>
-          )}
-
-          {!isLoading &&
-            options.map((option) => {
-              const isActive = isMultiple
-                ? selectedList.some((x) => x[valueKey] === option[valueKey])
-                : selectedSingle &&
-                  selectedSingle[valueKey] === option[valueKey];
-
-              return (
-                <li key={option[valueKey]}>
-                  <button
-                    type="button"
-                    className={`dropdown-item ${isActive ? "active" : ""}`}
-                    onClick={() => handleSelect(option)}
-                  >
-                    {getDisplayName(option)}
-                  </button>
-                </li>
-              );
-            })}
+                return (
+                  <li key={option[valueKey]}>
+                    <button
+                      type="button"
+                      className={`dropdown-item rounded ${
+                        isActive ? "active" : ""
+                      }`}
+                      onClick={() => handleSelect(option)}
+                    >
+                      {getDisplayName(option)}
+                    </button>
+                  </li>
+                );
+              })}
+          </div>
         </ul>
       )}
     </div>

src/components/common/InputSuggestion.jsx

@@ -50,7 +50,6 @@ const InputSuggestions = ({
           {filteredList.map((org) => (
             <li
               key={org}
-              className="ropdown-item"
               style={{
                 cursor: "pointer",
                 padding: "5px 12px",

src/components/purchase/ManagePurchase.jsx

@@ -6,47 +6,49 @@ import {
   PurchaseSchema,
   getStepFields,
 } from "./PurchaseSchema";
-import { defaultJobValue } from "../ServiceProject/ServiceProjectSchema";
 import PurchasePartyDetails from "./PurchasePartyDetails";
+import PurchaseTransportDetails from "./PurchaseTransportDetails";
+import PurchasePaymentDetails from "./PurchasePaymentDetails";
+import { useCreatePurchaseInvoice } from "../../hooks/usePurchase";
 
-const ManagePurchase = () => {
+const ManagePurchase = ({ onClose }) => {
   const [activeTab, setActiveTab] = useState(0);
   const [completedTabs, setCompletedTabs] = useState([]);
 
-  const newTenantConfig = [
+  const stepsConfig = [
     {
-      name: "Contact Info",
+      name: "Party Details",
       icon: "bx bx-user bx-md",
-      subtitle: "Provide Contact Details",
+      subtitle: "Supplier & project information",
       component: <PurchasePartyDetails />,
     },
     {
-      name: "Organization",
-      icon: "bx bx-buildings bx-md",
-      subtitle: "Organization Details",
-      component: <div>Invoice & Transport Details</div>,
+      name: "Invoice & Transport",
+      icon: "bx bx-receipt bx-md",
+      subtitle: "Invoice, eWay bill & transport info",
+      component: <PurchaseTransportDetails />,
     },
     {
-      name: "SubScription",
-      icon: "bx bx-star bx-md",
-      component: <div>Payment & Financials</div>,
+      name: "Payment Details",
+      icon: "bx bx-credit-card bx-md",
+      subtitle: "Amount, tax & due date",
+      component: <PurchasePaymentDetails />,
     },
   ];
+
   const purchaseOrder = useAppForm({
     resolver: zodResolver(PurchaseSchema),
-    defaultJobValue: defaultPurchaseValue,
+    defaultValues: defaultPurchaseValue,
+    mode: "onChange",
   });
-  const getCurrentTrigger = () =>
-    activeTab === 2 ? subscriptionForm.trigger : tenantForm.trigger;
 
   const handleNext = async () => {
     const currentStepFields = getStepFields(activeTab);
-    const trigger = getCurrentTrigger();
-    const valid = await trigger(currentStepFields);
+    const valid = await purchaseOrder.trigger(currentStepFields);
 
     if (valid) {
       setCompletedTabs((prev) => [...new Set([...prev, activeTab])]);
-      setActiveTab((prev) => Math.min(prev + 1, newTenantConfig.length - 1));
+      setActiveTab((prev) => Math.min(prev + 1, stepsConfig.length - 1));
     }
   };
 
@@ -54,59 +56,89 @@ const ManagePurchase = () => {
     setActiveTab((prev) => Math.max(prev - 1, 0));
   };
 
-  const onsubmit = (formData) => {};
+  const { mutate: CreateInvoice, isPending } = useCreatePurchaseInvoice(() => {
+    onClose?.();
+  });
+
+  const onSubmit = (formData) => {
+    console.log("PURCHASE DATA:", formData);
+    let payload = formData;
+    CreateInvoice(payload);
+  };
+
   return (
     <div
       id="wizard-property-listing"
-      className="bs-stepper horizontically mt-2 b-secondry px-1 shadow-none border-0"
+      className="bs-stepper horizontically mt-2 b-secondry px-1 py-1 shadow-none border-0"
     >
-      {/* <span className="fs-5">New Parchase</span> */}
-      <div className="bs-stepper-header  text-start px-0">
-        {newTenantConfig
-          .filter((step) => step.name.toLowerCase() !== "congratulation")
-          .map((step, index) => {
-            const isActive = activeTab === index;
-            const isCompleted = completedTabs.includes(index);
+      {/* Header */}
+      <div className="bs-stepper-header text-start px-0 py-1">
+        {stepsConfig.map((step, index) => {
+          const isActive = activeTab === index;
+          const isCompleted = completedTabs.includes(index);
 
-            return (
-              <React.Fragment key={step.name}>
-                <div
-                  className={`step ${isActive ? "active" : ""} ${
-                    isCompleted ? "crossed" : ""
-                  }`}
-                  data-target={`#step-${index}`}
-                >
+          return (
+            <React.Fragment key={step.name}>
+              <div
+                className={`step ${isActive ? "active" : ""} ${
+                  isCompleted ? "crossed" : ""
+                }`}
+              >
+                <button type="button" className="step-trigger">
+                  <span className="bs-stepper-circle">
+                    {isCompleted ? (
+                      <i className="bx bx-check"></i>
+                    ) : (
+                      <i className={step.icon}></i>
+                    )}
+                  </span>
+
+                  <span className="bs-stepper-label">
+                    <span className="bs-stepper-title">{step.name}</span>
+                    <span className="bs-stepper-subtitle">{step.subtitle}</span>
+                  </span>
+                </button>
+              </div>
+
+              {index < stepsConfig.length - 1 && (
+                <div className="line text-primary"></div>
+              )}
+            </React.Fragment>
+          );
+        })}
+      </div>
+
+      {/* Content */}
+      <div className="bs-stepper-content py-2">
+        <AppFormProvider {...purchaseOrder}>
+          <form onSubmit={purchaseOrder.handleSubmit(onSubmit)}>
+            {stepsConfig[activeTab].component}
+
+            <div className="d-flex justify-content-between mt-4">
+              <button
+                type="button"
+                className="btn btn-sm btn-outline-secondary"
+                onClick={handlePrev}
+                disabled={activeTab === 0}
+              >
+                Previous
+              </button>
+              <di>
+                {activeTab < stepsConfig.length - 1 ? (
                   <button
                     type="button"
-                    className={`step-trigger ${isActive ? "active" : ""}`}
-                    // onClick={() => setActiveTab(index)} // optional
+                    className="btn btn-sm btn-primary"
+                    onClick={handleNext}
                   >
-                    <span className="bs-stepper-circle">
-                      {isCompleted ? (
-                        <i className="bx bx-check"></i>
-                      ) : (
-                        <i className={step.icon}></i>
-                      )}
-                    </span>
-                    <span className="bs-stepper-label">
-                      <span className="bs-stepper-title">{step.name}</span>
-                      <span className="bs-stepper-subtitle">
-                        {step.subtitle}
-                      </span>
-                    </span>
+                    Next <i className="bx bx-sm bx-right-arrow"></i>
+                  </button>
+                ) : (
+                  <button type="submit" className="btn btn-sm btn-primary">
+                    {isPending ? "Please Wait" : "SUbmit"}
                   </button>
-                </div>
-                {index < newTenantConfig.length - 1 && (
-                  <div className="line text-primary"></div>
                 )}
-              </React.Fragment>
-            );
-          })}
-      </div>
-      <div className="bs-stepper-content py-2">
-        <AppFormProvider>
-          <form onSubmit={purchaseOrder.handleSubmit(onsubmit)}>
-            {newTenantConfig[activeTab].component}
+              </di>
+            </div>
           </form>
         </AppFormProvider>
       </div>

src/components/purchase/PurchasePartyDetails.jsx

@@ -1,31 +1,242 @@
 import React from "react";
-import { useAppFormContext } from "../../hooks/appHooks/useAppForm";
+import { AppFormController, useAppFormContext } from "../../hooks/appHooks/useAppForm";
+import Label from "../common/Label";
+import DatePicker from "../common/DatePicker";
+import {
+  SelectFieldSearch,
+  SelectProjectField,
+} from "../common/Forms/SelectFieldServerSide";
+import { useGlobaleOrganizations, useOrganization, useOrganizationsList } from "../../hooks/useOrganization";
+import { ITEMS_PER_PAGE } from "../../utils/constants";
 
-const PurchasePartyDetails = ({ onNext }) => {
+const PurchasePartyDetails = () => {
   const {
     register,
     control,
-    trigger,
+    setValue,
+    watch,
     formState: { errors },
   } = useAppFormContext();
 
-  const handleNext = async () => {
-    const valid = await trigger([
-      "title",
-      "projectId",
-      "organizationId",
-      "supplier",
-      "billingAddress",
-      "shippingAddress",
-      "purchaseOrderNumber",
-      "purchaseOrderDate",
-      "porformaInvoiceNo",
-    ]);
-    if (valid) {
-      onNext();
-    }
-  };
-  return <div className="row"></div>;
+
+  return (
+    <div className="row g-2 text-start">
+      {/* Title */}
+      <div className="col-12 col-md-6">
+        <Label htmlFor="title" required>
+          Title
+        </Label>
+
+        <input
+          id="title"
+          type="text"
+          className={`form-control form-control-md ${
+            errors?.title ? "is-invalid" : ""
+          }`}
+          {...register("title")}
+        />
+
+        {errors?.title && (
+          <div className="danger-text">{errors.title.message}</div>
+        )}
+      </div>
+
+      {/* Project ID */}
+      <div className="col-12 col-md-6">
+        <SelectProjectField
+          className={`form-control form-control-md ${
+            errors?.projectId ? "is-invalid" : ""
+          }`}
+          label="Project"
+          required
+          placeholder="Select Project"
+          value={watch("projectId")}
+          onChange={(val) =>
+            setValue("projectId", val, {
+              shouldDirty: true,
+              shouldValidate: true,
+            })
+          }
+          errors={errors}
+        />
+      </div>
+
+      {/* Organization */}
+      <div className="col-12 col-md-6">
+       
+        {/* <input
+          id="organizationId"
+          type="text"
+          className={`form-control form-control-md `}
+          {...register("organizationId")}
+        /> */}
+        <AppFormController
+          name="organizationId"
+          control={control}
+          render={({ field }) => (
+            <SelectFieldSearch
+              label="Organization"
+              placeholder="Select Organization"
+              required
+              value={field.value}
+              onChange={field.onChange}
+              valueKey="id"
+              labelKey="name"
+              useFetchHook={useGlobaleOrganizations}
+              hookParams={[ITEMS_PER_PAGE,1]}
+              errors={errors?.organizationId}
+            />
+          )}
+        />
+        
+      </div>
+
+      {/* Supplier */}
+      <div className="col-12 col-md-6">
+        
+
+        <AppFormController
+          name="supplierId"
+          control={control}
+          render={({ field }) => (
+            <SelectFieldSearch
+              label="Supplier"
+              placeholder="Select Organization"
+              required
+              value={field.value}
+              onChange={field.onChange}
+              valueKey="id"
+              labelKey="name"
+              useFetchHook={useGlobaleOrganizations}
+              hookParams={[ITEMS_PER_PAGE,1]}
+              errors={errors?.organizationId}
+            />
+          )}
+        />
+
+        {errors?.supplierId && (
+          <div className="danger-text">{errors.supplierId.message}</div>
+        )}
+      </div>
+
+      {/* Billing Address */}
+      <div className="col-12 col-md-6">
+        <Label htmlFor="billingAddress">Billing Address</Label>
+
+        <textarea
+          id="billingAddress"
+          rows="2"
+          className={`form-control form-control-md `}
+          {...register("billingAddress")}
+        />
+
+        {errors?.billingAddress && (
+          <div className="danger-text">{errors.billingAddress.message}</div>
+        )}
+      </div>
+
+      <div className="col-12 col-md-6">
+        <Label htmlFor="shippingAddress">Shipping Address</Label>
+
+        <textarea
+          id="shippingAddress"
+          rows="2"
+          className={`form-control form-control-md `}
+          {...register("shippingAddress")}
+        />
+
+        {errors?.shippingAddress && (
+          <div className="danger-text">{errors.shippingAddress.message}</div>
+        )}
+      </div>
+
+      {/* Purchase Order Number */}
+      <div className="col-12 col-md-6">
+        <Label htmlFor="purchaseOrderNumber" required>
+          Purchase Order Number
+        </Label>
+
+        <input
+          id="purchaseOrderNumber"
+          type="text"
+          className={`form-control form-control-md `}
+          {...register("purchaseOrderNumber")}
+        />
+
+        {errors?.purchaseOrderNumber && (
+          <div className="danger-text">
+            {errors.purchaseOrderNumber.message}
+          </div>
+        )}
+      </div>
+
+      {/* Purchase Order Date */}
+      <div className="col-12 col-md-6">
+        <Label htmlFor="purchaseOrderDate" required>
+          Purchase Order Date
+        </Label>
+
+        <DatePicker
+          control={control}
+          name="purchaseOrderDate"
+          className={` w-full  ${
+            errors?.purchaseOrderDate ? "is-invalid" : ""
+          }`}
+        />
+
+        {errors?.purchaseOrderDate && (
+          <div className="danger-text">{errors.purchaseOrderDate.message}</div>
+        )}
+      </div>
+
+      {/* Proforma Invoice */}
+      <div className="col-12 col-md-6">
+        <Label htmlFor="proformaInvoiceNumber">Proforma Invoice Number</Label>
+        <input
+          id="proformaInvoiceNumber"
+          type="text"
+          className={`form-control `}
+          {...register("proformaInvoiceNumber")}
+        />
+
+        {errors?.proformaInvoiceNumber && (
+          <div className="danger-text">
+            {errors.proformaInvoiceNumber.message}
+          </div>
+        )}
+      </div>
+      <div className="col-12 col-md-6">
+        <Label htmlFor="proformaInvoiceAmountt">Proforma Amount</Label>
+        <input
+          id="proformaInvoiceAmount"
+          type="text"
+          className={`form-control `}
+          {...register("proformaInvoiceAmount")}
+        />
+
+        {errors?.proformaInvoiceAmountt && (
+          <div className="danger-text">
+            {errors.proformaInvoiceAmount.message}
+          </div>
+        )}
+      </div>
+      <div className="col-12 col-md-6">
+        <Label htmlFor="proformaInvoiceDate">Proforma Date</Label>
+
+        <DatePicker
+          control={control}
+          name="proformaInvoiceDate"
+          className="w-full"
+        />
+
+        {errors?.proformaInvoiceDate && (
+          <div className="danger-text">
+            {errors.proformaInvoiceDate.message}
+          </div>
+        )}
+      </div>
+    </div>
+  );
 };
 
 export default PurchasePartyDetails;

src/components/purchase/PurchasePaymentDetails.jsx

@@ -1,11 +1,145 @@
-import React from 'react'
+import React, { useEffect } from "react";
+import Label from "../common/Label";
+import { useAppFormContext } from "../../hooks/appHooks/useAppForm";
+import DatePicker from "../common/DatePicker";
+import { useInvoiceAttachmentTypes } from "../../hooks/masterHook/useMaster";
 
 const PurchasePaymentDetails = () => {
-  return (
-    <div>
-      
-    </div>
-  )
-}
+  const { data, isLoading, error, isError } = useInvoiceAttachmentTypes();
+  console.log(data);
+  const {
+    register,
+    watch,
+    setValue,
+    control,
+    formState: { errors },
+  } = useAppFormContext();
 
-export default PurchasePaymentDetails
+  const baseAmount = watch("baseAmount");
+  const taxAmount = watch("taxAmount");
+
+  useEffect(() => {
+    const base = parseFloat(baseAmount) || 0;
+    const tax = parseFloat(taxAmount) || 0;
+
+    if (base || tax) {
+      setValue("totalAmount", (base + tax).toFixed(2));
+    }
+  }, [baseAmount, taxAmount, setValue]);
+
+  return (
+    <div className="row g-2 text-start">
+      <div className="col-12 col-md-4">
+        <Label htmlFor="baseAmount" required>
+          Base Amount
+        </Label>
+
+        <input
+          id="baseAmount"
+          type="number"
+          className="form-control form-control-md"
+          {...register("baseAmount")}
+        />
+
+        {errors?.baseAmount && (
+          <div className="small danger-text mt-1">
+            {errors.baseAmount.message}
+          </div>
+        )}
+      </div>
+
+      <div className="col-12 col-md-4">
+        <Label htmlFor="taxAmount" required>
+          Tax Amount
+        </Label>
+
+        <input
+          id="taxAmount"
+          type="number"
+          className="form-control form-control-md"
+          {...register("taxAmount")}
+        />
+
+        {errors?.taxAmount && (
+          <div className="small danger-text mt-1">
+            {errors.taxAmount.message}
+          </div>
+        )}
+      </div>
+
+      <div className="col-12 col-md-4">
+        <Label htmlFor="totalAmount" required>
+          Total Amount
+        </Label>
+
+        <input
+          id="totalAmount"
+          type="number"
+          className="form-control form-control-md"
+          {...register("totalAmount")}
+          readOnly
+        />
+
+        {errors?.totalAmount && (
+          <div className="small danger-text mt-1">
+            {errors.totalAmount.message}
+          </div>
+        )}
+      </div>
+
+      <div className="col-12 col-md-6">
+        <Label htmlFor="transportCharges">Transport Charges</Label>
+
+        <input
+          id="transportCharges"
+          type="number"
+          className="form-control form-control-md"
+          {...register("transportCharges")}
+        />
+
+        {errors?.transportCharges && (
+          <div className="small danger-text mt-1">
+            {errors.transportCharges.message}
+          </div>
+        )}
+      </div>
+
+      <div className="col-12 col-md-6">
+        <Label htmlFor="paymentDueDate">Payment Due Date</Label>
+
+        <DatePicker
+          name={"paymentDueDate"}
+          control={control}
+          className="w-full"
+        />
+
+        {errors?.paymentDueDate && (
+          <div className="small danger-text mt-1">
+            {errors.paymentDueDate.message}
+          </div>
+        )}
+      </div>
+
+      <div className="col-12">
+        <Label htmlFor="description" required>
+          Description
+        </Label>
+
+        <textarea
+          id="description"
+          rows="3"
+          className="form-control form-control-md"
+          {...register("description")}
+        />
+
+        {errors?.description && (
+          <div className="small danger-text mt-1">
+            {errors.description.message}
+          </div>
+        )}
+      </div>
+    </div>
+  );
+};
+
+export default PurchasePaymentDetails;

src/components/purchase/PurchaseSchema.jsx

@@ -1,4 +1,5 @@
 import { z } from "zod";
+import { normalizeAllowedContentTypes } from "../../utils/appUtils";
 
 export const AttachmentSchema = (allowedContentType, maxSizeAllowedInMB) => {
   const allowedTypes = normalizeAllowedContentTypes(allowedContentType);
@@ -6,6 +7,10 @@ export const AttachmentSchema = (allowedContentType, maxSizeAllowedInMB) => {
   return z.object({
     fileName: z.string().min(1, { message: "File name is required" }),
     base64Data: z.string().min(1, { message: "File data is required" }),
+    invoiceAttachmentTypeId: z
+      .string()
+      .min(1, { message: "File data is required" }),
+
     contentType: z
       .string()
       .min(1, { message: "MIME type is required" })
@@ -15,6 +20,7 @@ export const AttachmentSchema = (allowedContentType, maxSizeAllowedInMB) => {
           message: `File type must be one of: ${allowedTypes.join(", ")}`,
         }
       ),
+
     fileSize: z
       .number()
       .int()
@@ -23,6 +29,7 @@ export const AttachmentSchema = (allowedContentType, maxSizeAllowedInMB) => {
         (maxSizeAllowedInMB ?? 25) * 1024 * 1024,
         `fileSize must be ≤ ${maxSizeAllowedInMB ?? 25}MB`
       ),
+
     description: z.string().optional().default(""),
     isActive: z.boolean(),
   });
@@ -34,27 +41,32 @@ export const PurchaseSchema = z.object({
   organizationId: z.string().min(1, { message: "Organization is required" }),
   billingAddress: z.string().min(1, { message: "Address is required" }),
   shippingAddress: z.string().min(1, { message: "Address is required" }),
+
   purchaseOrderNumber: z.string().nullable(),
-  purchaseOrderDate: z.string().nullable(),
-  supplier: z.string().min(1, { message: "Supplier is required" }),
-  porformaInvoiceNo: z.string().nullable(),
-  // Supplier Details
+  purchaseOrderDate: z.coerce.date().nullable(),
 
-  invoiceNo: z.string().min(1, { message: "Invoice No is required" }),
-  invoiceDate: z.string().min(1, { message: "Date is required" }),
-  ewayBillNo: z.string().min(1, { message: "E-Way Bill No is required" }),
-  ewayBillDate: z.string().min(1, { message: "E-Way Bill Date is required" }),
-  irnNo: z.string().min(1, { message: "IRN is required" }),
-  ackDate: z.string().min(1, { message: "Date is required" }),
-  ackNo: z.string().min(1, { message: "acknowledgement No is required" }),
+  supplierId: z.string().min(1, { message: "Supplier is required" }),
+
+  proformaInvoiceNumber: z.string().nullable(),
+  proformaInvoiceDate: z.coerce.date().nullable(),
+  proformaInvoiceAmount: z.string().nullable(),
+
+  invoiceNumber: z.string().nullable(),
+  invoiceDate: z.coerce.date().nullable(),
+  eWayBillNumber: z.string().nullable(),
+  eWayBillDate: z.coerce.date().nullable(),
+  invoiceReferenceNumber: z.string().nullable(),
+  acknowledgmentDate: z.coerce.date().nullable(),
+  acknowledgmentNumber: z.string().nullable(),
 
-  // Payment Detail
   baseAmount: z.string().min(1, { message: "Base amount is required" }),
   taxAmount: z.string().min(1, { message: "Tax amount is required" }),
   totalAmount: z.string().min(1, { message: "Total amount is required" }),
-  paymentDueDate: z.string().nullable(),
-  TransportCharges: z.string().nullable(),
-  description: z.string().min(1, { message: "description is required" }),
+  paymentDueDate: z.coerce.date().nullable(),
+  transportCharges: z.string().nullable(),
+  description: z.string().min(1, { message: "Description is required" }),
+
+  attachments: z.array(AttachmentSchema([], 25)).optional(),
 });
 
 //   deliveryChallanNo: z
@@ -64,30 +76,36 @@ export const PurchaseSchema = z.object({
 //   shippingAddress: z.string().min(1, { message: "Delevery Date is required" }),
 
 export const defaultPurchaseValue = {
-  title: null,
-  projectId: null,
-  organizationId: null,
-  billingAddress: null,
-  shippingAddress: null,
+  title: "",
+  projectId: "",
+  organizationId: "",
+  billingAddress: "",
+  shippingAddress: "",
   purchaseOrderNumber: null,
   purchaseOrderDate: null,
-  supplier: null,
-  porformaInvoiceNo: null,
 
-  invoiceNo: null,
+  supplierId: "",
+
+  proformaInvoiceNumber: null,
+  proformaInvoiceDate: null,
+  proformaInvoiceAmount: null,
+
+  invoiceNumber: null,
   invoiceDate: null,
-  ewayBillNo: null,
-  ewayBillDate: null,
-  irnNo: null,
-  ackDate: null,
-  ackNo: null,
+  eWayBillNumber: null,
+  eWayBillDate: null,
+  invoiceReferenceNumber: null,
+  acknowledgmentNumber: null,
+  acknowledgmentDate: null,
 
-  baseAmount: null,
-  taxAmount: null,
-  totalAmount: null,
+  baseAmount: "",
+  taxAmount: "",
+  totalAmount: "",
   paymentDueDate: null,
-  TransportCharges: null,
-  description: null,
+  transportCharges: null,
+  description: "",
+
+  attachments: [],
 };
 
 export const getStepFields = (stepIndex) => {
@@ -96,28 +114,29 @@ export const getStepFields = (stepIndex) => {
       "title",
       "projectId",
       "organizationId",
-      "supplier",
+      "supplierId",
       "billingAddress",
       "shippingAddress",
       "purchaseOrderNumber",
       "purchaseOrderDate",
-      "porformaInvoiceNo",
+      "proformaInvoiceNumber",
+      "proformaInvoiceDate",
+      "proformaInvoiceAmount",
     ],
     1: [
-      "invoiceNo",
+      "invoiceNumber",
       "invoiceDate",
-      "ewayBillNo",
-      "ewayBillDate",
-      "irnNo",
-      "ackNo",
-      "taxId",
-      "ackDate",
+      "eWayBillNumber",
+      "eWayBillDate",
+      "invoiceReferenceNumber",
+      "acknowledgmentNumber",
+      "acknowledgmentDate",
     ],
     2: [
       "baseAmount",
       "taxAmount",
       "totalAmount",
-      "TransportCharges",
+      "transportCharges",
       "paymentDueDate",
       "description",
     ],

src/components/purchase/PurchaseTansportDetails.jsx

@@ -1,11 +0,0 @@
-import React from 'react'
-
-const PurchaseTansportDetails = () => {
-  return (
-    <div>
-      
-    </div>
-  )
-}
-
-export default PurchaseTansportDetails

src/components/purchase/PurchaseTransportDetails.jsx

@@ -0,0 +1,131 @@
+import React from "react";
+import { useAppFormContext } from "../../hooks/appHooks/useAppForm";
+import DatePicker from "../common/DatePicker";
+import Label from "../common/Label";
+
+const PurchaseTransportDetails = () => {
+  const {
+    register,control,
+    formState: { errors },
+  } = useAppFormContext();
+
+  return (
+    <div className="row g-2 text-start">
+      {/* Invoice Number */}
+      <div className="col-12 col-md-6">
+        <Label htmlFor="invoiceNumber" required>
+          Invoice Number
+        </Label>
+
+        <input
+          id="invoiceNumber"
+          type="text"
+          className="form-control form-control-md"
+          {...register("invoiceNumber")}
+        />
+
+        {errors?.invoiceNumber && (
+          <div className="small text-danger mt-1">
+            {errors.invoiceNumber.message}
+          </div>
+        )}
+      </div>
+
+      {/* Invoice Date */}
+      <div className="col-12 col-md-6">
+        <Label htmlFor="invoiceDate">Invoice Date</Label>
+
+     
+          <DatePicker control={control} name="invoiceDate" className="w-full"/>
+
+        {errors?.invoiceDate && (
+          <div className="small text-danger mt-1">
+            {errors.invoiceDate.message}
+          </div>
+        )}
+      </div>
+
+      {/* E-Way Bill Number */}
+      <div className="col-12 col-md-6">
+        <Label htmlFor="eWayBillNumber">E-Way Bill Number</Label>
+
+        <input
+          id="eWayBillNumber"
+          type="text"
+          className="form-control form-control-md"
+          {...register("eWayBillNumber")}
+        />
+
+        {errors?.eWayBillNumber && (
+          <div className="small text-danger mt-1">
+            {errors.eWayBillNumber.message}
+          </div>
+        )}
+      </div>
+
+      {/* E-Way Bill Date */}
+      <div className="col-12 col-md-6">
+        <Label htmlFor="eWayBillDate">E-Way Bill Date</Label>
+
+    
+             <DatePicker control={control} name="eWayBillDate" className="w-full"/>
+
+        {errors?.eWayBillDate && (
+          <div className="small text-danger mt-1">
+            {errors.eWayBillDate.message}
+          </div>
+        )}
+      </div>
+
+      {/* Invoice Reference Number */}
+      <div className="col-12 col-md-6">
+        <Label htmlFor="invoiceReferenceNumber">Invoice Reference Number</Label>
+
+        <input
+          id="invoiceReferenceNumber"
+          type="text"
+          className="form-control form-control-md"
+          {...register("invoiceReferenceNumber")}
+        />
+
+        {errors?.invoiceReferenceNumber && (
+          <div className="small text-danger mt-1">
+            {errors.invoiceReferenceNumber.message}
+          </div>
+        )}
+      </div>
+
+      {/* Acknowledgment Number */}
+      <div className="col-12 col-md-6">
+        <Label htmlFor="acknowledgmentNumber">Acknowledgment Number</Label>
+
+        <input
+          id="acknowledgmentNumber"
+          type="text"
+          className="form-control form-control-md"
+          {...register("acknowledgmentNumber")}
+        />
+
+        {errors?.acknowledgmentNumber && (
+          <div className="small text-danger mt-1">
+            {errors.acknowledgmentNumber.message}
+          </div>
+        )}
+      </div>
+
+      <div className="col-12 col-md-6">
+        <Label htmlFor="acknowledgmentDate">Acknowledgment Date</Label>
+
+        <DatePicker control={control} name="acknowledgmentDate" className="w-full"/>
+
+        {errors?.acknowledgmentDate && (
+          <div className="small text-danger mt-1">
+            {errors.acknowledgmentDate.message}
+          </div>
+        )}
+      </div>
+    </div>
+  );
+};
+
+export default PurchaseTransportDetails;

src/hooks/masterHook/useMaster.js

@@ -10,16 +10,25 @@ import {
 } from "@tanstack/react-query";
 import showToast from "../../services/toastService";
 
-
-export const useRecurringStatus = ()=>{
+export const useInvoiceAttachmentTypes = () => {
   return useQuery({
-    queryKey:["RecurringStatus"],
-    queryFn:async()=>{
+    queryKey: ["invoiceAttachmentType"],
+    queryFn: async () => {
+      const resp = await MasterRespository.getInvoiceAttachmentTypes();
+      return resp.data;
+    },
+  });
+};
+
+export const useRecurringStatus = () => {
+  return useQuery({
+    queryKey: ["RecurringStatus"],
+    queryFn: async () => {
       const resp = await MasterRespository.getRecurringStatus();
-      return resp.data
-    }
-  })
-}
+      return resp.data;
+    },
+  });
+};
 export const useCurrencies = () => {
   return useQuery({
     queryKey: ["currencies"],
@@ -31,10 +40,10 @@ export const useCurrencies = () => {
 };
 
 export const usePaymentAjustmentHead = (isActive) => {
- return useQuery({
-    queryKey: ["paymentType",isActive],
-    queryFn: async () =>  await MasterRespository.getPaymentAdjustmentHead(isActive),
-   
+  return useQuery({
+    queryKey: ["paymentType", isActive],
+    queryFn: async () =>
+      await MasterRespository.getPaymentAdjustmentHead(isActive),
   });
 };
 
@@ -296,26 +305,26 @@ export const useOrganizationType = () => {
   });
 };
 
-export const useJobStatus=(statusId,projectId)=>{
+export const useJobStatus = (statusId, projectId) => {
   return useQuery({
-    queryKey:["Job_Staus",statusId,projectId],
-    queryFn:async()=>{
-      const resp = await MasterRespository.getJobStatus(statusId,projectId);
+    queryKey: ["Job_Staus", statusId, projectId],
+    queryFn: async () => {
+      const resp = await MasterRespository.getJobStatus(statusId, projectId);
       return resp.data;
     },
-    enabled:!!statusId && !!projectId
-  })
-}
+    enabled: !!statusId && !!projectId,
+  });
+};
 
-export const useTeamRole=()=>{
+export const useTeamRole = () => {
   return useQuery({
-    queryKey:["Team_Role"],
-    queryFn:async()=>{
+    queryKey: ["Team_Role"],
+    queryFn: async () => {
       const resp = await MasterRespository.getTeamRole();
       return resp.data;
-    }
-  })
-}
+    },
+  });
+};
 //#region ==Get Masters==
 const fetchMasterData = async (masterType) => {
   switch (masterType) {
@@ -405,8 +414,6 @@ const useMaster = () => {
 export default useMaster;
 //#endregion
 
-
-
 // ================================Mutation====================================
 
 //#region  Job Role
@@ -456,10 +463,6 @@ export const useCreateJobRole = (onSuccessCallback) => {
 };
 //#endregion Job Role
 
-
-
-
-
 //#region  Application Role
 export const useCreateApplicationRole = (onSuccessCallback) => {
   const queryClient = useQueryClient();
@@ -505,10 +508,6 @@ export const useUpdateApplicationRole = (onSuccessCallback) => {
 };
 //#endregion
 
-
-
-
-
 //#region  Create work Category
 export const useCreateWorkCategory = (onSuccessCallback) => {
   const queryClient = useQueryClient();
@@ -554,11 +553,6 @@ export const useUpdateWorkCategory = (onSuccessCallback) => {
 };
 //#endregion
 
-
-
-
-
-
 //#region Contact Category
 
 export const useCreateContactCategory = (onSuccessCallback) => {
@@ -609,10 +603,6 @@ export const useUpdateContactCategory = (onSuccessCallback) => {
 
 //#endregion
 
-
-
-
-
 //#region Contact Tag
 
 export const useCreateContactTag = (onSuccessCallback) => {
@@ -659,10 +649,6 @@ export const useUpdateContactTag = (onSuccessCallback) => {
 };
 //#endregion
 
-
-
-
-
 //#region Expense Category
 export const useCreateExpenseCategory = (onSuccessCallback) => {
   const queryClient = useQueryClient();
@@ -689,7 +675,10 @@ export const useUpdateExpenseCategory = (onSuccessCallback) => {
 
   return useMutation({
     mutationFn: async ({ id, payload }) => {
-      const response = await MasterRespository.updateExpenseCategory(id, payload);
+      const response = await MasterRespository.updateExpenseCategory(
+        id,
+        payload
+      );
       return response.data;
     },
     onSuccess: (data, variables) => {
@@ -708,11 +697,6 @@ export const useUpdateExpenseCategory = (onSuccessCallback) => {
 
 //#endregion
 
-
-
-
-
-
 //#region  Payment Mode
 
 export const useCreatePaymentMode = (onSuccessCallback) => {
@@ -759,10 +743,6 @@ export const useUpdatePaymentMode = (onSuccessCallback) => {
 
 //#endregion
 
-
-
-
-
 // Services-------------------------------
 
 // export const useCreateService = (onSuccessCallback) => {
@@ -844,10 +824,6 @@ export const useUpdateService = (onSuccessCallback) => {
 
 //#endregion
 
-
-
-
-
 //#region  Activity Grouph
 
 export const useCreateActivityGroup = (onSuccessCallback) => {
@@ -912,10 +888,6 @@ export const useUpdateActivityGroup = (onSuccessCallback) => {
 
 //#endregion
 
-
-
-
-
 //#region Activities
 export const useCreateActivity = (onSuccessCallback) => {
   const queryClient = useQueryClient();
@@ -970,11 +942,6 @@ export const useUpdateActivity = (onSuccessCallback) => {
 
 //#endregion
 
-
-
-
-
-
 //#region Expense Status
 export const useCreateExpenseStatus = (onSuccessCallback) => {
   const queryClient = useQueryClient();
@@ -1018,10 +985,6 @@ export const useUpdateExpenseStatus = (onSuccessCallback) => {
 };
 //#endregion
 
-
-
-
-
 //#region Document-Category
 export const useCreateDocumentCatgory = (onSuccessCallback) => {
   const queryClient = useQueryClient();
@@ -1068,11 +1031,6 @@ export const useUpdateDocumentCategory = (onSuccessCallback) => {
 };
 //#endregion
 
-
-
-
-
-
 //#region Document-Type
 export const useCreateDocumentType = (onSuccessCallback) => {
   const queryClient = useQueryClient();
@@ -1117,10 +1075,6 @@ export const useUpdateDocumentType = (onSuccessCallback) => {
 };
 //#endregion
 
-
-
-
-
 //#region Payment Adjustment Head
 export const useCreatePaymentAjustmentHead = (onSuccessCallback) => {
   const queryClient = useQueryClient();
@@ -1147,7 +1101,10 @@ export const useUpdatePaymentAjustmentHead = (onSuccessCallback) => {
 
   return useMutation({
     mutationFn: async ({ id, payload }) => {
-      const resp = await MasterRespository.updatePaymentAjustmentHead(id, payload);
+      const resp = await MasterRespository.updatePaymentAjustmentHead(
+        id,
+        payload
+      );
       return resp.data;
     },
     onSuccess: (data) => {
@@ -1164,10 +1121,6 @@ export const useUpdatePaymentAjustmentHead = (onSuccessCallback) => {
 };
 //#endregion
 
-
-
-
-
 //#region  ==Delete Master==
 export const useDeleteMasterItem = () => {
   const queryClient = useQueryClient();
@@ -1203,8 +1156,6 @@ export const useDeleteMasterItem = () => {
 
 //#endregion
 
-
-
 export const useDeleteServiceGroup = () => {
   const queryClient = useQueryClient();
 

src/hooks/useOrganization.js

@@ -24,7 +24,9 @@ export const useOrganizationModal = () => {
       dispatch(
         openOrgModal({
           isOpen: true,
-          orgData: options.hasOwnProperty("orgData") ? options.orgData : orgData,
+          orgData: options.hasOwnProperty("orgData")
+            ? options.orgData
+            : orgData,
           startStep: options.startStep ?? startStep ?? 1,
           prevStep: options.prevStep ?? prevStep ?? 1,
           flowType: options.flowType ?? flowType ?? "default",
@@ -37,16 +39,30 @@ export const useOrganizationModal = () => {
 
 // ================================Query=============================================================
 
-export const useOrganization=(id)=>{
-return useQuery({
-  queryKey:["organization",id],
-  queryFn:async()=> {
-    const resp = await await OrganizationRepository.getOrganizaion(id);
-    return resp.data
-  },
-  enabled:!!id
-})
-}
+export const useGlobaleOrganizations = (pageSize, pageNumber, searchString) => {
+  return useQuery({
+    queryKey: ["global_organization",pageSize, pageNumber, searchString],
+    queryFn: async () => {
+      const resp = await OrganizationRepository.getGlobalOrganization(
+        pageSize,
+        pageNumber,
+        searchString
+      );
+      return resp.data;
+    },
+  });
+};
+
+export const useOrganization = (id) => {
+  return useQuery({
+    queryKey: ["organization", id],
+    queryFn: async () => {
+      const resp = await await OrganizationRepository.getOrganizaion(id);
+      return resp.data;
+    },
+    enabled: !!id,
+  });
+};
 export const useOrganizationBySPRID = (sprid) => {
   return useQuery({
     queryKey: ["organization by", sprid],
@@ -101,7 +117,7 @@ export const useOrganizationEmployees = (
         organizationId,
         searchString
       ),
-    enabled: !!projectId ,
+    enabled: !!projectId,
   });
 };
 
@@ -138,10 +154,10 @@ export const useAssignOrgToProject = (onSuccessCallback) => {
       useClient.invalidateQueries({
         queryKey: ["projectAssignedOrganiztions"],
       });
-         useClient.invalidateQueries({
+      useClient.invalidateQueries({
         queryKey: ["projectAssignedOrganiztionsName"],
       });
-     
+
       useClient.invalidateQueries({
         queryKey: ["projectAssignedServices", projectId],
       });
@@ -181,12 +197,14 @@ export const useAssignOrgToTenant = (onSuccessCallback) => {
 export const useUpdateOrganization = (onSuccessCallback) => {
   const useClient = useQueryClient();
   return useMutation({
-    mutationFn: async ({orgId,payload}) =>
-      await OrganizationRepository.updateOrganizaion(orgId,payload),
+    mutationFn: async ({ orgId, payload }) =>
+      await OrganizationRepository.updateOrganizaion(orgId, payload),
     onSuccess: (_, variables) => {
       useClient.invalidateQueries({ queryKey: ["organizationList"] });
-      useClient.invalidateQueries({ queryKey: ["projectAssignedOrganiztionsName"] });
-       
+      useClient.invalidateQueries({
+        queryKey: ["projectAssignedOrganiztionsName"],
+      });
+
       showToast("Organization Updated successfully", "success");
       if (onSuccessCallback) onSuccessCallback();
     },

src/hooks/usePurchase.jsx

@@ -0,0 +1,25 @@
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import { PurchaseRepository } from "../repositories/PurchaseRepository";
+
+
+
+export const useCreatePurchaseInvoice = (onSuccessCallback) => {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (payload) =>
+      await PurchaseRepository.CreatePurchase(payload),
+    onSuccess: (data, variables) => {
+      showToast("Purchase Invoice Created successfully", "success");
+      if (onSuccessCallback) onSuccessCallback();
+    },
+    onError: (error) => {
+      showToast(
+        error?.response?.data?.message ||
+          error.message ||
+          "Failed to create invoice",
+        "error"
+      );
+    },
+  });
+};

src/repositories/MastersRepository.jsx

@@ -157,4 +157,7 @@ export const MasterRespository = {
     ),
 
   getTeamRole: () => api.get(`/api/Master/team-roles/list`),
+
+
+  getInvoiceAttachmentTypes:()=>api.get("/api/Master/invoice-attachment-type/list")
 };

src/repositories/OrganizationRespository.jsx

@@ -2,8 +2,9 @@ import { api } from "../utils/axiosClient";
 
 const OrganizationRepository = {
   createOrganization: (data) => api.post("/api/Organization/create", data),
-  updateOrganizaion:(id,data)=>api.put(`/api/Organization/edit/${id}`,data),
-  getOrganizaion:(id)=>api.get(`/api/Organization/details/${id}`),
+  updateOrganizaion: (id, data) =>
+    api.put(`/api/Organization/edit/${id}`, data),
+  getOrganizaion: (id) => api.get(`/api/Organization/details/${id}`),
   getOrganizationList: (pageSize, pageNumber, active, sprid, searchString) => {
     return api.get(
       `/api/Organization/list?pageSize=${pageSize}&pageNumber=${pageNumber}&active=${active}&${
@@ -39,6 +40,11 @@ const OrganizationRepository = {
 
     return api.get(url);
   },
+
+  getGlobalOrganization: (pageSize, pageNumber, searchString) =>
+    api.get(
+      `/api/Organization/list/basic?pageSize=${pageSize}&pageNumber=${pageNumber}&searchString=${searchString}`
+    ),
 };
 
 export default OrganizationRepository;

src/repositories/PurchaseRepository.jsx

@@ -0,0 +1,5 @@
+import { api } from "../utils/axiosClient";
+
+export const PurchaseRepository = {
+  CreatePurchase: (data) => api.post("/api/PurchaseInvoice/create", data),
+};