granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Update AccountModal to support MC gender

Browse source
This commit is contained in:
Justin Edmund 2022-04-10 13:25:17 -07:00
parent 483ac8512f
commit 595b4491ad
1 changed files with 23 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
components/AccountModal/index.tsx
View file

@ -36,16 +36,19 @@ const AccountModal = () => {
const [open, setOpen] = useState(false)
const [picture, setPicture] = useState('')
const [language, setLanguage] = useState('')
const [gender, setGender] = useState(0)
const [privateProfile, setPrivateProfile] = useState(false)
// Refs
const pictureSelect = React.createRef<HTMLSelectElement>()
const languageSelect = React.createRef<HTMLSelectElement>()
const genderSelect = React.createRef<HTMLSelectElement>()
const privateSelect = React.createRef<HTMLInputElement>()
useEffect(() => {
if (cookies.user) setPicture(cookies.user.picture)
if (cookies.user) setLanguage(cookies.user.language)
if (cookies.user) setGender(cookies.user.gender)
}, [cookies])
const pictureOptions = (
@ -66,6 +69,11 @@ const AccountModal = () => {
setLanguage(languageSelect.current.value)
}
function handleGenderChange(event: React.ChangeEvent<HTMLSelectElement>) {
if (genderSelect.current)
setGender(parseInt(genderSelect.current.value))
}
function handlePrivateChange(checked: boolean) {
setPrivateProfile(checked)
}
@ -78,6 +86,7 @@ const AccountModal = () => {
picture: picture,
element: pictureData.find(i => i.filename === picture)?.element,
language: language,
gender: gender,
private: privateProfile
}
}
@ -89,7 +98,8 @@ const AccountModal = () => {
const cookieObj = {
picture: user.picture.picture,
element: user.picture.element,
language: user.language,
gender: user.gender,
language: user.language
}
setCookies('user', cookieObj, { path: '/'})
@ -98,7 +108,8 @@ const AccountModal = () => {
id: user.id,
username: user.username,
picture: user.picture.picture,
element: user.picture.element
element: user.picture.element,
gender: user.gender
}
setOpen(false)
@ -157,6 +168,16 @@ const AccountModal = () => {
{pictureOptions}
</select>
</div>
<div className="field">
<div className="left">
<label>{t('modals.settings.labels.gender')}</label>
</div>
<select name="gender" onChange={handleGenderChange} value={gender} ref={genderSelect}>
<option key="gran" value="0">{t('modals.settings.gender.gran')}</option>
<option key="djeeta" value="1">{t('modals.settings.gender.djeeta')}</option>
</select>
</div>
<div className="field">
<div className="left">
<label>{t('modals.settings.labels.language')}</label>