'init'
This commit is contained in:
rosetta
143
app/views/Profile/MyProfile.tsx
Normal file
143
app/views/Profile/MyProfile.tsx
Normal file
@@ -0,0 +1,143 @@
|
||||
import { ColorSwatch, Text, useComputedColorScheme } from "@mantine/core";
|
||||
import { SettingsInput } from "@/app/components/SettingsInput/SettingsInput";
|
||||
import { useState } from "react";
|
||||
import { Breadcrumbs } from "@/app/components/Breadcrumbs/Breadcrumbs";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import { InternalScreen } from "@/app/components/InternalScreen/InternalScreen";
|
||||
import { PacketUserInfo } from "@/app/providers/ProtocolProvider/protocol/packets/packet.userinfo";
|
||||
import { PacketResult, ResultCode } from "@/app/providers/ProtocolProvider/protocol/packets/packet.result";
|
||||
import { ProfileCard } from "@/app/components/ProfileCard/ProfileCard";
|
||||
import { useUserInformation } from "@/app/providers/InformationProvider/useUserInformation";
|
||||
import { OnlineState } from "@/app/providers/ProtocolProvider/protocol/packets/packet.onlinestate";
|
||||
import { usePrivateKeyHash } from "@/app/providers/AccountProvider/usePrivateKeyHash";
|
||||
import { usePublicKey } from "@/app/providers/AccountProvider/usePublicKey";
|
||||
import { useSender } from "@/app/providers/ProtocolProvider/useSender";
|
||||
import { usePacket } from "@/app/providers/ProtocolProvider/usePacket";
|
||||
import { SettingsIcon } from "@/app/components/SettingsIcon/SettingsIcon";
|
||||
import { IconBrush, IconHomeCog, IconLogout, IconRefresh } from "@tabler/icons-react";
|
||||
import { useLogout } from "@/app/providers/AccountProvider/useLogout";
|
||||
import { RosettaPower } from "@/app/components/RosettaPower/RosettaPower";
|
||||
|
||||
export function MyProfile() {
|
||||
const publicKey = usePublicKey();
|
||||
const [userInfo, updateUserInformation] = useUserInformation(publicKey);
|
||||
const privateKey = usePrivateKeyHash();
|
||||
const [title, setTitle] = useState(userInfo.title);
|
||||
const [username, setUsername] = useState(userInfo.username);
|
||||
const colorScheme = useComputedColorScheme();
|
||||
const navigate = useNavigate();
|
||||
const send = useSender();
|
||||
const logout = useLogout();
|
||||
|
||||
const saveProfileData = () => {
|
||||
let packet = new PacketUserInfo();
|
||||
packet.setUsername(username);
|
||||
packet.setTitle(title);
|
||||
packet.setPrivateKey(privateKey);
|
||||
send(packet);
|
||||
}
|
||||
usePacket(0x2, function (packet : PacketResult) {
|
||||
switch (packet.getResultCode()) {
|
||||
case ResultCode.SUCCESS:
|
||||
updateUserInformation({
|
||||
username: username,
|
||||
title: title,
|
||||
publicKey: publicKey,
|
||||
online: OnlineState.OFFLINE,
|
||||
verified: userInfo.verified
|
||||
});
|
||||
break;
|
||||
}
|
||||
}, [title, username]);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Breadcrumbs onClick={saveProfileData} text="Profile"></Breadcrumbs>
|
||||
<InternalScreen>
|
||||
<ProfileCard
|
||||
title={title}
|
||||
publicKey={publicKey}
|
||||
username={username}
|
||||
verified={userInfo.verified}
|
||||
></ProfileCard>
|
||||
<SettingsInput.Group>
|
||||
<SettingsInput.Default
|
||||
hit="Your name"
|
||||
placeholder="ex. Freddie Gibson"
|
||||
value={title}
|
||||
onChange={(e) => setTitle(e.target.value)}
|
||||
></SettingsInput.Default>
|
||||
<SettingsInput.Default
|
||||
hit="Username"
|
||||
value={username}
|
||||
placeholder="ex. freddie871"
|
||||
onChange={(e) => setUsername(e.target.value)}
|
||||
></SettingsInput.Default>
|
||||
</SettingsInput.Group>
|
||||
<SettingsInput.Copy mt={'sm'} hit="Public Key" value={
|
||||
publicKey
|
||||
} placeholder="Public"></SettingsInput.Copy>
|
||||
<Text fz={10} mt={3} c={'gray'} pl={'xs'} pr={'xs'}>
|
||||
This is your public key. If you haven't set a @username yet, you can ask a friend to message you using your public key.
|
||||
</Text>
|
||||
<SettingsInput.Clickable
|
||||
settingsIcon={
|
||||
<SettingsIcon bg="var(--mantine-color-lime-6)"
|
||||
icon={IconRefresh}>
|
||||
</SettingsIcon>
|
||||
}
|
||||
hit="Updates"
|
||||
onClick={() => navigate('/main/update')}
|
||||
mt={'sm'}
|
||||
></SettingsInput.Clickable>
|
||||
<Text fz={10} mt={3} c={'gray'} pl={'xs'} pr={'xs'}>
|
||||
You can check for new versions of the app here. Updates may include security improvements and new features.
|
||||
</Text>
|
||||
<SettingsInput.Clickable
|
||||
settingsIcon={
|
||||
<SettingsIcon bg={'indigo'}
|
||||
icon={IconBrush}>
|
||||
</SettingsIcon>
|
||||
}
|
||||
onClick={() => navigate('/main/theme')} mt={'sm'} hit="Theme" rightSection={
|
||||
<ColorSwatch color={
|
||||
colorScheme == 'light' ? '#000' : '#FFF'
|
||||
} size={20}></ColorSwatch>
|
||||
}></SettingsInput.Clickable>
|
||||
<Text fz={10} mt={3} c={'gray'} pl={'xs'} pr={'xs'}>
|
||||
You can change the theme.
|
||||
</Text>
|
||||
<SettingsInput.Clickable
|
||||
settingsIcon={
|
||||
<SettingsIcon bg="grape"
|
||||
icon={IconHomeCog}>
|
||||
</SettingsIcon>
|
||||
}
|
||||
hit="Safety"
|
||||
onClick={() => navigate('/main/safety')}
|
||||
mt={'sm'}
|
||||
></SettingsInput.Clickable>
|
||||
<Text fz={10} mt={3} c={'gray'} pl={'xs'} pr={'xs'}>
|
||||
You can learn more about your safety on the safety page,
|
||||
please make sure you are viewing the screen alone <strong>before proceeding to the safety page</strong>.
|
||||
</Text>
|
||||
<SettingsInput.Clickable
|
||||
settingsIcon={
|
||||
<SettingsIcon bg={'red'}
|
||||
icon={IconLogout}>
|
||||
</SettingsIcon>
|
||||
}
|
||||
hit={'Logout'}
|
||||
mt={'sm'}
|
||||
onClick={logout}
|
||||
rightChevronHide
|
||||
c={'red'}
|
||||
></SettingsInput.Clickable>
|
||||
<Text fz={10} mt={3} c={'gray'} pl={'xs'} pr={'xs'}>
|
||||
Logging out of your account. After logging out, you will be redirected to the password entry page.
|
||||
</Text>
|
||||
<RosettaPower mt={'lg'}></RosettaPower>
|
||||
</InternalScreen>
|
||||
</>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user