webapp/src/components/Nav/ProfileModal.tsx

45 lines
1.1 KiB
TypeScript
Raw Normal View History

2022-09-09 11:53:35 +00:00
import { AuthorCard } from '../Author/Card'
import type { Author } from '../../graphql/types.gen'
import { t } from '../../utils/intl'
import { hideModal } from '../../stores/ui'
2022-09-30 14:22:33 +00:00
import { useAuthStore, signOut } from '../../stores/auth'
2022-10-31 16:40:55 +00:00
import { createMemo, For } from 'solid-js'
2022-09-09 11:53:35 +00:00
const quit = () => {
signOut()
hideModal()
}
export default () => {
2022-09-30 14:22:33 +00:00
const { session } = useAuthStore()
const author = createMemo<Author>(() => {
const a: Author = {
2022-11-10 12:50:47 +00:00
id: null,
2022-09-09 11:53:35 +00:00
name: 'anonymous',
userpic: '',
slug: ''
2022-09-30 14:22:33 +00:00
}
if (session()?.user?.slug) {
const u = session().user
2022-09-09 11:53:35 +00:00
a.name = u.name
a.slug = u.slug
a.userpic = u.userpic
}
2022-09-30 14:22:33 +00:00
2022-09-09 11:53:35 +00:00
return a
})
// TODO: ProfileModal markup and styles
return (
<div class="row view profile">
2022-09-30 14:22:33 +00:00
<h1>{session()?.user?.username}</h1>
2022-09-09 11:53:35 +00:00
<AuthorCard author={author()} />
2022-09-30 14:22:33 +00:00
<div class="profile-bio">{session()?.user?.bio || ''}</div>
<For each={session()?.user?.links || []}>{(l: string) => <a href={l}>{l}</a>}</For>
2022-09-09 11:53:35 +00:00
<span onClick={quit}>{t('Quit')}</span>
</div>
)
}