Skip to content

Commit 0122ee1

Browse files
Abh1noobAbh1noob
authored
Merge pull request #7 from CodeChefVIT/harshit/users
halla bol
2 parents 4faed24 + 0655109 commit 0122ee1

13 files changed

Lines changed: 787 additions & 241 deletions

File tree

‎src/api/fetchTeams.ts‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import { type Team } from "@/data/schema"
2+
import axios from "./axiosConfig";
3+
4+
5+
export const fetchTeams = async()=>{
6+
try{
7+
const response = await axios.get('admin/teams')
8+
console.log(response.data)
9+
return response.data as Team[];
10+
}catch(err){
11+
throw err;
12+
}
13+
}
14+
15+

‎src/api/fetchUsers.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
import { user } from "@/store/interfaces";
1+
import { type User } from "@/data/schema"
22
import axios from "./axiosConfig";
33

44

55
export const fetchUsers = async()=>{
66
try{
77
const response = await axios.get('admin/users')
88
console.log(response.data)
9-
return response.data as user[];
9+
return response.data as User[];
1010
}catch(err){
1111
throw err;
1212
}

‎src/app/teams/page.tsx‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
"use client";
2+
import { DataTable } from "@/components/table/data-table";
3+
import columns from "@/components/columns";
4+
import teamCol from "@/components/columns/TeamCol";
5+
// import { useEffect, useMemo, useState } from "react";
6+
// import { user } from "@/store/interfaces";
7+
import tooms from "@/components/dumTeams.json";
8+
// import useToast from "@/lib/toast";
9+
import { useQuery } from "@tanstack/react-query";
10+
import { type Team } from "@/data/schema";
11+
import { fetchTeams } from "@/api/fetchTeams";
12+
13+
export default function Teams() {
14+
const {
15+
data: teamList,
16+
isLoading,
17+
isError,
18+
} = useQuery({
19+
queryKey: ["teams"],
20+
queryFn: fetchTeams,
21+
});
22+
23+
if (isLoading) {
24+
<>loading...</>;
25+
}
26+
if (isError) {
27+
<>skill issue</>;
28+
}
29+
return (
30+
<>
31+
<div className="p-4">
32+
<div className="mb-4"></div>
33+
{/* <DataTableUsers users={oosers} columns={userCol} /> */}
34+
<DataTable<Team, string> columns={teamCol} data={tooms} />
35+
</div>
36+
</>
37+
);
38+
}

‎src/app/users/page.tsx‎

Lines changed: 69 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -1,69 +1,88 @@
11
"use client";
22
import { DataTable } from "@/components/table/data-table";
33
import columns from "@/components/columns";
4-
import { useEffect, useMemo, useState } from "react";
5-
import { user } from "@/store/interfaces";
4+
import userCol from "@/components/columns/UserCol";
5+
// import { useEffect, useMemo, useState } from "react";
6+
// import { user } from "@/store/interfaces";
67
import oosers from "@/components/dumUser.json";
7-
import useToast from "@/lib/toast";
8+
// import useToast from "@/lib/toast";
9+
import { useQuery } from "@tanstack/react-query";
10+
import { fetchUsers } from "@/api/fetchUsers";
11+
import { User } from "@/data/schema"
12+
813

914
export default function Users() {
10-
const { create } = useToast();
11-
const [userList, setUserList] = useState<{data: user[]} | null>(null);
12-
const [isError, setIsError] = useState<boolean>(false);
13-
const [isLoading, setIsLoading] = useState(true)
15+
// const { create } = useToast();
16+
// const [userList, setUserList] = useState<{data: user[]} | null>(null);
17+
// const [isError, setIsError] = useState<boolean>(false);
18+
// const [isLoading, setIsLoading] = useState(true)
1419

15-
useEffect(()=>{
16-
try{
17-
const transformedUsers = oosers.map(user =>({
18-
...user,
19-
is_vitian: user.is_vitian ? 'true' : 'false',
20-
team_id: user.team_id === null ? null : user.team_id,
21-
}));
22-
setUserList({data: transformedUsers as user[]});
23-
setIsLoading(false)
24-
}
25-
catch(e){
26-
setIsError(true);
27-
setIsLoading(false)
28-
}
29-
},[]);
20+
// useEffect(()=>{
21+
// try{
22+
// const transformedUsers = oosers.map(user =>({
23+
// ...user,
24+
// is_vitian: user.is_vitian ? 'true' : 'false',
25+
// team_id: user.team_id === null ? null : user.team_id,
26+
// }));
27+
// setUserList({data: transformedUsers as user[]});
28+
// setIsLoading(false)
29+
// }
30+
// catch(e){
31+
// setIsError(true);
32+
// setIsLoading(false)
33+
// }
34+
// },[]);
3035

36+
// useEffect(() => {
37+
// if (isError) {
38+
// create("Failed to fetch users", "error");
39+
// }
40+
// }, [isError, create]);
3141

32-
useEffect(() => {
33-
if (isError) {
34-
create("Failed to fetch users", "error");
35-
}
36-
}, [isError, create]);
42+
// const transformedTasks = useMemo(() => {
43+
// if (!userList?.data) return [];
44+
// return userList.data.map((user: user, index: number) => ({
45+
// id: String(index + 1),
46+
// title: user.name,
47+
// label: user.role,
48+
// status: user.is_verified ? "complete" : "incomplete",
49+
// priority: user.is_banned ? "high" : "low",
50+
// }));
51+
// }, [userList?.data]);
3752

38-
const transformedTasks = useMemo(() => {
39-
if (!userList?.data) return [];
40-
return userList.data.map((user: user, index: number) => ({
41-
id: String(index + 1),
42-
title: user.name,
43-
label: user.role,
44-
status: user.is_verified ? "complete" : "incomplete",
45-
priority: user.is_banned ? "high" : "low",
46-
}));
47-
}, [userList?.data]);
53+
// if (isLoading) {
54+
// return <>Loading...</>;
55+
// }
4856

49-
if (isLoading) {
50-
return <>Loading...</>;
51-
}
57+
// if (!userList?.data && !isError) {
58+
// return <div>No data</div>;
59+
// }
5260

53-
if (!userList?.data && !isError) {
54-
return <div>No data</div>;
55-
}
61+
// if(isError){
62+
// return <>Skill Issue</>
63+
// }
5664

57-
if(isError){
58-
return <>Skill Issue</>
59-
}
65+
const {
66+
data: userList,
67+
isLoading,
68+
isError,
69+
} = useQuery({
70+
queryKey: ["users"],
71+
queryFn: fetchUsers,
72+
});
6073

74+
if (isLoading) {
75+
<>loading...</>;
76+
}
77+
if (isError) {
78+
<>skill issue</>;
79+
}
6180

6281
return (
6382
<div className="p-4">
64-
<div className="mb-4">
65-
</div>
66-
<DataTable data={transformedTasks} columns={columns} />
83+
<div className="mb-4"></div>
84+
{/* <DataTableUsers users={oosers} columns={userCol} /> */}
85+
<DataTable<User, string> columns={userCol} data={oosers} />
6786
</div>
6887
);
69-
}
88+
}

