src/components/Expenses/ExpenseFilterPanel.jsx

@@ -18,7 +18,7 @@ import { ExpenseFilterSkeleton } from "./ExpenseSkeleton";
 
 const ExpenseFilterPanel = ({ onApply, handleGroupBy }) => {
   const selectedProjectId = useSelector((store) => store.localVariables.projectId);
-  const { data, isLoading,isError,error,isFetching , isFetched} = useExpenseFilter();
+  const { data, isLoading } = useExpenseFilter();
 
   const groupByList = useMemo(() => [
     { id: "transactionDate", name: "Transaction Date" },
@@ -69,8 +69,8 @@ const ExpenseFilterPanel = ({ onApply, handleGroupBy }) => {
     closePanel();
   };
 
-  if (isLoading || isFetching) return <ExpenseFilterSkeleton />;
+  if (isLoading) return <ExpenseFilterSkeleton />;
-  if(isError && isFetched) return <div>Something went wrong Here- {error.message} </div>
+
   return (
     <>
 

src/components/Expenses/ExpenseList.jsx

@@ -4,7 +4,7 @@ import Avatar from "../common/Avatar";
 import { useExpenseContext } from "../../pages/Expense/ExpensePage";
 import { formatDate, formatUTCToLocalTime } from "../../utils/dateUtils";
 import Pagination from "../common/Pagination";
-import { APPROVE_EXPENSE, EXPENSE_DRAFT, EXPENSE_REJECTEDBY } from "../../utils/constants";
+import { APPROVE_EXPENSE } from "../../utils/constants";
 import { getColorNameFromHex, useDebounce } from "../../utils/appUtils";
 import { ExpenseTableSkeleton } from "./ExpenseSkeleton";
 import ConfirmModal from "../common/ConfirmModal";
@@ -164,19 +164,7 @@ const ExpenseList = ({ filters, groupBy = "transactionDate",searchText }) => {
     ? groupByField(data?.data ?? [], groupBy)
     : { All: data?.data ?? [] };
   const IsGroupedByDate = ["transactionDate", "createdAt"].includes(groupBy);
-const canEditExpense = (expense) => {
-  return (
-    (expense.status.id === EXPENSE_DRAFT ||
-      EXPENSE_REJECTEDBY.includes(expense.status.id)) &&
-    expense.createdBy?.id === SelfId
-  );
-};
 
-const canDetetExpense = (expense)=>{
-  return (expense.status.id === EXPENSE_DRAFT && expense.createdBy.id === SelfId )
-}
-
-                              
   return (
     <>
       {IsDeleteModalOpen && (
@@ -267,28 +255,29 @@ const canDetetExpense = (expense)=>{
                                   })
                                 }
                               ></i>
-                             {canEditExpense(expense) && (
+                              {(expense.status.name === "Draft" ||
-  <i
+                                expense.status.name === "Rejected") &&
-    className="bx bx-edit text-secondary cursor-pointer"
+                                expense.createdBy.id === SelfId && (
-    onClick={() =>
+                                  <i
-      setManageExpenseModal({
+                                    className="bx bx-edit text-secondary cursor-pointer"
-        IsOpen: true,
+                                    onClick={() =>
-        expenseId: expense.id,
+                                      setManageExpenseModal({
-      })
+                                        IsOpen: true,
-    }
+                                        expenseId: expense.id,
-  ></i>
+                                      })
-)}
+                                    }
- 
+                                  ></i>
-                                  {canDetetExpense(expense) && (
+                                )}
-                                        <i
+                              {expense.status.name === "Draft" &&
+                                expense.createdBy.id === SelfId && (
+                                  <i
                                     className="bx bx-trash text-danger cursor-pointer"
                                     onClick={() => {
                                       setIsDeleteModalOpen(true);
                                       setDeletingId(expense.id);
                                     }}
                                   ></i>
-                                  )}
+                                )}
-
                             </div>
                           </td>
                         </tr>

src/components/Expenses/ViewExpense.jsx

@@ -12,7 +12,7 @@ import { useExpenseContext } from "../../pages/Expense/ExpensePage";
 import { getColorNameFromHex } from "../../utils/appUtils";
 import { ExpenseDetailsSkeleton } from "./ExpenseSkeleton";
 import { useHasUserPermission } from "../../hooks/useHasUserPermission";
-import { EXPENSE_REJECTEDBY, PROCESS_EXPENSE, REVIEW_EXPENSE } from "../../utils/constants";
+import { PROCESS_EXPENSE, REVIEW_EXPENSE } from "../../utils/constants";
 import { useProfile } from "../../hooks/useProfile";
 import { useSelector } from "react-redux";
 import { useNavigate } from "react-router-dom";
@@ -49,9 +49,6 @@ const ViewExpense = ({ ExpenseId }) => {
   const userPermissions = useSelector(
     (state) => state?.globalVariables?.loginUser?.featurePermissions || []
   );
-  const CurrentUser = useSelector(
-    (state) => state?.globalVariables?.loginUser?.employeeInfo
-  );
 
   const nextStatusWithPermission = useMemo(() => {
     if (!Array.isArray(data?.nextStatus)) return [];
@@ -69,14 +66,6 @@ const ViewExpense = ({ ExpenseId }) => {
     });
   }, [data, userPermissions]);
 
-  const IsRejectedExpense = useMemo(()=>{
-    return EXPENSE_REJECTEDBY.includes(data?.status?.id)
-  },[data])
-
-  const isCreatedBy = useMemo(() => {
-  return data?.createdBy.id === CurrentUser?.id;
-}, [data, CurrentUser]);
-
   const { mutate: MakeAction,isPending } = useActionOnExpense(() => {
     setClickedStatusId(null);
     reset()});
@@ -195,7 +184,7 @@ const ViewExpense = ({ ExpenseId }) => {
                 getColorNameFromHex(data?.status?.color) || "secondary"
               }`}
             >
-              {data?.status?.name}
+              {data?.status?.displayName}
             </span>
           </div>
         </div>
@@ -477,49 +466,43 @@ const ViewExpense = ({ ExpenseId }) => {
               </div>
             </div>
           )}
-        <div className="col-12 mb-3 text-start">
+          <div className="col-12 mb-3 text-start">
-  {(
+            {nextStatusWithPermission.length > 0 && (
-    (nextStatusWithPermission.length > 0 && !IsRejectedExpense) || 
+              <>
-    (IsRejectedExpense && isCreatedBy)
+                <label className="form-label me-2 mb-0 ">Comment:</label>
-  ) && (
+                <textarea
-    <>
+                  className="form-control form-control-sm"
-      <label className="form-label me-2 mb-0">Comment:</label>
+                  {...register("comment")}
-      <textarea
+                  rows="2"
-        className="form-control form-control-sm"
+                />
-        {...register("comment")}
+                {errors.comment && (
-        rows="2"
+                  <small className="danger-text">
-      />
+                    {errors.comment.message}
-      {errors.comment && (
+                  </small>
-        <small className="danger-text">
+                )}
-          {errors.comment.message}
+              </>
-        </small>
+            )}
-      )}
-    </>
-  )}
-
-  {(nextStatusWithPermission?.length > 0 && (!IsRejectedExpense || isCreatedBy)) && (
-    <div className="text-center flex-wrap gap-2 my-2">
-      {nextStatusWithPermission.map((status, index) => (
-        <button
-          key={status.id || index}
-          type="button"
-          onClick={() => {
-            setClickedStatusId(status.id);
-            setValue("statusId", status.id);
-            handleSubmit(onSubmit)();
-          }}
-          disabled={isPending}
-          className="btn btn-primary btn-sm cursor-pointer mx-2 border-0"
-        >
-          {isPending && clickedStatusId === status.id
-            ? "Please Wait..."
-            : status.displayName || status.name}
-        </button>
-      ))}
-    </div>
-  )}
-</div>
 
+            {nextStatusWithPermission?.length > 0 && (
+              <div className="text-center flex-wrap gap-2 my-2">
+                {nextStatusWithPermission?.map((status, index) => (
+                  <button
+                    key={status.id || index}
+                    type="button"
+                    onClick={() => {
+                      setClickedStatusId(status.id);
+                      setValue("statusId", status.id);
+                      handleSubmit(onSubmit)();
+                    }}
+                    disabled={isPending}
+                    className="btn btn-primary btn-sm cursor-pointer mx-2 border-0"
+                  >
+                      {(isPending && clickedStatusId === status.id) ? "Please Wait..." : (status.displayName || status.name)}
+                  </button>
+                ))}
+              </div>
+            )}
+          </div>
         </>
       )}
     </form>

src/pages/Expense/ExpensePage.jsx

@@ -114,7 +114,7 @@ const ExpensePage = () => {
                 <div className="row align-items-center">
                   <div className="col-sm-6 col-md-4">
                     <div className="d-flex align-items-center">
-
+                      <span className="form-label me-2" id="search-label">Search</span>
                       <input
                         type="search"
                         className="form-control form-control-sm w-auto"

src/utils/constants.jsx

@@ -56,9 +56,7 @@ export const PROCESS_EXPENSE = "ea5a1529-4ee8-4828-80ea-0e23c9d4dd11"
 
 export const EXPENSE_MANAGE = "ea5a1529-4ee8-4828-80ea-0e23c9d4dd11"
 
-export const EXPENSE_REJECTEDBY = ["d1ee5eec-24b6-4364-8673-a8f859c60729","965eda62-7907-4963-b4a1-657fb0b2724b"]
 
-export const EXPENSE_DRAFT = "297e0d8f-f668-41b5-bfea-e03b354251c"
 // -------------------Application Role------------------------------
 
 // 1 - Expense Manage