From 3be476ad13c26590f3db5948b7e8db4c4889fdb6 Mon Sep 17 00:00:00 2001
From: kyuuseiryuu <kyuuseiryuu@gmail.com>
Date: Wed, 18 Mar 2026 01:59:21 +0900
Subject: [PATCH] feat(UserCenter): add background change functionality

This commit introduces a new `ChangeBackground` component into the User Center page.
The component is now rendered before the main content to dynamically update the
background based on the user's picture URL.

- Added import for `ChangeBackground` component.
- Integrated `ChangeBackground` with the user's picture URL (falling back to empty string if unavailable).
- No breaking changes or migration required.
---
 src/page/UserCenter.tsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/page/UserCenter.tsx b/src/page/UserCenter.tsx
index 6f4a22b..884f36b 100644
--- a/src/page/UserCenter.tsx
+++ b/src/page/UserCenter.tsx
@@ -8,6 +8,7 @@ import useAutoLogin from "../hooks/useAutoLogin";
 import { LOGTO_DOMAIN } from "../utils/common";
 import { useAppVersion } from "../hooks/useAppVersion";
 import { BindKaiqiuAccount } from "../components/BindKaiqiuAccount";
+import { ChangeBackground } from "../components/ChangeBackground";
 
 enum modifyRoutes {
   username = '/account/username',
@@ -77,6 +78,7 @@ export const UserCenter = () => {
   }
   return (
     <>
+      <ChangeBackground url={user?.picture ?? ''} />
       <Flex className="app" gap={12} vertical align="center" style={{ maxWidth: 600 }}>
         <Avatar size={128} src={user?.picture ?? user?.name} />
         <Flex>