68 lines
1.8 KiB
TypeScript
68 lines
1.8 KiB
TypeScript
|
|
|
|
import { ConnectedAccountsPanel } from '@/components/profile/ConnectedAccountsPanel';
|
|
import { PreferencesPanel } from '@/components/profile/PreferencesPanel';
|
|
import { ProfileDetailsPanel } from '@/components/profile/ProfileDetailsPanel';
|
|
import type { ProfileViewData } from '@/lib/view-data/ProfileViewData';
|
|
import { Box } from '@/ui/Box';
|
|
import { Button } from '@/ui/Button';
|
|
import { Heading } from '@/ui/Heading';
|
|
import { Stack } from '@/ui/Stack';
|
|
|
|
interface ProfileSettingsTemplateProps {
|
|
viewData: ProfileViewData;
|
|
bio: string;
|
|
country: string;
|
|
onBioChange: (bio: string) => void;
|
|
onCountryChange: (country: string) => void;
|
|
onSave: () => void;
|
|
}
|
|
|
|
export function ProfileSettingsTemplate({
|
|
viewData,
|
|
bio,
|
|
country,
|
|
onBioChange,
|
|
onCountryChange,
|
|
onSave
|
|
}: ProfileSettingsTemplateProps) {
|
|
return (
|
|
<Stack gap={8}>
|
|
<Box as="header">
|
|
<Stack direction="row" justify="between" align="center">
|
|
<Heading level={1}>Settings</Heading>
|
|
<Button variant="primary" onClick={onSave}>Save Changes</Button>
|
|
</Stack>
|
|
</Box>
|
|
|
|
<ProfileDetailsPanel
|
|
driver={{
|
|
name: viewData.driver.name,
|
|
country: country,
|
|
bio: bio
|
|
}}
|
|
isEditing
|
|
onUpdate={(updates) => {
|
|
if (updates.bio !== undefined) onBioChange(updates.bio);
|
|
if (updates.country !== undefined) onCountryChange(updates.country);
|
|
}}
|
|
/>
|
|
|
|
<ConnectedAccountsPanel
|
|
iracingId={viewData.driver.iracingId || undefined}
|
|
/>
|
|
|
|
<PreferencesPanel
|
|
preferences={{
|
|
favoriteCarClass: 'GT3',
|
|
favoriteSeries: 'Endurance',
|
|
competitiveLevel: 'competitive',
|
|
showProfile: true,
|
|
showHistory: true
|
|
}}
|
|
isEditing
|
|
/>
|
|
</Stack>
|
|
);
|
|
}
|