author page fixes

src/components/Author/Card.tsx

@@ -22,11 +22,8 @@ interface AuthorCardProps {
 export const AuthorCard = (props: AuthorCardProps) => {
   const { session } = useAuthStore()
 
-  const subscribed = createMemo(
+  const subscribed = createMemo<boolean>(
-    () =>
+    () => session()?.news?.authors?.some((u) => u === props.author.slug) || false
-      !!session()
-        ?.news?.authors?.filter((u) => u === props.author.slug)
-        .pop()
   )
   const canFollow = createMemo(() => !props.hideFollow && session()?.user?.slug !== props.author.slug)
   const bio = () => props.author.bio || t('Our regular contributor')
@@ -37,57 +34,53 @@ export const AuthorCard = (props: AuthorCardProps) => {
   }
   // TODO: reimplement AuthorCard
   return (
-    <>
+    <div class="author">
-      <Show when={props.author?.slug}>
+      <Userpic user={props.author} hasLink={props.hasLink} />
-        <div class="author">
-          <Userpic user={props.author} hasLink={props.hasLink} />
 
-          <div class="author__details">
+      <div class="author__details">
-            <div class="author__details-wrapper">
+        <div class="author__details-wrapper">
-              <Show when={props.hasLink}>
+          <Show when={props.hasLink}>
-                <a class="author__name text-3xl text-2xl" href={`/author/${props.author.slug}`}>
+            <a class="author__name text-3xl text-2xl" href={`/author/${props.author.slug}`}>
-                  {name()}
+              {name()}
-                </a>
+            </a>
-              </Show>
+          </Show>
-              <Show when={!props.hasLink}>
+          <Show when={!props.hasLink}>
-                <div class="author__name text-3xl text-2xl">{name()}</div>
+            <div class="author__name text-3xl text-2xl">{name()}</div>
-              </Show>
+          </Show>
 
-              <Show when={!props.hideDescription}>
+          <Show when={!props.hideDescription}>
-                <div class="author__about">{bio()}</div>
+            <div class="author__about">{bio()}</div>
-              </Show>
+          </Show>
-            </div>
+        </div>
 
-            <Show when={canFollow()}>
+        <Show when={canFollow()}>
-              <div class="author__subscribe">
+          <div class="author__subscribe">
-                <Show
+            <Show
-                  when={subscribed()}
+              when={subscribed()}
-                  fallback={
+              fallback={
-                    <button onClick={() => follow} class="button button--subscribe">
+                <button onClick={() => follow} class="button button--subscribe">
-                      <Icon name="author-subscribe" />
+                  <Icon name="author-subscribe" />
-                      <span class="button__label">+&nbsp;{t('Follow')}</span>
+                  <span class="button__label">+&nbsp;{t('Follow')}</span>
-                    </button>
+                </button>
-                  }
+              }
-                >
+            >
-                  <button onClick={() => unfollow} class="button button--subscribe">
+              <button onClick={() => unfollow} class="button button--subscribe">
-                    <Icon name="author-unsubscribe" />
+                <Icon name="author-unsubscribe" />
-                    <span class="button__label">-&nbsp;{t('Unfollow')}</span>
+                <span class="button__label">-&nbsp;{t('Unfollow')}</span>
-                  </button>
+              </button>
-                </Show>
+            </Show>
 
-                <Show when={!props.compact}>
+            <Show when={!props.compact}>
-                  <button class="button button--write">
+              <button class="button button--write">
-                    <Icon name="edit" />
+                <Icon name="edit" />
-                    {t('Write')}
+                {t('Write')}
-                  </button>
+              </button>
 
-                  <For each={props.author.links}>{(link: string) => <a href={link} />}</For>
+              <For each={props.author.links}>{(link) => <a href={link} />}</For>
-                </Show>
-              </div>
             </Show>
           </div>
-        </div>
+        </Show>
-      </Show>
+      </div>
-    </>
+    </div>
   )
 }

src/components/Author/Full.tsx

@@ -4,14 +4,12 @@ import './Full.scss'
 
 export default (props: { author: Author }) => {
   return (
-    <>
+    <div class="container">
-      <div class="container">
+      <div class="row">
-        <div class="row">
+        <div class="user-details">
-          <div class="user-details">
+          <AuthorCard author={props.author} compact={false} />
-            <AuthorCard author={props.author} compact={false} />
-          </div>
         </div>
       </div>
-    </>
+    </div>
   )
 }

src/graphql/query/articles-for-authors.ts

@@ -26,6 +26,8 @@ export default gql`
         _id: slug
         name
         slug
+        bio
+        links
         userpic
       }
       createdAt

src/layouts/zine.astro

@@ -4,7 +4,7 @@ import '../styles/app.scss'
 import { t } from '../utils/intl'
 
 const lang = Astro.url.searchParams.get('lang') || 'ru'
-console.log('[layout] server locale is', lang)
+// console.log('[layout] server locale is', lang)
 setLocale(lang)
 
 ---

src/stores/zine/topics.ts

@@ -19,25 +19,26 @@ const [topicsByAuthor, setTopicByAuthor] = createSignal<{ [authorSlug: string]:
 
 const sortedTopics = createLazyMemo<Topic[]>(() => {
   const topics = Object.values(topicEntities())
-  const sortAllByValue = sortAllBy()
 
-  switch (sortAllByValue) {
+  switch (sortAllBy()) {
-    case 'created': {
+    case 'created':
       // log.debug('sorted by created')
       topics.sort(byCreated)
       break
-    }
     case 'shouts':
+      // log.debug(`sorted by shouts`)
+      topics.sort(byTopicStatDesc('shouts'))
+      break
     case 'authors':
-      // log.debug(`sorted by ${sortBy}`)
+      // log.debug(`sorted by authors`)
-      topics.sort(byTopicStatDesc(sortAllByValue))
+      topics.sort(byTopicStatDesc('authors'))
       break
     case 'title':
       // log.debug('sorted by title')
       topics.sort((a, b) => a.title.localeCompare(b.title))
       break
     default:
-      log.error(`Unknown sort: ${sortAllByValue}`)
+      log.error(`Unknown sort: ${sortAllBy()}`)
   }
 
   return topics

src/utils/apiClient.ts

@@ -221,13 +221,22 @@ export const apiClient = {
   },
   getAllTopics: async () => {
     const response = await publicGraphQLClient.query(topicsAll, {}).toPromise()
+    if (response.error) {
+      log.debug('getAllTopics', response.error)
+    }
     return response.data.topicsAll
   },
-
   getAllAuthors: async () => {
     const response = await publicGraphQLClient.query(authorsAll, {}).toPromise()
+    if (response.error) {
+      log.debug('getAllAuthors', response.error)
+    }
     return response.data.authorsAll
   },
+  getAuthor: async ({ slug }: { slug: string }) => {
+    const response = await publicGraphQLClient.query(authorsBySlugs, { slugs: [slug] }).toPromise()
+    return response.data.getUsersBySlugs
+  },
   getArticle: async ({ slug }: { slug: string }): Promise<Shout> => {
     const response = await publicGraphQLClient.query(articleBySlug, { slug }).toPromise()
     return response.data?.getShoutBySlug