gib/Tech_Tracker_Web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI changes

Browse Source
This commit is contained in:
Gabriel Brown
2024-07-23 23:46:27 -05:00
parent 03551be949
commit 0a29b9f3c8
9 changed files with 3715 additions and 4488 deletions
Download Patch File Download Diff File Expand all files Collapse all files

0
.prod/update.sh Normal file → Executable file
View File

12
package.json
View File

@@ -43,7 +43,7 @@
"next-themes": "^0.3.0",
"pm2": "^5.4.2",
"react": "^18.3.1",
"react-day-picker": "^9.0.2",
"react-day-picker": "^9.0.3",
"react-dom": "^18.3.1",
"react-hook-form": "^7.52.1",
"server-only": "^0.0.1",
@@ -55,12 +55,12 @@
"zod": "^3.23.8"
},
"devDependencies": {
"@types/eslint": "^8.56.10",
"@types/node": "^20.14.11",
"@types/eslint": "^8.56.11",
"@types/node": "^20.14.12",
"@types/react": "^18.3.3",
"@types/react-dom": "^18.3.0",
"@typescript-eslint/eslint-plugin": "^7.16.1",
"@typescript-eslint/parser": "^7.16.1",
"@typescript-eslint/eslint-plugin": "^7.17.0",
"@typescript-eslint/parser": "^7.17.0",
"drizzle-kit": "^0.21.4",
"eslint": "^8.57.0",
"eslint-config-next": "^14.2.5",
@@ -69,7 +69,7 @@
"prettier": "^3.3.3",
"prettier-plugin-tailwindcss": "^0.6.5",
"tailwindcss": "^3.4.6",
"typescript": "^5.5.3"
"typescript": "^5.5.4"
},
"ct3aMetadata": {
"initVersion": "7.36.1"

7987
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff

BIN
public/images/tech_tracker_appicon.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 472 KiB

After

Width:  |  Height:  |  Size: 98 KiB

42
src/components/auth/client/Sign_Out.tsx
View File

@@ -1,7 +1,14 @@
import { signOut } from "next-auth/react";
import { useSession } from "next-auth/react";
import Image from "next/image";
import { Button } from "~/components/ui/shadcn/button";
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuLabel,
DropdownMenuItem,
DropdownMenuSeparator,
DropdownMenuTrigger,
} from "~/components/ui/shadcn/dropdown-menu";
export default function Sign_Out() {
const { data: session } = useSession();
@@ -9,17 +16,30 @@ export default function Sign_Out() {
return <div/>;
} else {
const pfp = session?.user?.image ? session.user.image : "/images/default_user_pfp.png";
const name = session?.user?.name ? session.user.name : "Profile";
return (
<div className="flex flex-row">
<Image src={pfp} alt="" width={35} height={35}
className="rounded-full border-2 border-white m-auto mr-1 md:mr-2
max-w-[25px] md:max-w-[35px]"
/>
<Button onClick={() => signOut()} variant="secondary"
className="w-full p-2 rounded-xl text-sm md:text-lg"
>
Sign Out
</Button>
<div className="m-auto mt-1">
<DropdownMenu>
<DropdownMenuTrigger>
<Image src={pfp} alt="" width={35} height={35}
className="rounded-full border-2 border-white m-auto mr-1 md:mr-2
max-w-[25px] md:max-w-[35px]"
/>
</DropdownMenuTrigger>
<DropdownMenuContent>
<DropdownMenuLabel>
{name}
</DropdownMenuLabel>
<DropdownMenuSeparator />
<DropdownMenuItem>
<button onClick={() => signOut()}
className="w-full"
>
Sign Out
</button>
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</div>
);
}

123
src/components/ui/History_Drawer.tsx
View File

@@ -1,4 +1,7 @@
import Image from "next/image";
import {
Drawer,
DrawerTrigger,
DrawerClose,
DrawerContent,
DrawerFooter,
@@ -22,66 +25,68 @@ import {
PaginationNext,
PaginationPrevious,
} from "~/components/ui/shadcn/pagination";
//import { Button } from "~/components/ui/shadcn/button";
import Image from "next/image";
export default function History_Drawer() {
//const
return (
<DrawerContent>
<DrawerHeader>
<DrawerTitle>
<div className="flex flex-row items-center text-center
sm:justify-center sm:ml-0 py-4">
<Image src="/images/tech_tracker_logo.png"
alt="Tech Tracker Logo" width={60} height={60}
className="max-w-[40px] md:max-w-[120px]"
/>
<h1 className="title-text text-sm md:text-2xl lg:text-6xl
bg-gradient-to-r from-[#bec8e6] via-[#F0EEE4] to-[#FFF8E7]
font-bold pl-2 md:pl-4 text-transparent bg-clip-text">
History
</h1>
</div>
</DrawerTitle>
</DrawerHeader>
<Table className="w-5/6 lg:w-1/2 m-auto"
>
<TableHeader>
<TableRow>
<TableHead className="">Name</TableHead>
<TableHead>Status</TableHead>
<TableHead>Updated At</TableHead>
</TableRow>
</TableHeader>
<TableBody>
<TableRow>
<TableCell className="font-medium">INV001</TableCell>
<TableCell>Paid</TableCell>
<TableCell>Credit Card</TableCell>
</TableRow>
</TableBody>
</Table>
<DrawerFooter>
<Pagination>
<PaginationContent>
<PaginationItem>
<PaginationPrevious href="#" />
</PaginationItem>
<PaginationItem>
<PaginationLink href="#">1</PaginationLink>
</PaginationItem>
<PaginationItem>
<PaginationEllipsis />
</PaginationItem>
<PaginationItem>
<PaginationNext href="#" />
</PaginationItem>
</PaginationContent>
</Pagination>
<DrawerClose>
</DrawerClose>
</DrawerFooter>
</DrawerContent>
);
<Drawer>
<DrawerTrigger>
Status
</DrawerTrigger>
<DrawerContent>
<DrawerHeader>
<DrawerTitle>
<div className="flex flex-row items-center text-center
sm:justify-center sm:ml-0 py-4">
<Image src="/images/tech_tracker_logo.png"
alt="Tech Tracker Logo" width={60} height={60}
className="max-w-[40px] md:max-w-[120px]"
/>
<h1 className="title-text text-sm md:text-2xl lg:text-6xl
bg-gradient-to-r from-[#bec8e6] via-[#F0EEE4] to-[#FFF8E7]
font-bold pl-2 md:pl-4 text-transparent bg-clip-text">
History
</h1>
</div>
</DrawerTitle>
</DrawerHeader>
<Table className="w-5/6 lg:w-1/2 m-auto"
>
<TableHeader>
<TableRow>
<TableHead className="">Name</TableHead>
<TableHead>Status</TableHead>
<TableHead>Updated At</TableHead>
</TableRow>
</TableHeader>
<TableBody>
<TableRow>
<TableCell className="font-medium">INV001</TableCell>
<TableCell>Paid</TableCell>
<TableCell>Credit Card</TableCell>
</TableRow>
</TableBody>
</Table>
<DrawerFooter>
<Pagination>
<PaginationContent>
<PaginationItem>
<PaginationPrevious href="#" />
</PaginationItem>
<PaginationItem>
<PaginationLink href="#">1</PaginationLink>
</PaginationItem>
<PaginationItem>
<PaginationEllipsis />
</PaginationItem>
<PaginationItem>
<PaginationNext href="#" />
</PaginationItem>
</PaginationContent>
</Pagination>
<DrawerClose>
</DrawerClose>
</DrawerFooter>
</DrawerContent>
</Drawer>
);
};

29
src/components/ui/No_Session.tsx
View File

@@ -7,31 +7,24 @@ export default function No_Session() {
return (
<main className="w-full min-h-screen mx-auto text-center pt-2 md:pt-10
bg-gradient-to-b from-[#111111] to-[#212325]">
<div className="w-2/3 pt-4 pb-2 md:pt-8 md:pb-4 m-auto">
<div className="md:w-2/3 pt-4 pb-2 md:pt-10 md:pb-4 m-auto">
< Header />
</div>
< Sign_In />
<div className="w-5/6 mx-auto flex flex-col">
<h3 className="text-center text-[16px] md:text-lg italic pt-4">
You must have a Gulfport Microsoft 365 Account to sign in.
</h3>
<Link href="https://authjs.dev/getting-started/providers/microsoft-entra-id"
className="text-center text-[16px] md:text-lg italic pt-4 pb-4 text-sky-200
hover:text-sky-300"
>
Tech Tracker uses Auth.js and Microsoft Entra ID for Authentication
</Link>
<div className="mx-auto flex flex-col">
<div className="py-4">
< Sign_In />
</div>
<Link href="https://git.gibbyb.com/gib/Tech_Tracker_Web"
className="text-center text-[16px] md:text-lg px-4 py-2 md:py-2.5 font-semibold
bg-gradient-to-tl from-[#35363F] to=[#24191A] rounded-xl hover:text-sky-200
hover:bg-gradient-to-tr hover:from-[#35363F] hover:to-[#23242F]
mx-auto flex flex-row mt-4"
mx-auto flex flex-row"
>
<Image src="/images/gitea_logo.svg" alt="Gitea" width={35} height={35}
className="mr-2"
/>
<h3 className="my-auto">View Source Code</h3>
</Link>
<Image src="/images/gitea_logo.svg" alt="Gitea" width={35} height={35}
className="mr-2"
/>
<h3 className="my-auto">Source Code</h3>
</Link>
</div>
</main>
);

6
src/components/ui/Tech_Table.tsx
View File

@@ -3,7 +3,6 @@ import { useState, useEffect, useCallback } from 'react';
import { useSession } from "next-auth/react";
import Loading from "~/components/ui/Loading";
import { useTVMode } from "~/components/context/TVModeContext";
import { Drawer, DrawerTrigger } from "~/components/ui/shadcn/drawer";
import History_Drawer from "~/components/ui/History_Drawer";
type Employee = {
@@ -168,10 +167,7 @@ export default function Tech_Table({ employees }: { employees: Employee[] }) {
)}
<th className="border border-[#3e4446] py-3">Name</th>
<th className="border border-[#3e4446] py-3">
<Drawer>
<DrawerTrigger>Status</DrawerTrigger>
<History_Drawer />
</Drawer>
<History_Drawer />
</th>
<th className="border border-[#3e4446] py-3">Updated At</th>
</tr>

4
src/styles/globals.css
View File

@@ -122,7 +122,7 @@
.content-fullscreen {
width: 90vw;
height: 90vh;
height: 80vh;
margin: auto;
}
@@ -132,5 +132,5 @@
}
.tablefill {
height: 5vh;
height: 10vh;
}