diff --git a/src/app/(drift)/(auth)/components/index.tsx b/src/app/(drift)/(auth)/components/index.tsx index e8944da5..6bfcafb6 100644 --- a/src/app/(drift)/(auth)/components/index.tsx +++ b/src/app/(drift)/(auth)/components/index.tsx @@ -6,7 +6,7 @@ import Link from "../../../components/link" import { signIn } from "next-auth/react" import Input from "@components/input" import Button from "@components/button" -import { Key } from "react-feather" +import { GitHub, Key, User } from "react-feather" import { useToasts } from "@components/toasts" import { useRouter } from "next/navigation" import Note from "@components/note" @@ -146,7 +146,7 @@ function Auth({ style={{ color: "var(--fg)" }} - iconLeft={} + iconLeft={getProviderIcon(provider.id)} onClick={(e) => { e.preventDefault() signIn(provider.id, { @@ -186,3 +186,14 @@ function Auth({ } export default Auth + +const getProviderIcon = (provider: string) => { + switch (provider) { + case "github": + return + case "keycloak": + return + default: + return + } +} diff --git a/src/app/components/badges/created-ago-badge/index.tsx b/src/app/components/badges/created-ago-badge/index.tsx index 2237eed6..735c1198 100644 --- a/src/app/components/badges/created-ago-badge/index.tsx +++ b/src/app/components/badges/created-ago-badge/index.tsx @@ -7,7 +7,7 @@ import { useMemo, useState, useEffect } from "react" import Badge from "../badge" const CreatedAgoBadge = ({ createdAt }: { createdAt: string | Date }) => { - const createdDate = useMemo(() => new Date(createdAt), [createdAt]) + const createdDate = new Date(createdAt) const [time, setTimeAgo] = useState(timeAgo(createdDate)) const { setToast } = useToasts() diff --git a/src/app/components/badges/expiration-badge/index.tsx b/src/app/components/badges/expiration-badge/index.tsx index 97944a7f..dcd8f815 100644 --- a/src/app/components/badges/expiration-badge/index.tsx +++ b/src/app/components/badges/expiration-badge/index.tsx @@ -36,16 +36,11 @@ const ExpirationBadge = ({ } }, [expirationDate]) - const isExpired = useMemo(() => { - if (!expirationDate) { - return false - } - return expirationDate < new Date() - }, [expirationDate]) - if (!expirationDate) { return null } + + const isExpired = expirationDate < new Date() return ( diff --git a/src/app/components/header/buttons.tsx b/src/app/components/header/buttons.tsx index 429414f2..16c172b0 100644 --- a/src/app/components/header/buttons.tsx +++ b/src/app/components/header/buttons.tsx @@ -1,6 +1,6 @@ "use client" -import { useSelectedLayoutSegment } from "next/navigation" +import { useSelectedLayoutSegment, useSelectedLayoutSegments } from "next/navigation" import FadeIn from "@components/fade-in" import { setDriftTheme } from "src/app/lib/set-theme" import { @@ -40,27 +40,23 @@ type Tab = { export function HeaderButtons({ isAuthenticated, - theme + theme: initialTheme }: { isAuthenticated: boolean theme: string }) { const { isAdmin, userId } = useSessionSWR() - - return ( - <> - {getButtons({ + const { resolvedTheme } = useTheme(); + return getButtons({ isAuthenticated, - theme, + theme: resolvedTheme ? resolvedTheme : initialTheme, isAdmin, userId - })} - - ) + }) } function NavButton(tab: Tab) { - const segment = useSelectedLayoutSegment() + const segment = useSelectedLayoutSegments().slice(-1)[0] const isActive = segment === tab.value.toLowerCase() const activeStyle = isActive ? styles.active : undefined if (tab.onClick) { diff --git a/src/app/lib/set-theme.ts b/src/app/lib/set-theme.ts index 7afbe193..d9831a83 100644 --- a/src/app/lib/set-theme.ts +++ b/src/app/lib/set-theme.ts @@ -1,8 +1,9 @@ import { THEME_COOKIE } from "@lib/constants" import { Cookies } from "react-cookie" +const cookies = new Cookies() + export function setDriftTheme(theme: string, setter: (theme: string) => void) { setter(theme) - const cookies = new Cookies() cookies.set(THEME_COOKIE, theme, { path: "/" }) } diff --git a/src/lib/server/auth.ts b/src/lib/server/auth.ts index c54b6254..7a6f102b 100644 --- a/src/lib/server/auth.ts +++ b/src/lib/server/auth.ts @@ -36,6 +36,7 @@ const credentialsOptions = () => { return options } + const providers = () => { const providers = [] @@ -71,15 +72,16 @@ const providers = () => { } }) const originalKeycloakProfile = keycloak.profile - ;(keycloak.profile = async (profile, tokens) => { + keycloak.profile = async (profile, tokens) => { const originalProfile = await originalKeycloakProfile(profile, tokens) const newProfile: User & { displayName?: string | null } = { ...originalProfile, displayName: originalProfile.name ?? null } return newProfile - }), - providers.push(keycloak) + } + + providers.push(keycloak) } if (isCredentialEnabled()) {