feat: tabs added to profile page
This commit is contained in:
parent
22e649bf67
commit
fedc39a413
4 changed files with 33 additions and 8 deletions
|
|
@ -7,6 +7,7 @@ const clearPersistedAuthState = () => {
|
|||
localStorage.removeItem(STORAGE_KEYS.accessToken);
|
||||
localStorage.removeItem(STORAGE_KEYS.user);
|
||||
localStorage.removeItem(STORAGE_KEYS.authState);
|
||||
localStorage.removeItem(STORAGE_KEYS.lastSearchedUserUuid);
|
||||
clearAuthTokens();
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@ import { useEffect, useState } from 'react';
|
|||
import { useSearchParams } from 'react-router-dom';
|
||||
import { spacing } from '@/design/tokens/spacing';
|
||||
import { usersApi } from '@/services/usersApi';
|
||||
import { STORAGE_KEYS } from '@/utils/storage';
|
||||
import type { UserDetails } from '@/types/user';
|
||||
import UserInfoCard from '@/pages/Profile/UserInfoCard';
|
||||
import StatCardsRow from '@/pages/Profile/StatCards';
|
||||
|
|
@ -21,7 +22,14 @@ const UUID_PARAM = 'uuid';
|
|||
const Profile = () => {
|
||||
const { message } = App.useApp();
|
||||
const [searchParams, setSearchParams] = useSearchParams();
|
||||
const uuid = searchParams.get(UUID_PARAM) ?? '';
|
||||
const urlUuid = searchParams.get(UUID_PARAM) ?? '';
|
||||
// In-app navigation away and back doesn't preserve the URL's query string
|
||||
// (the sidebar links navigate to bare paths), so fall back to the last
|
||||
// searched uuid to make that behave like a reload instead of a blank page.
|
||||
const [fallbackUuid] = useState(() =>
|
||||
urlUuid ? '' : (localStorage.getItem(STORAGE_KEYS.lastSearchedUserUuid) ?? ''),
|
||||
);
|
||||
const uuid = urlUuid || fallbackUuid;
|
||||
const [result, setResult] = useState<FetchResult | null>(null);
|
||||
|
||||
const handleSearch = (value: string) => {
|
||||
|
|
@ -40,6 +48,8 @@ const Profile = () => {
|
|||
return;
|
||||
}
|
||||
|
||||
localStorage.setItem(STORAGE_KEYS.lastSearchedUserUuid, uuid);
|
||||
|
||||
usersApi
|
||||
.getUserDetails(uuid)
|
||||
.then((details) => {
|
||||
|
|
|
|||
|
|
@ -5,16 +5,29 @@ interface ProfileTabsProps {
|
|||
style?: CSSProperties;
|
||||
}
|
||||
|
||||
const TAB_DEFINITIONS = [
|
||||
{ key: 'profile', label: 'پروفایل' },
|
||||
{ key: 'billboards', label: 'بیلبوردها' },
|
||||
{ key: 'support-tickets', label: 'تیکتهای پشتیبانی' },
|
||||
{ key: 'views', label: 'بازدیدها' },
|
||||
{ key: 'withdrawals', label: 'برداشتها' },
|
||||
{ key: 'deposits', label: 'واریزها' },
|
||||
{ key: 'received-promotions', label: 'پروموشنهای دریافتی' },
|
||||
{ key: 'comments', label: 'کامنتها' },
|
||||
{ key: 'invite-friends', label: 'دعوت کردن از دوستان' },
|
||||
{ key: 'invited-by', label: 'دعوت شده توسط' },
|
||||
{ key: 'chats', label: 'چتها' },
|
||||
{ key: 'secure-payment', label: 'پرداخت امن' },
|
||||
] as const;
|
||||
|
||||
const ProfileTabs = ({ style }: ProfileTabsProps) => (
|
||||
<Tabs
|
||||
style={style}
|
||||
items={[
|
||||
{
|
||||
key: 'overview',
|
||||
label: 'جزئیات',
|
||||
children: <Empty description="جدولهای این بخش در گام بعدی اضافه خواهند شد" />,
|
||||
},
|
||||
]}
|
||||
items={TAB_DEFINITIONS.map(({ key, label }) => ({
|
||||
key,
|
||||
label,
|
||||
children: <Empty description="جدول این بخش در گام بعدی اضافه خواهد شد" />,
|
||||
}))}
|
||||
/>
|
||||
);
|
||||
|
||||
|
|
|
|||
|
|
@ -2,4 +2,5 @@ export const STORAGE_KEYS = {
|
|||
accessToken: 'winsoo_access_token',
|
||||
user: 'winsoo_user',
|
||||
authState: 'winsoo_auth_state',
|
||||
lastSearchedUserUuid: 'winsoo_last_searched_user_uuid',
|
||||
} as const;
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue