Refactor account page structure and update UI
- Move user settings form to dedicated /account/settings route - Update PageHeader icon from Settings to AccountCircle for clarity - Update debug log labels in auth config for better readability 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
33
app/[locale]/account/settings/page.tsx
Normal file
33
app/[locale]/account/settings/page.tsx
Normal file
@@ -0,0 +1,33 @@
|
||||
import { FC, Suspense } from 'react';
|
||||
import { Main } from '@/app/ui/Main';
|
||||
import { UserSettingsForm as UserSettingsForm, UserSettingsFormSkeleton } from '@/app/ui/UserSettingsForm';
|
||||
import { getUserSettings } from '@/app/lib/actions/userSettingsActions';
|
||||
|
||||
const UserSettingsPage: FC = async () => {
|
||||
const userSettings = await getUserSettings();
|
||||
|
||||
return (
|
||||
<Main>
|
||||
<div className="flex flex-col items-center">
|
||||
<UserSettingsForm userSettings={userSettings} />
|
||||
</div>
|
||||
</Main>
|
||||
);
|
||||
};
|
||||
|
||||
const Page: FC = () => {
|
||||
return (
|
||||
<Suspense fallback={
|
||||
<Main>
|
||||
<div className="flex flex-col items-center">
|
||||
<div className="h-8 w-48 skeleton mb-4"></div>
|
||||
<UserSettingsFormSkeleton />
|
||||
</div>
|
||||
</Main>
|
||||
}>
|
||||
<UserSettingsPage />
|
||||
</Suspense>
|
||||
);
|
||||
};
|
||||
|
||||
export default Page;
|
||||
@@ -35,8 +35,8 @@ export const authConfig: NextAuthConfig = {
|
||||
// see: https://stackoverflow.com/questions/70409219/get-user-id-from-session-in-next-auth-client
|
||||
jwt({ token, account, user }) {
|
||||
if (account) {
|
||||
// console.log("(jwt) account:", account);
|
||||
// console.log("(jwt) user:", user);
|
||||
// console.log("(JWT) account:", account);
|
||||
// console.log("(JWT) user:", user);
|
||||
token.accessToken = account.access_token;
|
||||
// attach Google account ID to the token
|
||||
token.piggyback_providerAccountId = account.providerAccountId;
|
||||
@@ -51,7 +51,7 @@ export const authConfig: NextAuthConfig = {
|
||||
if(session.user && token) {
|
||||
// assign Google account ID from the token to the Session user ID
|
||||
session.user.id = token.piggyback_providerAccountId;
|
||||
// console.log("(jwt) token:", token);
|
||||
// console.log("(SESSION) token:", token);
|
||||
}
|
||||
return session;
|
||||
},
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import Image from "next/image";
|
||||
import Link from "next/link";
|
||||
import { SelectLanguage } from "./SelectLanguage";
|
||||
import Settings from "@mui/icons-material/Settings";
|
||||
import AccountCircle from "@mui/icons-material/AccountCircle";
|
||||
|
||||
export const PageHeader = () =>
|
||||
<div className="navbar bg-base-100 mb-6">
|
||||
@@ -9,6 +9,6 @@ export const PageHeader = () =>
|
||||
<span className="grow"> </span>
|
||||
<SelectLanguage />
|
||||
<Link href="/account/" className="btn btn-ghost btn-circle">
|
||||
<Settings className="w-6 h-6" />
|
||||
<AccountCircle />
|
||||
</Link>
|
||||
</div>
|
||||
Reference in New Issue
Block a user