mazyar/tm_panel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add: shared skeleton, dark toggle bg, fixed: multi select patching issue

Browse Source
This commit is contained in:
AmirReza Jamali
2025-09-20 19:35:58 +03:30
parent 0ea2ff635b
commit 4a7a1c66f7
14 changed files with 48 additions and 216 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Tables/customers/Skeleton.tsx
-43
View File
@@ -1,43 +0,0 @@
import { Skeleton } from "@/components/ui/skeleton";
import {
Table,
TableBody,
TableCell,
TableHead,
TableHeader,
TableRow,
} from "@/components/ui/table";
export function CustomersSkeleton() {
return (
<div className="rounded-[10px] bg-white px-7.5 pb-4 pt-7.5 shadow-1 dark:bg-gray-dark dark:shadow-card">
<h2 className="mb-5.5 text-body-2xlg font-bold text-dark dark:text-white">
Tenders
</h2>
<Table>
<TableHeader>
<TableRow className="border-none uppercase [&>th]:text-center">
<TableHead className="uppercase">full name</TableHead>
<TableHead className="uppercase">email</TableHead>
<TableHead className="uppercase">created at</TableHead>
<TableHead className="uppercase">type</TableHead>
<TableHead className="uppercase">status</TableHead>
<TableHead className="uppercase">company</TableHead>
<TableHead className="uppercase">actions</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{Array.from({ length: 5 }).map((_, i) => (
<TableRow key={i}>
<TableCell colSpan={100}>
<Skeleton className="h-8" />
</TableCell>
</TableRow>
))}
</TableBody>
</Table>
</div>
);
}
src/components/Tables/customers/index.tsx
+11 -13
View File
@@ -1,7 +1,6 @@
"use client";
import Link from "next/link";
import { CustomersSkeleton } from "./Skeleton";
import useCustomerListPresenter from "./useCustomerListPresenter";
import { PencilSquareIcon, TrashIcon, UserIcon } from "@/assets/icons";
import ConfirmationModal from "@/components/ui/ConfirmationModal";
import {
Table,
TableBody,
@@ -10,16 +9,15 @@ import {
TableHeader,
TableRow,
} from "@/components/ui/table";
import { PencilSquareIcon, TrashIcon, UserIcon } from "@/assets/icons";
import ConfirmationModal from "@/components/ui/ConfirmationModal";
import Link from "next/link";
import useCustomerListPresenter from "./useCustomerListPresenter";
import AssignToCompanyModalContent from "./AssignToCompanyModalContent";
import Modal from "@/components/ui/modal";
import { TAssignCustomerToCompanyCredentials } from "@/lib/api";
import { toast } from "react-toastify";
import Status from "@/components/ui/Status";
import TableSkeleton from "@/components/ui/TableSkeleton";
import { unixToDate } from "@/utils/shared";
import { custom } from "zod";
import { toast } from "react-toastify";
import AssignToCompanyModalContent from "./AssignToCompanyModalContent";
const CustomersTable = () => {
const {
@@ -40,7 +38,6 @@ const CustomersTable = () => {
isAssignCompanyModalOpen,
setIsAssignCompanyModalOpen,
} = useCustomerListPresenter();
if (isPending) return <CustomersSkeleton />;
return (
<div className="flex flex-col rounded-[10px] bg-white px-7.5 pb-4 pt-7.5 shadow-1 dark:bg-gray-dark dark:shadow-card">
<button className="mb-5 flex w-fit justify-center self-end rounded-lg bg-primary p-[13px] font-medium text-white hover:bg-opacity-90">
@@ -60,6 +57,7 @@ const CustomersTable = () => {
))}
</TableRow>
</TableHeader>
{isPending && <TableSkeleton column={columns.length} />}
<TableBody>
{allCustomers.map((customer) => (
<TableRow key={customer.id}>
@@ -69,11 +67,11 @@ const CustomersTable = () => {
{unixToDate(customer.created_at)}
</TableCell>
<TableCell colSpan={100} className="uppercase">{customer.type}</TableCell>
<TableCell colSpan={100} className="uppercase">
{customer.type}
</TableCell>
<TableCell colSpan={100}>
<Status status={customer.status}>
<Status status={customer.status}>{customer.status}</Status>
</Status>
</TableCell>
<TableCell colSpan={100}>
{customer.companies?.length ? (