‎src/components/columns/TeamCol.tsx‎

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
"use client";
2+
3+
import { type ColumnDef } from "@tanstack/react-table";
4+
import { Checkbox } from "@/components/ui/checkbox";
5+
import { DataTableColumnHeader } from "@/components/table/data-table-column-header";
6+
import { DataTableRowActions } from "@/components/table/data-table-row-actions";
7+
import { type Team } from "@/data/schema";
8+
9+
const columns: ColumnDef<Team>[] = [
10+
{
11+
id: "select",
12+
header: ({ table }) => (
13+
<Checkbox
14+
checked={
15+
table.getIsAllPageRowsSelected() ||
16+
(table.getIsSomePageRowsSelected() && "indeterminate")
17+
}
18+
onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}
19+
aria-label="Select all"
20+
className="translate-y-[2px]"
21+
/>
22+
),
23+
cell: ({ row }) => (
24+
<Checkbox
25+
checked={row.getIsSelected()}
26+
onCheckedChange={(value) => row.toggleSelected(!!value)}
27+
aria-label="Select row"
28+
className="translate-y-[2px]"
29+
/>
30+
),
31+
enableSorting: false,
32+
enableHiding: false,
33+
},
34+
{
35+
accessorKey: "id",
36+
header: ({ column }) => <DataTableColumnHeader column={column} title="Team ID" />,
37+
cell: ({ row }) => <div className="w-[80px]">{row.getValue("id")}</div>,
38+
},
39+
{
40+
accessorKey: "name",
41+
header: ({ column }) => <DataTableColumnHeader column={column} title="Team Name" />,
42+
cell: ({ row }) => <span>{row.getValue("name")}</span>,
43+
},
44+
{
45+
accessorKey: "number_of_people",
46+
header: ({ column }) => <DataTableColumnHeader column={column} title="Number of People" />,
47+
cell: ({ row }) => <span>{row.getValue("number_of_people")}</span>,
48+
},
49+
{
50+
accessorKey: "round_qualified",
51+
header: ({ column }) => <DataTableColumnHeader column={column} title="Round Qualified" />,
52+
cell: ({ row }) => <span>{row.getValue("round_qualified")}</span>,
53+
},
54+
{
55+
accessorKey: "code",
56+
header: ({ column }) => <DataTableColumnHeader column={column} title="Team Code" />,
57+
cell: ({ row }) => <span>{row.getValue("code")}</span>,
58+
},
59+
{
60+
id: "actions",
61+
cell: ({ row }) => <DataTableRowActions row={row} />,
62+
},
63+
];
64+
65+
export default columns;

‎src/components/columns/UserCol.tsx‎

