AmirReza Jamali
d1bc56dc60
- Integrated GSAP for improved animations in the tender list components, enhancing user experience during data loading and transitions. - Refactored TendersTable and TenderListFilters to utilize new animation features, providing smoother interactions. - Updated TableBody and TableSkeleton components to support ref forwarding, improving flexibility in rendering and animations. - Enhanced useTenderListPresenter to manage loading states and pagination more effectively, ensuring better data handling and user feedback.
31 lines
911 B
TypeScript
31 lines
911 B
TypeScript
import * as React from "react";
|
|
import { Skeleton } from "./skeleton";
|
|
import { TableBody, TableCell, TableRow } from "./table";
|
|
|
|
interface IProps {
|
|
length?: number;
|
|
column: number;
|
|
cellColSpan?: number;
|
|
}
|
|
|
|
const TableSkeleton = React.forwardRef<HTMLTableSectionElement, IProps>(
|
|
({ column, length = 20, cellColSpan = 100 }, ref) => {
|
|
return (
|
|
<TableBody ref={ref} data-cy="table-skeleton">
|
|
{Array.from({ length }).map((_, i) => (
|
|
<TableRow key={i} data-cy={`table-skeleton-row-${i}`}>
|
|
{Array.from({ length: column }).map((_, j) => (
|
|
<TableCell key={j} colSpan={cellColSpan} data-cy="table-skeleton-cell">
|
|
<Skeleton className="h-8 rounded-lg" />
|
|
</TableCell>
|
|
))}
|
|
</TableRow>
|
|
))}
|
|
</TableBody>
|
|
);
|
|
},
|
|
);
|
|
TableSkeleton.displayName = "TableSkeleton";
|
|
|
|
export default TableSkeleton;
|