Skip to content

Commit 003bff0

Browse files
sayandedotcomsayandedotcom
committed
error
1 parent 5cb098b commit 003bff0

File tree

1 file changed

+137
-46
lines changed

1 file changed

+137
-46
lines changed

‎apps/web/components/requests/requests-data-table.tsx‎

Lines changed: 137 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@
22

33
import * as React from "react";
44

5-
import { GET_ALL_REQUESTS } from "@/graphql/posts/queries/get-all-requests";
6-
import { useQuery } from "@apollo/client";
5+
import { Link } from "@/navigation";
6+
import { fromNow } from "@refhiredcom/utils";
77
import {
88
ColumnDef,
99
ColumnFiltersState,
@@ -16,11 +16,9 @@ import {
1616
getSortedRowModel,
1717
useReactTable,
1818
} from "@tanstack/react-table";
19-
import { ArrowUpDown, ChevronDown, MoreHorizontal } from "lucide-react";
20-
import { useSession } from "next-auth/react";
19+
import { ArrowUpDown, ChevronDown, File, Link2, MoreHorizontal } from "lucide-react";
2120

2221
import {
23-
Badge,
2422
Button,
2523
Checkbox,
2624
DropdownMenu,
@@ -39,7 +37,9 @@ import {
3937
TableRow,
4038
} from "@referrer/ui";
4139

42-
const data: Payment[] = [];
40+
import { TooltipDemo } from "../ui";
41+
42+
// const data: Payment[] = [];
4343
// // {
4444
// // id: "m5gr84i9",
4545
// // amount: 316,
@@ -72,12 +72,36 @@ const data: Payment[] = [];
7272
// // },
7373
// ];
7474

75-
export type Payment = {
76-
id: string;
77-
amount: number;
78-
status: "read" | "unread";
79-
email: string;
80-
};
75+
// export type Data = {
76+
// id: string;
77+
// received: string;
78+
// status: string;
79+
// post: string;
80+
// email: string;
81+
// amount: number;
82+
// info: any;
83+
// };
84+
85+
// const data: Data[] = [
86+
// {
87+
// id: "1",
88+
// received: "5 min ago",
89+
// status: "Read",
90+
// post: "Hiring Backend Developers from India and I would ...",
91+
// email: "[email protected]",
92+
// amount: 354,
93+
// info: "grfhrtehbyrt",
94+
// },
95+
// {
96+
// id: "2",
97+
// received: "5 min ago",
98+
// status: "Unread",
99+
// post: "Hiring Developers from India and I would ...",
100+
// email: "[email protected]",
101+
// amount: 354,
102+
// info: "grfhrtehbyrt",
103+
// },
104+
// ];
81105

82106
export const columns: ColumnDef<any>[] = [
83107
{
@@ -102,22 +126,21 @@ export const columns: ColumnDef<any>[] = [
102126
{
103127
accessorKey: "received",
104128
header: "Received",
105-
cell: ({ row }) => <div className="capitalize">{row.getValue("status")}</div>,
106-
},
107-
{
108-
accessorKey: "status",
109-
header: "Status",
110-
cell: ({ row }) => (
111-
<Badge variant="outline" className="capitalize">
112-
{row.getValue("status")}
113-
</Badge>
114-
),
129+
cell: ({ row }) => <div className="capitalize">{fromNow(row.getValue("received"))}</div>,
115130
},
131+
// {
132+
// accessorKey: "status",
133+
// header: "Status",
134+
// cell: ({ row }) => (
135+
// <Badge variant="outline" className="capitalize">
136+
// {row.getValue("status")}
137+
// </Badge>
138+
// ),
139+
// },
116140
{
117141
accessorKey: "post",
118142
header: "Post",
119-
120-
cell: ({ row }) => <div className="lowercase">{row.getValue("email")}</div>,
143+
cell: ({ row }) => <div className="lowercase">{row.getValue("post")}</div>,
121144
},
122145
{
123146
accessorKey: "email",
@@ -132,23 +155,59 @@ export const columns: ColumnDef<any>[] = [
132155
cell: ({ row }) => <div className="lowercase">{row.getValue("email")}</div>,
133156
},
134157
{
135-
accessorKey: "amount",
136-
header: () => <div className="text-right">Amount</div>,
158+
accessorKey: "message",
159+
header: () => <div className="text-right">Message</div>,
137160
cell: ({ row }) => {
138-
const amount = parseFloat(row.getValue("amount"));
139-
140-
// Format the amount as a dollar amount
141-
const formatted = new Intl.NumberFormat("en-US", {
142-
style: "currency",
143-
currency: "USD",
144-
}).format(amount);
145-
146-
return <div className="text-right font-medium">{formatted}</div>;
161+
return <div className="text-right font-medium">{row.getValue("message")}</div>;
147162
},
148163
},
149164
{
150-
accessorKey: "info",
151-
header: () => <div className="text-right">Info</div>,
165+
accessorKey: "pdfs",
166+
header: () => <div className="text-right">Pdfs</div>,
167+
cell: ({ row }) => {
168+
return (
169+
<div className="text-right font-medium">
170+
{/* @ts-ignore */}
171+
{row.getValue("pdfs").map((link, index) => {
172+
const platform = Object.keys(link)[0];
173+
const url = link[platform];
174+
return (
175+
<TooltipDemo key={index} text={platform}>
176+
<Link href={url} target="_blank">
177+
<File />
178+
</Link>
179+
</TooltipDemo>
180+
);
181+
})}
182+
</div>
183+
);
184+
},
185+
},
186+
{
187+
accessorKey: "links",
188+
header: () => <div className="text-right">Links</div>,
189+
cell: ({ row }) => {
190+
return (
191+
<div className="flex gap-3 text-right font-medium">
192+
{/* @ts-ignore */}
193+
{row.getValue("links").map((link, index) => {
194+
const platform = Object.keys(link)[0];
195+
const url = link[platform];
196+
return (
197+
<Link key={index} href={url} target="_blank">
198+
<TooltipDemo text={platform}>
199+
<Link2 />
200+
</TooltipDemo>
201+
</Link>
202+
);
203+
})}
204+
</div>
205+
);
206+
},
207+
},
208+
{
209+
accessorKey: "amount",
210+
header: () => <div className="text-right">Amount</div>,
152211
cell: ({ row }) => {
153212
const amount = parseFloat(row.getValue("amount"));
154213

@@ -190,22 +249,44 @@ export const columns: ColumnDef<any>[] = [
190249
},
191250
];
192251

193-
export function RequestDataTable() {
194-
const { data: session } = useSession();
252+
export default function RequestDataTable({ data }) {
253+
console.log("data in client", data);
195254

196-
const { data: queriedData, error } = useQuery(GET_ALL_REQUESTS, {
197-
variables: {
198-
getAllRequestsId: session?.user.id,
199-
},
200-
});
201255
const [sorting, setSorting] = React.useState<SortingState>([]);
202256
const [columnFilters, setColumnFilters] = React.useState<ColumnFiltersState>([]);
203257
const [columnVisibility, setColumnVisibility] = React.useState<VisibilityState>({});
204258
const [rowSelection, setRowSelection] = React.useState({});
205259

206-
console.log("queriedData?.getAllRequests.Posts", queriedData?.getAllRequests.Posts);
260+
// console.log("queriedData?.getAllRequests.Posts", queriedData?.getAllRequests.Posts);
207261

208-
// const data = queriedData?.getAllRequests.Posts;
262+
// const data = queriedData?.getAllRequests.Posts || [];
263+
264+
// const transformArray = React.useCallback(
265+
// (originalArray) => {
266+
// const transformedArray = [];
267+
268+
// originalArray.forEach((obj) => {
269+
// obj.appliedInfo.forEach((applyInfo) => {
270+
// const transformedObj = {
271+
// id: obj.id,
272+
// received: "5 min ago", // Example value, you need to calculate actual time difference
273+
// status: "Read", // Assuming all are read
274+
// post: obj.description,
275+
// email: applyInfo.user.email,
276+
// amount: 354, // Example value, you need to determine how to calculate it
277+
// info: applyInfo.applyInfo.message,
278+
// };
279+
// transformedArray.push(transformedObj);
280+
// });
281+
// });
282+
283+
// return transformedArray;
284+
// },
285+
// [data]
286+
// );
287+
288+
// // Call the function to get the transformed array
289+
// const formattedArray = transformArray(data);
209290

210291
const table = useReactTable({
211292
data,
@@ -226,6 +307,16 @@ export function RequestDataTable() {
226307
},
227308
});
228309

310+
// console.log(
311+
// table?.getRowModel().rows.map((row) => {
312+
// console.log("row", row);
313+
// // .getVisibleCells().map((cell) => {
314+
// // console.log("cols", flexRender(cell.column.columnDef.cell, cell.getContext()));
315+
// // })
316+
// // );
317+
// })
318+
// );
319+
229320
return (
230321
<div className="w-full px-4">
231322
<div className="flex items-center py-4">

0 commit comments

Comments
 (0)