lintable

.eslintrc.js

@@ -50,16 +50,8 @@ module.exports = {
   },
   globals: {},
   rules: {
-    // FIXME
+    // Solid
-    'unicorn/prefer-dom-node-append': 'off',
+    'solid/reactivity': 'off', // FIXME
-
-    // TEMP
-    // FIXME
-    'solid/reactivity': 'off',
-
-    // Should be enabled
-    // 'promise/catch-or-return': 'off',
-
     'solid/no-innerhtml': 'off',
 
     /** Unicorn **/
@@ -73,8 +65,12 @@ module.exports = {
     'unicorn/import-style': 'off',
     'unicorn/numeric-separators-style': 'off',
     'unicorn/prefer-node-protocol': 'off',
+    'unicorn/prefer-dom-node-append': 'off', // FIXME
+    'unicorn/prefer-top-level-await': 'warn',
     'unicorn/consistent-function-scoping': 'warn',
 
+    // Promise
+    // 'promise/catch-or-return': 'off',  // Should be enabled
     'promise/always-return': 'off',
 
     eqeqeq: 'error',

src/components/Pages/profile/ProfilePage.tsx

@@ -0,0 +1,39 @@
+import { PageWrap } from '../../_shared/PageWrap'
+import { AuthorView, PRERENDERED_ARTICLES_COUNT } from '../../Views/Author'
+import type { PageProps } from '../../types'
+import { createMemo, createSignal, onCleanup, onMount, Show } from 'solid-js'
+import { loadShouts, resetSortedArticles } from '../../../stores/zine/articles'
+import { loadAuthor } from '../../../stores/zine/authors'
+import { Loading } from '../../Loading'
+import { useSession } from '../../../context/session'
+import type { Author } from '../../../graphql/types.gen'
+
+export const ProfilePage = (props: PageProps) => {
+  const [isLoaded, setIsLoaded] = createSignal(Boolean(props.shouts))
+  const { session } = useSession()
+  const profile = createMemo(() => session().user)
+
+  // TODO: ass editing controls
+
+  onMount(async () => {
+    if (isLoaded()) {
+      return
+    }
+    await loadShouts({ filters: { author: profile().slug }, limit: PRERENDERED_ARTICLES_COUNT })
+    await loadAuthor({ slug: profile().slug })
+    setIsLoaded(true)
+  })
+
+  onCleanup(() => resetSortedArticles())
+
+  return (
+    <PageWrap>
+      <Show when={isLoaded()} fallback={<Loading />}>
+        <AuthorView author={profile() as Author} shouts={props.shouts} />
+      </Show>
+    </PageWrap>
+  )
+}
+
+// for lazy loading
+export default ProfilePage

src/components/Root.tsx

@@ -33,6 +33,7 @@ import { InboxPage } from './Pages/InboxPage'
 import { LayoutShoutsPage } from './Pages/LayoutShoutsPage'
 import { SessionProvider } from '../context/session'
 import { ProfileSettingsPage } from './Pages/profile/ProfileSettingsPage'
+import { ProfilePage } from './Pages/profile/ProfilePage'
 
 // TODO: lazy load
 // const SomePage = lazy(() => import('./Pages/SomePage'))
@@ -60,7 +61,8 @@ const pagesMap: Record<keyof Routes, Component<PageProps>> = {
   principles: PrinciplesPage,
   termsOfUse: TermsOfUsePage,
   thanks: ThanksPage,
-  profileSettings: ProfileSettingsPage
+  profileSettings: ProfileSettingsPage,
+  profile: ProfilePage
 }
 
 export const Root = (props: PageProps) => {

src/components/Views/Author.tsx

@@ -17,7 +17,6 @@ import { splitToPages } from '../../utils/splitToPages'
 type AuthorProps = {
   shouts: Shout[]
   author: Author
-  authorSlug: string
   // FIXME author topics from server
   // topics: Topic[]
 }
@@ -37,7 +36,7 @@ export const AuthorView = (props: AuthorProps) => {
   const { topicsByAuthor } = useTopicsStore()
   const [isLoadMoreButtonVisible, setIsLoadMoreButtonVisible] = createSignal(false)
 
-  const author = createMemo(() => authorEntities()[props.authorSlug])
+  const author = createMemo(() => authorEntities()[props.author.slug])
   const { searchParams, changeSearchParam } = useRouter<AuthorPageSearchParams>()
 
   const loadMore = async () => {