fmt

src/components/Views/Author/Author.tsx

@@ -110,7 +110,7 @@ export const AuthorView = (props: AuthorViewProps) => {
   })
 
   const handleDeleteComment = (id: number) => {
-    setCommented((prev) => (prev||[]).filter((comment) => comment.id !== id))
+    setCommented((prev) => (prev || []).filter((comment) => comment.id !== id))
   }
 
   const TabNavigator = () => (
@@ -154,11 +154,17 @@ export const AuthorView = (props: AuthorViewProps) => {
   }
 
   // fx to update author's feed
-  createEffect(on(feedByAuthor, (byAuthor) => {
+  createEffect(
-    const feed = byAuthor[props.authorSlug] as Shout[]
+    on(
-    if (!feed) return
+      feedByAuthor,
-    setSortedFeed(feed)
+      (byAuthor) => {
-  },{}))
+        const feed = byAuthor[props.authorSlug] as Shout[]
+        if (!feed) return
+        setSortedFeed(feed)
+      },
+      {}
+    )
+  )
 
   const [loadMoreCommentsHidden, setLoadMoreCommentsHidden] = createSignal(false)
   const { commentsByAuthor, addReactions } = useReactions()
@@ -176,14 +182,27 @@ export const AuthorView = (props: AuthorViewProps) => {
     })
     const result = await authorCommentsFetcher()
     result && addReactions(result)
-    result && setCommented((prev) => [...new Set([...(prev||[]), ...result])])
+    result && setCommented((prev) => [...new Set([...(prev || []), ...result])])
     restoreScrollPosition()
     return result as LoadMoreItems
   }
 
   createEffect(() => setCurrentTab(params.tab))
-  createEffect(on([author, commented], ([a, ccc]) => a && setLoadMoreCommentsHidden(ccc?.length === a.stat?.comments), {}))
+  createEffect(
-  createEffect(on([author, feedByAuthor], ([a, feed]) => a && feed[props.authorSlug] && setLoadMoreHidden(feed[props.authorSlug]?.length === a.stat?.shouts), {}))
+    on(
+      [author, commented],
+      ([a, ccc]) => a && setLoadMoreCommentsHidden(ccc?.length === a.stat?.comments),
+      {}
+    )
+  )
+  createEffect(
+    on(
+      [author, feedByAuthor],
+      ([a, feed]) =>
+        a && feed[props.authorSlug] && setLoadMoreHidden(feed[props.authorSlug]?.length === a.stat?.shouts),
+      {}
+    )
+  )
 
   return (
     <div class={styles.authorPage}>
@@ -245,26 +264,29 @@ export const AuthorView = (props: AuthorViewProps) => {
             </div>
           </Show>
 
-
+          <LoadMoreWrapper
-          <LoadMoreWrapper loadFunction={loadMoreComments} pageSize={COMMENTS_PER_PAGE} hidden={loadMoreCommentsHidden()}>
+            loadFunction={loadMoreComments}
-          <div class="wide-container">
+            pageSize={COMMENTS_PER_PAGE}
-            <div class="row">
+            hidden={loadMoreCommentsHidden()}
-              <div class="col-md-20 col-lg-18">
+          >
-                <ul class={stylesArticle.comments}>
+            <div class="wide-container">
-                  <For each={commented()?.sort(byCreated).reverse()}>
+              <div class="row">
-                    {(comment) => (
+                <div class="col-md-20 col-lg-18">
-                      <Comment
+                  <ul class={stylesArticle.comments}>
-                        comment={comment}
+                    <For each={commented()?.sort(byCreated).reverse()}>
-                        class={styles.comment}
+                      {(comment) => (
-                        showArticleLink={true}
+                        <Comment
-                        onDelete={(id) => handleDeleteComment(id)}
+                          comment={comment}
-                      />
+                          class={styles.comment}
-                    )}
+                          showArticleLink={true}
-                  </For>
+                          onDelete={(id) => handleDeleteComment(id)}
-                </ul>
+                        />
+                      )}
+                    </For>
+                  </ul>
+                </div>
               </div>
             </div>
-          </div>
           </LoadMoreWrapper>
         </Match>
 
@@ -276,13 +298,9 @@ export const AuthorView = (props: AuthorViewProps) => {
           </Show>
 
           <LoadMoreWrapper loadFunction={loadMore} pageSize={SHOUTS_PER_PAGE} hidden={loadMoreHidden()}>
-            <For
+            <For each={sortedFeed().filter((_, i) => i % 3 === 0)}>
-              each={sortedFeed()
-                .filter((_, i) => i % 3 === 0)}
-            >
               {(_shout, index) => {
-                const articles = sortedFeed()
+                const articles = sortedFeed().slice(index() * 3, index() * 3 + 3)
-                  .slice(index() * 3, index() * 3 + 3)
                 return (
                   <>
                     <Switch>

src/context/reactions.tsx

@@ -68,7 +68,7 @@ export const ReactionsProvider = (props: { children: JSX.Element }) => {
     const newCommentsByAuthor = Object.fromEntries(
       Object.entries(newReactionsByAuthor).map(([authorId, reactions]) => [
         authorId,
-        reactions.filter((x: Reaction) => x.kind === ReactionKind.Comment),
+        reactions.filter((x: Reaction) => x.kind === ReactionKind.Comment)
       ])
     )
 

src/routes/author/[slug]/[...tab].tsx

@@ -105,7 +105,9 @@ export default function AuthorPage(props: RouteSectionProps<AuthorPageProps>) {
   )
 
   // author's shouts
-  const authorShouts = createAsync(async () => props.data.articles as Shout[] || await fetchAuthorShouts(props.params.slug, 0))
+  const authorShouts = createAsync(
+    async () => (props.data.articles as Shout[]) || (await fetchAuthorShouts(props.params.slug, 0))
+  )
 
   return (
     <ErrorBoundary fallback={(_err) => <FourOuFourView />}>