fixed action button visibilities

This commit is contained in:
pramod mahajan 2025-07-30 11:12:56 +05:30
parent 3464b63588
commit a3313f6c0a

View File

@ -11,20 +11,21 @@ import ConfirmModal from "../common/ConfirmModal";
import { useHasUserPermission } from "../../hooks/useHasUserPermission";
import { useSelector } from "react-redux";
const ExpenseList = ({filters}) => {
const ExpenseList = ({ filters }) => {
const [deletingId, setDeletingId] = useState(null);
const [IsDeleteModalOpen, setIsDeleteModalOpen] = useState(false);
const { setViewExpense, setManageExpenseModal } = useExpenseContext();
const IsExpenseEditable = useHasUserPermission()
const IsExpesneApprpve = useHasUserPermission(APPROVE_EXPENSE)
const IsExpenseEditable = useHasUserPermission();
const IsExpesneApprpve = useHasUserPermission(APPROVE_EXPENSE);
const [currentPage, setCurrentPage] = useState(1);
const pageSize = 10;
const { mutate: DeleteExpense, isPending } = useDeleteExpense();
const { data, isLoading, isError, isInitialLoading, error, isFetching } =
useExpenseList(10, currentPage, filters);
const SelfId = useSelector((store)=>store?.globalVariables?.loginUser?.employeeInfo?.id)
const SelfId = useSelector(
(store) => store?.globalVariables?.loginUser?.employeeInfo?.id
);
const handleDelete = (id) => {
setDeletingId(id);
@ -64,7 +65,7 @@ const ExpenseList = ({filters}) => {
const grouped = {};
expenses.forEach((expense) => {
const dateKey = expense.transactionDate.split("T")[0];
const dateKey = expense.transactionDate.split("T")[0];
if (!grouped[dateKey]) grouped[dateKey] = [];
grouped[dateKey].push(expense);
});
@ -123,17 +124,6 @@ const ExpenseList = ({filters}) => {
>
<thead>
<tr>
{/* <th
className="sorting sorting_desc"
tabIndex="0"
aria-controls="DataTables_Table_0"
rowSpan="1"
colSpan="2"
aria-label="Date: activate to sort column ascending"
aria-sort="descending"
>
<div className="text-start ms-6">Date Time</div>
</th> */}
<th
className="sorting sorting_desc d-none d-sm-table-cell"
tabIndex="0"
@ -199,7 +189,7 @@ const ExpenseList = ({filters}) => {
</th>
</tr>
</thead>
<tbody >
<tbody>
{!isInitialLoading &&
groupExpensesByDateAndStatus(items).map(
({ date, expenses }) => (
@ -208,8 +198,9 @@ const ExpenseList = ({filters}) => {
<td colSpan={7} className="text-start">
<strong>{formatUTCToLocalTime(date)}</strong>
</td>
</tr> {expenses.map((expense) => (
<tr key={expense.id} >
</tr>{" "}
{expenses.map((expense) => (
<tr key={expense.id}>
<td className="text-start d-table-cell ms-5">
{expense.expensesType?.name || "N/A"}
</td>
@ -259,44 +250,34 @@ const ExpenseList = ({filters}) => {
></i>
</span>
<span className="cursor-pointer">
{(expense.status.name === "Draft" ||
expense.status.name === "Rejected") &&
expense.createdBy.id ===
SelfId ? (
<i
className="bx bx-edit bx-sm text-secondary"
onClick={() =>
setManageExpenseModal({
IsOpen: true,
expenseId: expense.id,
})
}
></i>
) : (
<i
className="bx bx-edit bx-sm"
style={{ visibility: "hidden" }}
></i>
{(expense.status.name === "Draft" ||
expense.status.name === "Rejected") &&
expense.createdBy.id === SelfId && (
<span className="cursor-pointer">
<i
className="bx bx-edit bx-sm text-secondary"
onClick={() =>
setManageExpenseModal({
IsOpen: true,
expenseId: expense.id,
})
}
></i>
</span>
)}
</span>
<span className="cursor-pointer">
{(expense.status.name === "Draft" && expense?.createdBy?.id === SelfId ) ? (
<i
className="bx bx-trash bx-sm text-danger"
onClick={() => {
setIsDeleteModalOpen(true);
setDeletingId(expense.id);
}}
></i>
) : (
<i
className="bx bx-trash bx-sm"
style={{ visibility: "hidden" }}
></i>
{expense.status.name === "Draft" &&
expense?.createdBy?.id === SelfId && (
<span className="cursor-pointer">
<i
className="bx bx-trash bx-sm text-danger"
onClick={() => {
setIsDeleteModalOpen(true);
setDeletingId(expense.id);
}}
></i>
</span>
)}
</span>
</div>
</td>
</tr>
@ -305,11 +286,11 @@ const ExpenseList = ({filters}) => {
)
)}
{!isInitialLoading && items.length === 0 && <tr rowSpan={8} style={{height:"200px"}}>
<td colSpan={8}>
No Expnese Found
</td>
</tr>}
{!isInitialLoading && items.length === 0 && (
<tr rowSpan={8} style={{ height: "200px" }}>
<td colSpan={8}>No Expnese Found</td>
</tr>
)}
</tbody>
</table>
</div>