diff --git a/public/assets/vendor/css/core.css b/public/assets/vendor/css/core.css index 85124986..79538366 100644 --- a/public/assets/vendor/css/core.css +++ b/public/assets/vendor/css/core.css @@ -20475,7 +20475,7 @@ li:not(:first-child) .dropdown-item, } /* text-size */ .text-tiny{ - font-size: 13px; + font-size: 10px; } /* rtl:end:remove */ .text-primary { diff --git a/src/components/Expenses/ExpenseStatusLogs.jsx b/src/components/Expenses/ExpenseStatusLogs.jsx index 443b07ba..575508db 100644 --- a/src/components/Expenses/ExpenseStatusLogs.jsx +++ b/src/components/Expenses/ExpenseStatusLogs.jsx @@ -1,14 +1,19 @@ -import { useState } from "react"; +import { useState,useMemo } from "react"; import Avatar from "../common/Avatar"; import { formatUTCToLocalTime } from "../../utils/dateUtils"; + const ExpenseStatusLogs = ({ data }) => { const [visibleCount, setVisibleCount] = useState(4); - const logsToShow = [...(data?.expenseLogs || [])] - .sort((a, b) => new Date(b.updateAt) - new Date(a.updateAt)) - .slice(0, visibleCount); + const sortedLogs = useMemo(() => { + if (!data?.expenseLogs) return []; + return [...data.expenseLogs].sort( + (a, b) => new Date(b.updateAt) - new Date(a.updateAt) + ); + }, [data?.expenseLogs]); + const logsToShow = sortedLogs.slice(0, visibleCount); const handleShowMore = () => { setVisibleCount((prev) => prev + 4); @@ -17,11 +22,8 @@ const ExpenseStatusLogs = ({ data }) => { return ( <>