From 24d86452d33ab69816c9ff7b4167b6e7661fb89c Mon Sep 17 00:00:00 2001 From: Konstantin Rybakov Date: Mon, 5 Aug 2024 09:07:50 +0300 Subject: [PATCH] rka-64: remove clerk (#16) --- app/add/page.tsx | 10 ++-- app/api/auth/[...nextauth]/route.ts | 4 ++ app/auth.ts | 6 +++ app/components/list/job-card.tsx | 21 ++++---- app/components/nav/auth/auth.tsx | 22 +++++++++ app/components/nav/auth/user.tsx | 34 +++++++++++++ app/components/nav/navigation.tsx | 72 ++++++++++++++-------------- app/layout.tsx | 62 +++++++++--------------- app/page.tsx | 10 ++-- bun.lockb | Bin 297024 -> 292723 bytes lib/auth/is-admin.ts | 3 -- lib/utils/is-admin.ts | 5 ++ middleware.ts | 16 ------- package.json | 2 +- 14 files changed, 151 insertions(+), 116 deletions(-) create mode 100644 app/api/auth/[...nextauth]/route.ts create mode 100644 app/auth.ts create mode 100644 app/components/nav/auth/auth.tsx create mode 100644 app/components/nav/auth/user.tsx delete mode 100644 lib/auth/is-admin.ts create mode 100644 lib/utils/is-admin.ts delete mode 100644 middleware.ts diff --git a/app/add/page.tsx b/app/add/page.tsx index af3864c..2f2efcb 100644 --- a/app/add/page.tsx +++ b/app/add/page.tsx @@ -1,18 +1,18 @@ import { Box, Heading, Section, Separator } from '@radix-ui/themes' -import { isAdmin } from '@/lib/auth/is-admin' -import { type User, currentUser } from '@clerk/nextjs/server' +import { isAdmin } from '@/lib/utils/is-admin' import { Provider } from 'jotai' import { redirect } from 'next/navigation' +import { auth } from '../auth' import { CompanyName } from './components/company/company-data' import { VariantPicker } from './components/variant/picker' import { VariantRenderer } from './components/variant/renderer' export default async function Add() { - const user = (await currentUser()) as User + const session = await auth() - if (!isAdmin(user)) { - redirect('/') + if (!isAdmin(session?.user)) { + return redirect('/') } return ( diff --git a/app/api/auth/[...nextauth]/route.ts b/app/api/auth/[...nextauth]/route.ts new file mode 100644 index 0000000..dde35f9 --- /dev/null +++ b/app/api/auth/[...nextauth]/route.ts @@ -0,0 +1,4 @@ +import { handlers } from '@/app/auth' + +export const { GET, POST } = handlers +export const runtime = 'edge' diff --git a/app/auth.ts b/app/auth.ts new file mode 100644 index 0000000..00ac13e --- /dev/null +++ b/app/auth.ts @@ -0,0 +1,6 @@ +import NextAuth from 'next-auth' +import GitHub from 'next-auth/providers/github' + +export const { handlers, signIn, signOut, auth } = NextAuth({ + providers: [GitHub], +}) diff --git a/app/components/list/job-card.tsx b/app/components/list/job-card.tsx index f91b32d..8073fc8 100644 --- a/app/components/list/job-card.tsx +++ b/app/components/list/job-card.tsx @@ -1,6 +1,7 @@ -import { isAdmin } from '@/lib/auth/is-admin' import type { QueryGetJobsResult } from '@/lib/db/queries' -import { type User, currentUser } from '@clerk/nextjs/server' + +import { auth } from '@/app/auth' +import { isAdmin } from '@/lib/utils/is-admin' import { ExternalLinkIcon } from '@radix-ui/react-icons' import { AccessibleIcon, @@ -21,12 +22,12 @@ type JobCardProps = { // TODO: design, refactor export const JobCard = async ({ job }: JobCardProps) => { - const user = (await currentUser()) as User + const session = await auth() return ( - - - + + + {job.departments.join(' > ')} @@ -48,7 +49,7 @@ export const JobCard = async ({ job }: JobCardProps) => { {job.company.name} - + {new Intl.DateTimeFormat('en-UK', { dateStyle: 'medium', @@ -56,12 +57,12 @@ export const JobCard = async ({ job }: JobCardProps) => { }).format(new Date(job.lastUpdatedAt))} - + {job.compensationSummary} - {isAdmin(user) && ( - + {isAdmin(session?.user) && ( + )} diff --git a/app/components/nav/auth/auth.tsx b/app/components/nav/auth/auth.tsx new file mode 100644 index 0000000..95d4b19 --- /dev/null +++ b/app/components/nav/auth/auth.tsx @@ -0,0 +1,22 @@ +import { auth, signIn } from '@/app/auth' +import { Button } from '@radix-ui/themes' +import { UserAuth } from './user' + +export const Auth = async () => { + const session = await auth() + + if (!session?.user) { + return ( +
{ + 'use server' + await signIn() + }} + > + +
+ ) + } + + return +} diff --git a/app/components/nav/auth/user.tsx b/app/components/nav/auth/user.tsx new file mode 100644 index 0000000..00cd991 --- /dev/null +++ b/app/components/nav/auth/user.tsx @@ -0,0 +1,34 @@ +'use client' + +import { Avatar, Button, DropdownMenu, Flex } from '@radix-ui/themes' +import type { User } from 'next-auth' +import { signOut } from 'next-auth/react' + +export const UserAuth = ({ user }: { user: User }) => { + return ( + + + + + + + { + await signOut() + }} + > + Sign out + + + + + + ) +} diff --git a/app/components/nav/navigation.tsx b/app/components/nav/navigation.tsx index cfbe4e5..748db9a 100644 --- a/app/components/nav/navigation.tsx +++ b/app/components/nav/navigation.tsx @@ -1,41 +1,43 @@ -'use client' +import { Box, Flex, Link, Reset } from '@radix-ui/themes' +import NextLink from 'next/link' -import * as NavigationMenu from '@radix-ui/react-navigation-menu' -import { Flex, Reset } from '@radix-ui/themes' -import type { Route } from 'next' -import NextLink, { type LinkProps } from 'next/link' -import { usePathname } from 'next/navigation' -import type { FC, HTMLProps } from 'react' - -const Link: FC & HTMLProps> = ({ - href, - ...props -}) => { - const pathname = usePathname() - const isActive = pathname === href - - return ( - - - - ) -} +import type {} from 'react' +import { Auth } from './auth/auth' export const Navigation = () => { return ( - - - - - - Home - - - Companies - - - - - + + +
    +
  • + + Home + +
    • +
  • + + Companies + +
    • + +
  • + +
    • +     +
+ + ) } diff --git a/app/layout.tsx b/app/layout.tsx index abd9dbf..1bc6526 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -1,14 +1,8 @@ -import { - ClerkProvider, - SignInButton, - SignedIn, - SignedOut, - UserButton, -} from '@clerk/nextjs' -import { Box, Container, Flex, Section, Theme } from '@radix-ui/themes' +import { Container, Flex, Section, Theme } from '@radix-ui/themes' import type { Metadata } from 'next' import '@radix-ui/themes/styles.css' + import { Navigation } from './components/nav/navigation' export const metadata: Metadata = { @@ -22,37 +16,25 @@ export default function RootLayout({ children: React.ReactNode }>) { return ( - - - - -
- - - - - - - - - - - - - - - -
-
- - - {children} - - -
- - - - + + + +
+ + + + + +
+
+ + + {children} + + +
+ + + ) } diff --git a/app/page.tsx b/app/page.tsx index ff760e6..2a91abd 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -1,9 +1,9 @@ -import { isAdmin } from '@/lib/auth/is-admin' import type { GetJobsFilter } from '@/lib/db/queries' -import { type User, currentUser } from '@clerk/nextjs/server' +import { isAdmin } from '@/lib/utils/is-admin' import { PlusIcon } from '@radix-ui/react-icons' import { Box, Button, Flex, Heading, Section } from '@radix-ui/themes' import Link from 'next/link' +import { auth } from './auth' import { JobList } from './components/list/job-list' import type { PageSearchParams } from './types' @@ -12,16 +12,14 @@ type HomeProps = { } export default async function Home(props: HomeProps) { - // TODO: Fix user management - // TODO: eliminate type assertion - const user = (await currentUser()) as User + const session = await auth() return ( <>
Oh! What a tracker! - {isAdmin(user) && ( + {isAdmin(session?.user) && (