Update employee list to use new API
This commit is contained in:
parent
8d729de4f1
commit
c768bf43b0
36
package.json
36
package.json
|
@ -13,35 +13,35 @@
|
||||||
"@next-auth/prisma-adapter": "^1.0.7",
|
"@next-auth/prisma-adapter": "^1.0.7",
|
||||||
"@prisma/client": "^4.16.2",
|
"@prisma/client": "^4.16.2",
|
||||||
"@t3-oss/env-nextjs": "^0.3.1",
|
"@t3-oss/env-nextjs": "^0.3.1",
|
||||||
"@tanstack/react-query": "^4.32.6",
|
"@tanstack/react-query": "^4.36.1",
|
||||||
"@trpc/client": "^10.37.1",
|
"@trpc/client": "^10.45.2",
|
||||||
"@trpc/next": "^10.37.1",
|
"@trpc/next": "^10.45.2",
|
||||||
"@trpc/react-query": "^10.37.1",
|
"@trpc/react-query": "^10.45.2",
|
||||||
"@trpc/server": "^10.37.1",
|
"@trpc/server": "^10.45.2",
|
||||||
"next": "^13.4.17",
|
"next": "^13.5.6",
|
||||||
"next-auth": "^4.23.1",
|
"next-auth": "^4.24.7",
|
||||||
"react": "18.2.0",
|
"react": "18.2.0",
|
||||||
"react-dom": "18.2.0",
|
"react-dom": "18.2.0",
|
||||||
"superjson": "1.12.2",
|
"superjson": "1.12.2",
|
||||||
"zod": "^3.22.1"
|
"zod": "^3.22.4"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@types/eslint": "^8.44.2",
|
"@types/eslint": "^8.56.5",
|
||||||
"@types/node": "^18.17.5",
|
"@types/node": "^18.19.24",
|
||||||
"@types/prettier": "^2.7.3",
|
"@types/prettier": "^2.7.3",
|
||||||
"@types/react": "^18.2.20",
|
"@types/react": "^18.2.65",
|
||||||
"@types/react-dom": "^18.2.7",
|
"@types/react-dom": "^18.2.22",
|
||||||
"@typescript-eslint/eslint-plugin": "^5.62.0",
|
"@typescript-eslint/eslint-plugin": "^5.62.0",
|
||||||
"@typescript-eslint/parser": "^5.62.0",
|
"@typescript-eslint/parser": "^5.62.0",
|
||||||
"autoprefixer": "^10.4.15",
|
"autoprefixer": "^10.4.18",
|
||||||
"eslint": "^8.47.0",
|
"eslint": "^8.57.0",
|
||||||
"eslint-config-next": "^13.4.17",
|
"eslint-config-next": "^13.5.6",
|
||||||
"postcss": "^8.4.28",
|
"postcss": "^8.4.35",
|
||||||
"prettier": "^2.8.8",
|
"prettier": "^2.8.8",
|
||||||
"prettier-plugin-tailwindcss": "^0.2.8",
|
"prettier-plugin-tailwindcss": "^0.2.8",
|
||||||
"prisma": "^4.16.2",
|
"prisma": "^4.16.2",
|
||||||
"tailwindcss": "^3.3.3",
|
"tailwindcss": "^3.4.1",
|
||||||
"typescript": "^5.1.6"
|
"typescript": "^5.4.2"
|
||||||
},
|
},
|
||||||
"ct3aMetadata": {
|
"ct3aMetadata": {
|
||||||
"initVersion": "7.15.0"
|
"initVersion": "7.15.0"
|
||||||
|
|
1840
pnpm-lock.yaml
1840
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
|
@ -1,7 +1,7 @@
|
||||||
export const EmployeeDescription = (
|
export const EmployeeDescription = (
|
||||||
props: {
|
props: {
|
||||||
name: string;
|
name: string;
|
||||||
position: string;
|
position?: string;
|
||||||
} = {
|
} = {
|
||||||
name: "Title",
|
name: "Title",
|
||||||
position: "Text",
|
position: "Text",
|
||||||
|
@ -10,7 +10,7 @@ export const EmployeeDescription = (
|
||||||
return (
|
return (
|
||||||
<div className="m-3 flex max-w-xs flex-col gap-4 rounded-xl bg-white/10 p-4 text-white shadow-lg backdrop-blur-sm transition-all hover:bg-white/20 hover:shadow-2xl hover:backdrop-blur">
|
<div className="m-3 flex max-w-xs flex-col gap-4 rounded-xl bg-white/10 p-4 text-white shadow-lg backdrop-blur-sm transition-all hover:bg-white/20 hover:shadow-2xl hover:backdrop-blur">
|
||||||
<h3 className="text-2xl font-bold">{props.name}</h3>
|
<h3 className="text-2xl font-bold">{props.name}</h3>
|
||||||
<div className="text-lg">{props.position}</div>
|
{props.position ? <div className="text-lg">{props.position}</div> : <></>}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,12 +1,19 @@
|
||||||
import { useEffect, useState } from "react";
|
import { useEffect, useState } from "react";
|
||||||
import { EmployeeDescription } from "~/components/EmployeeDescription";
|
import { EmployeeDescription } from "~/components/EmployeeDescription";
|
||||||
|
|
||||||
|
interface IEmployee {
|
||||||
|
id: number;
|
||||||
|
displayName: string;
|
||||||
|
position: string;
|
||||||
|
tokenContainerId: number;
|
||||||
|
}
|
||||||
|
|
||||||
export const EmployeeList = () => {
|
export const EmployeeList = () => {
|
||||||
const [employees, setEmployees] = useState({} as Record<string, string>);
|
const [employees, setEmployees] = useState([] as IEmployee[]);
|
||||||
const [loaded, setLoaded] = useState(false);
|
const [loaded, setLoaded] = useState(false);
|
||||||
|
|
||||||
const getEmployees = () => {
|
const getEmployees = () => {
|
||||||
fetch("https://xnl.hri7566.info/employment/", {
|
fetch("https://xnl.hri7566.info/api/employment", {
|
||||||
next: {
|
next: {
|
||||||
revalidate: 60,
|
revalidate: 60,
|
||||||
},
|
},
|
||||||
|
@ -14,10 +21,16 @@ export const EmployeeList = () => {
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
res
|
res
|
||||||
.json()
|
.json()
|
||||||
.then((j) => {
|
.then(
|
||||||
setEmployees(j as Record<string, string>);
|
(j: {
|
||||||
|
type: "employment";
|
||||||
|
count: number;
|
||||||
|
employees: IEmployee[];
|
||||||
|
}) => {
|
||||||
|
setEmployees(j.employees);
|
||||||
setLoaded(true);
|
setLoaded(true);
|
||||||
})
|
}
|
||||||
|
)
|
||||||
.catch((err) => console.error(err));
|
.catch((err) => console.error(err));
|
||||||
})
|
})
|
||||||
.catch((err) => console.error(err));
|
.catch((err) => console.error(err));
|
||||||
|
@ -31,13 +44,13 @@ export const EmployeeList = () => {
|
||||||
<>
|
<>
|
||||||
{/* <EmployeeDescription name="Test" position="test" /> */}
|
{/* <EmployeeDescription name="Test" position="test" /> */}
|
||||||
{loaded ? (
|
{loaded ? (
|
||||||
Object.keys(employees)
|
employees
|
||||||
.sort()
|
.sort()
|
||||||
.map((k) => (
|
.map((e) => (
|
||||||
<EmployeeDescription
|
<EmployeeDescription
|
||||||
name={k}
|
name={e.displayName}
|
||||||
position={employees[k] || "<no position>"}
|
position={e.position || "<no position>"}
|
||||||
key={Object.keys(employees).indexOf(k)}
|
key={e.id}
|
||||||
/>
|
/>
|
||||||
))
|
))
|
||||||
) : (
|
) : (
|
||||||
|
|
Loading…
Reference in New Issue