From d34eaa96638c3ee21348d9cd35bfdab463d3d98a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tommy=20Barv=C3=A5g?= Date: Thu, 23 Mar 2023 14:51:59 +0100 Subject: [PATCH] Added loading skeletons to RSC and expanded profile page with salary and setting sections --- app/(auth)/login/page.tsx | 19 +--- app/api-v2/user/route.ts | 7 +- app/api-v2/user/work-day-detail/route.ts | 4 +- app/dashboard/_components/calendar-year.tsx | 9 +- app/dashboard/_components/footer.tsx | 7 +- app/dashboard/_components/next-paycheck.tsx | 19 +++- app/dashboard/layout.tsx | 4 +- app/dashboard/profile/layout.tsx | 20 +++++ app/dashboard/profile/page.tsx | 22 ++--- app/dashboard/profile/salary/page.tsx | 24 +++++ app/dashboard/profile/settings/page.tsx | 22 +++++ components/auth/login-button.tsx | 19 ++-- components/auth/login-page-content.tsx | 38 ++++++++ components/icons.tsx | 2 +- components/tab-navigation.tsx | 40 +++++++++ components/theme-provider.tsx | 10 +-- components/ui/avatar.tsx | 47 ++++++++++ components/ui/button.tsx | 25 ++++-- components/ui/card.tsx | 33 ++++--- components/ui/checkbox.tsx | 4 +- components/ui/dialog.tsx | 28 +++--- components/ui/hover-card.tsx | 4 +- components/ui/info-button.tsx | 4 +- components/ui/input.tsx | 4 +- components/ui/label.tsx | 4 +- components/ui/popover.tsx | 8 +- components/ui/select.tsx | 20 ++--- components/ui/separator.tsx | 4 +- components/ui/skeleton.tsx | 6 +- components/ui/tabs.tsx | 55 ++++++++++++ components/ui/toast.tsx | 24 ++--- components/ui/toaster.tsx | 4 +- components/user/user-avatar.tsx | 19 ++-- .../user/user-edit-salary-details-dialog.tsx | 8 +- .../user/user-edit-work-day-detail-dialog.tsx | 2 +- components/user/user-salary-details-form.tsx | 65 +++++++++++--- components/user/user-settings-form.tsx | 39 +++++--- components/user/user-work-day-detail-form.tsx | 34 ++++--- hooks/use-toast.ts | 6 +- lib/planetscale-edge.ts | 4 + lib/user.ts | 47 ++++++---- lib/utils.ts | 14 +-- package.json | 6 +- pnpm-lock.yaml | 90 +++++++++++++------ prettier.config.js | 59 ++++++------ types/index.d.ts | 4 +- utils/common-utils.ts | 15 ++++ utils/date-utils.ts | 4 +- 48 files changed, 679 insertions(+), 277 deletions(-) create mode 100644 app/dashboard/profile/layout.tsx create mode 100644 app/dashboard/profile/salary/page.tsx create mode 100644 app/dashboard/profile/settings/page.tsx create mode 100644 components/auth/login-page-content.tsx create mode 100644 components/tab-navigation.tsx create mode 100644 components/ui/avatar.tsx create mode 100644 components/ui/tabs.tsx diff --git a/app/(auth)/login/page.tsx b/app/(auth)/login/page.tsx index 521d52f..f87b2f7 100644 --- a/app/(auth)/login/page.tsx +++ b/app/(auth)/login/page.tsx @@ -1,5 +1,4 @@ -import { LoginButton } from "@/components/auth/login-button"; -import { Icons } from "@/components/icons"; +import LoginPageContent from "@/components/auth/login-page-content"; import { Metadata } from "next"; export const metadata: Metadata = { @@ -8,19 +7,5 @@ export const metadata: Metadata = { }; export default function LoginPage() { - return ( -
-
-
- -

Welcome back

-

- Click to login with your Knowit AD account. -

-
-
- -
-
- ); + return ; } diff --git a/app/api-v2/user/route.ts b/app/api-v2/user/route.ts index a7aede0..2366b9f 100644 --- a/app/api-v2/user/route.ts +++ b/app/api-v2/user/route.ts @@ -1,5 +1,6 @@ import { planetscaleEdge } from "@/lib/planetscale-edge"; import { getEdgeFriendlyToken } from "@/lib/token"; +import { createUser } from "@/lib/user"; import { NextResponse } from "next/server"; export const runtime = "edge"; @@ -22,7 +23,11 @@ export async function GET(request: Request) { try { const { rows } = await planetscaleEdge.execute("SELECT * FROM user", []); - return NextResponse.json(rows); + const users = rows + .map(row => createUser(row)) + .sort((a, b) => new Date(b.updated).getTime() - new Date(a.updated).getTime()); + + return NextResponse.json(users); } catch (error) { return new Response(error, { status: 422 diff --git a/app/api-v2/user/work-day-detail/route.ts b/app/api-v2/user/work-day-detail/route.ts index 9166e41..d6c5e25 100644 --- a/app/api-v2/user/work-day-detail/route.ts +++ b/app/api-v2/user/work-day-detail/route.ts @@ -48,8 +48,8 @@ export async function PATCH(request: NextRequest) { "UPDATE user_work_day_detail SET nonCommissionedHours = ?, extraHours = ?, sickDay = ? WHERE id = ?", [nonCommissionedHours, extraHours, sickDay, +existing.id] ); - // create - } else { + // create if extra hours or non commissioned hours are greater than 0 + } else if (extraHours > 0 || nonCommissionedHours > 0) { await planetscaleEdge.execute( "INSERT INTO user_work_day_detail (userId, date, nonCommissionedHours, extraHours, sickDay) VALUES (?, ?, ?, ?, ?)", [+token.id, date, nonCommissionedHours, extraHours, sickDay] diff --git a/app/dashboard/_components/calendar-year.tsx b/app/dashboard/_components/calendar-year.tsx index a02a796..5ff1a09 100644 --- a/app/dashboard/_components/calendar-year.tsx +++ b/app/dashboard/_components/calendar-year.tsx @@ -1,13 +1,12 @@ +import { buttonVariants } from "@/components/ui/button"; +import { getRequestDateNow } from "@/lib/date"; +import { cn } from "@/lib/utils"; +import { UserWorkDayDetail } from "@/types"; import { getCalendarYear } from "@/utils/calendar-utils"; import { ChevronLeftIcon, ChevronRightIcon } from "@radix-ui/react-icons"; import { getYear } from "date-fns"; import Link from "next/link"; import * as React from "react"; - -import { buttonVariants } from "@/components/ui/button"; -import { getRequestDateNow } from "@/lib/date"; -import { cn } from "@/lib/utils"; -import { UserWorkDayDetail } from "@/types"; import { CalendarMonth } from "./calendar-month"; const CalendarYear: React.FC<{ date: Date; workDayDetails?: UserWorkDayDetail[] }> = ({ diff --git a/app/dashboard/_components/footer.tsx b/app/dashboard/_components/footer.tsx index cdcf98f..ea1cb9f 100644 --- a/app/dashboard/_components/footer.tsx +++ b/app/dashboard/_components/footer.tsx @@ -7,8 +7,11 @@ import Link from "@/components/ui/link"; export default function Footer() { return (