Lines changed: 118 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,118 @@
1+
"use client";
2+
3+
import { type ColumnDef } from "@tanstack/react-table";
4+
import { Checkbox } from "@/components/ui/checkbox";
5+
import { DataTableColumnHeader } from "@/components/table/data-table-column-header";
6+
import { Badge } from "@/components/ui/badge";
7+
import { DataTableRowActions } from "@/components/table/data-table-row-actions";
8+
import { type User } from "@/data/schema"
9+
10+
11+
const columns: ColumnDef<User>[] = [
12+
{
13+
id: "select",
14+
header: ({ table }) => (
15+
<Checkbox
16+
checked={
17+
table.getIsAllPageRowsSelected() ||
18+
(table.getIsSomePageRowsSelected() && "indeterminate")
19+
}
20+
onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}
21+
aria-label="Select all"
22+
className="translate-y-[2px]"
23+
/>
24+
),
25+
cell: ({ row }) => (
26+
<Checkbox
27+
checked={row.getIsSelected()}
28+
onCheckedChange={(value) => row.toggleSelected(!!value)}
29+
aria-label="Select row"
30+
className="translate-y-[2px]"
31+
/>
32+
),
33+
enableSorting: false,
34+
enableHiding: false,
35+
},
36+
{
37+
accessorKey: "id",
38+
header: ({ column }) => <DataTableColumnHeader column={column} title="ID" />,
39+
cell: ({ row }) => <div className="w-[80px]">{row.getValue("id")}</div>,
40+
},
41+
{
42+
accessorKey: "name",
43+
header: ({ column }) => <DataTableColumnHeader column={column} title="Name" />,
44+
cell: ({ row }) => <span>{row.getValue("name")}</span>,
45+
},
46+
{
47+
accessorKey: "email",
48+
header: ({ column }) => <DataTableColumnHeader column={column} title="Email" />,
49+
cell: ({ row }) => <span>{row.getValue("email")}</span>,
50+
},
51+
{
52+
accessorKey: "team_id",
53+
header: ({ column }) => <DataTableColumnHeader column={column} title="Team ID" />,
54+
cell: ({ row }) => <span>{row.getValue("team_id")}</span>,
55+
},
56+
{
57+
accessorKey: "is_vitian",
58+
header: ({ column }) => <DataTableColumnHeader column={column} title="VITian" />,
59+
cell: ({ row }) => (
60+
<Badge variant={row.getValue("is_vitian") ? "default" : "outline"}>
61+
{row.getValue("is_vitian") ? "Yes" : "No"}
62+
</Badge>
63+
),
64+
},
65+
{
66+
accessorKey: "reg_no",
67+
header: ({ column }) => <DataTableColumnHeader column={column} title="Reg No." />,
68+
cell: ({ row }) => <span>{row.getValue("reg_no")}</span>,
69+
},
70+
{
71+
accessorKey: "phone_no",
72+
header: ({ column }) => <DataTableColumnHeader column={column} title="Phone No." />,
73+
cell: ({ row }) => <span>{row.getValue("phone_no")}</span>,
74+
},
75+
{
76+
accessorKey: "role",
77+
header: ({ column }) => <DataTableColumnHeader column={column} title="Role" />,
78+
cell: ({ row }) => <span>{row.getValue("role")}</span>,
79+
},
80+
{
81+
accessorKey: "is_leader",
82+
header: ({ column }) => <DataTableColumnHeader column={column} title="Leader" />,
83+
cell: ({ row }) => (
84+
<Badge variant={row.getValue("is_leader") ? "default" : "outline"}>
85+
{row.getValue("is_leader") ? "Yes" : "No"}
86+
</Badge>
87+
),
88+
},
89+
{
90+
accessorKey: "college",
91+
header: ({ column }) => <DataTableColumnHeader column={column} title="College" />,
92+
cell: ({ row }) => <span>{row.getValue("college")}</span>,
93+
},
94+
// {
95+
// accessorKey: "is_verified",
96+
// header: ({ column }) => <DataTableColumnHeader column={column} title="Verified" />,
97+
// cell: ({ row }) => (
98+
// <Badge variant={row.getValue("is_verified") ? "default" : "outline"}>
99+
// {row.getValue("is_verified") ? "Yes" : "No"}
100+
// </Badge>
101+
// ),
102+
// },
103+
{
104+
accessorKey: "is_banned",
105+
header: ({ column }) => <DataTableColumnHeader column={column} title="Banned" />,
106+
cell: ({ row }) => (
107+
<Badge variant={row.getValue("is_banned") ? "destructive" : "outline"}>
108+
{row.getValue("is_banned") ? "Yes" : "No"}
109+
</Badge>
110+
),
111+
},
112+
{
113+
id: "actions",
114+
cell: ({ row }) => <DataTableRowActions row={row} />,
115+
},
116+
];
117+
118+
export default columns;

0 commit comments

Comments
 (0)