104 lines
2.9 KiB
Plaintext
104 lines
2.9 KiB
Plaintext
---
|
|
import { actions, isInputError } from 'astro:actions'
|
|
|
|
import Button from '../../components/Button.astro'
|
|
import InputImageFile from '../../components/InputImageFile.astro'
|
|
import InputText from '../../components/InputText.astro'
|
|
import { karmaUnlocksById } from '../../constants/karmaUnlocks'
|
|
import MiniLayout from '../../layouts/MiniLayout.astro'
|
|
import { makeKarmaUnlockMessage } from '../../lib/karmaUnlocks'
|
|
import { makeLoginUrl } from '../../lib/redirectUrls'
|
|
|
|
const user = Astro.locals.user
|
|
if (!user) {
|
|
return Astro.redirect(makeLoginUrl(Astro.url, { message: 'Login to edit your profile' }))
|
|
}
|
|
|
|
const result = Astro.getActionResult(actions.account.update)
|
|
if (result && !result.error) {
|
|
return Astro.redirect('/account')
|
|
}
|
|
const inputErrors = isInputError(result?.error) ? result.error.fields : {}
|
|
---
|
|
|
|
<MiniLayout
|
|
pageTitle={`Edit Profile - ${user.displayName ?? user.name}`}
|
|
description="Edit your user profile"
|
|
ogImage={{ template: 'generic', title: 'Edit Profile', icon: 'ri:user-settings-line' }}
|
|
layoutHeader={{
|
|
icon: 'ri:edit-line',
|
|
title: 'Edit profile',
|
|
subtitle: 'Update your account information',
|
|
}}
|
|
breadcrumbs={[
|
|
{
|
|
name: 'Accounts',
|
|
url: '/account',
|
|
},
|
|
{
|
|
name: 'Edit profile',
|
|
},
|
|
]}
|
|
>
|
|
<form method="POST" action={actions.account.update} class="space-y-4" enctype="multipart/form-data">
|
|
<input transition:persist type="hidden" name="id" value={user.id} />
|
|
|
|
<InputText
|
|
label="Display Name"
|
|
name="displayName"
|
|
error={inputErrors.displayName}
|
|
inputProps={{
|
|
value: user.displayName,
|
|
maxlength: 100,
|
|
disabled: !user.karmaUnlocks.displayName,
|
|
}}
|
|
description={!user.karmaUnlocks.displayName
|
|
? `${makeKarmaUnlockMessage(karmaUnlocksById.displayName)} [Learn more](/karma)`
|
|
: undefined}
|
|
/>
|
|
|
|
<InputText
|
|
label="Website URL"
|
|
name="link"
|
|
error={inputErrors.link}
|
|
inputProps={{
|
|
value: user.link,
|
|
type: 'url',
|
|
placeholder: 'https://example.com',
|
|
disabled: !user.karmaUnlocks.websiteLink,
|
|
}}
|
|
description={!user.karmaUnlocks.websiteLink
|
|
? `${makeKarmaUnlockMessage(karmaUnlocksById.websiteLink)} [Learn more](/karma)`
|
|
: undefined}
|
|
/>
|
|
|
|
<InputImageFile
|
|
label="Profile Picture"
|
|
name="pictureFile"
|
|
value={user.picture}
|
|
error={inputErrors.pictureFile}
|
|
square
|
|
disabled={!user.karmaUnlocks.profilePicture}
|
|
description={!user.karmaUnlocks.profilePicture
|
|
? `${makeKarmaUnlockMessage(karmaUnlocksById.profilePicture)} [Learn more](/karma)`
|
|
: undefined}
|
|
removeCheckbox={user.picture
|
|
? {
|
|
name: 'removePicture',
|
|
label: 'Remove profile picture',
|
|
}
|
|
: undefined}
|
|
/>
|
|
|
|
<Button
|
|
type="submit"
|
|
icon="ri:save-line"
|
|
label="Save"
|
|
color="success"
|
|
shadow
|
|
size="md"
|
|
class="mt-4 w-full"
|
|
/>
|
|
</form>
|
|
</MiniLayout>
|