maintopic-fix

src/components/Article/Article.module.scss

@@ -29,6 +29,17 @@ img {
   font-size: 1.6rem;
   line-height: 1.6;
 
+  details {
+    text-align: center;
+    background-color: lightgray;
+    line-height: 3em;
+  }
+
+  details p {
+    text-align: left;
+    line-height: normal;
+  }
+
   blockquote,
   blockquote[data-type='punchline'] {
     clear: both;

src/components/Article/Comment/Comment.tsx

@@ -38,7 +38,7 @@ export const Comment = (props: Props) => {
   const [loading, setLoading] = createSignal(false)
   const [editMode, setEditMode] = createSignal(false)
   const [clearEditor, setClearEditor] = createSignal(false)
-  const { session } = useSession()
+  const { author } = useSession()
 
   const {
     actions: { createReaction, deleteReaction, updateReaction },
@@ -52,7 +52,7 @@ export const Comment = (props: Props) => {
     actions: { showSnackbar },
   } = useSnackbar()
 
-  const isCommentAuthor = createMemo(() => props.comment.created_by?.slug === session()?.author?.slug)
+  const isCommentAuthor = createMemo(() => props.comment.created_by?.slug === author().slug)
 
   const comment = createMemo(() => props.comment)
   const body = createMemo(() => (comment().body || '').trim())
@@ -216,7 +216,7 @@ export const Comment = (props: Props) => {
               </Show>
 
               {/*<SharePopup*/}
-              {/*  title={'artile.title'}*/}
+              {/*  title={'article.title'}*/}
               {/*  description={getDescription(body())}*/}
               {/*  containerCssClass={stylesHeader.control}*/}
               {/*  trigger={*/}

src/components/Article/FullArticle.tsx

@@ -72,9 +72,14 @@ export const FullArticle = (props: Props) => {
   const formattedDate = createMemo(() => formatDate(new Date(props.article.created_at * 1000)))
 
   const mainTopic = createMemo(() => {
-    const mt = props.article.topics.length > 0 ? props.article.topics[0] : null
-    mt.title = lang() == 'en' ? capitalize(mt.slug.replace('-', ' ')) : mt.title
-    return mt
+    const main_topic_slug = props.article.topics.length > 0 ? props.article.main_topic : null
+    const mt = props.article.topics.find((t) => t.slug === main_topic_slug)
+    if (mt) {
+      mt.title = lang() == 'en' ? capitalize(mt.slug.replace('-', ' ')) : mt.title
+      return mt
+    } else {
+      return props.article.topics[0]
+    }
   })
 
   const canEdit = () => props.article.authors?.some((a) => a.slug === author()?.slug)

src/components/Feed/ArticleCard/ArticleCard.tsx

@@ -86,7 +86,10 @@ const getTitleAndSubtitle = (
 export const ArticleCard = (props: ArticleCardProps) => {
   const { t, lang, formatDate } = useLocalize()
   const { author } = useSession()
-  const mainTopic = props.article.topics[0]
+  const mainTopicSlug = props.article.main_topic
+  const mainTopic = props.article.topics.find((t) => t.slug === mainTopicSlug)
+  const mainTopicTitle =
+    lang() === 'ru' && mainTopic?.title ? mainTopic.title : mainTopicSlug.replace('-', ' ')
 
   const formattedDate = createMemo<string>(() => {
     return formatDate(new Date(props.article.created_at * 1000))
@@ -171,12 +174,10 @@ export const ArticleCard = (props: ArticleCardProps) => {
           </div>
         </Show>
 
-        <Show when={!props.settings?.isGroup && mainTopic}>
+        <Show when={!props.settings?.isGroup && mainTopicSlug}>
           <CardTopic
-            title={
-              lang() === 'ru' && mainTopic.title ? mainTopic.title : mainTopic?.slug?.replace('-', ' ')
-            }
-            slug={mainTopic.slug}
+            title={mainTopicTitle}
+            slug={mainTopicSlug}
             isFloorImportant={props.settings?.isFloorImportant}
             isFeedMode={true}
             class={clsx(styles.shoutTopic, { [styles.shoutTopicTop]: props.settings.isShort })}

src/graphql/query/core/article-load.ts

@@ -23,6 +23,7 @@ export default gql`
         created_at
       }
       # community
+      main_topic
       topics {
         id
         title

src/graphql/query/core/articles-load-by.ts

@@ -12,6 +12,7 @@ export default gql`
       layout
       cover
       lead
+      main_topic
       topics {
         id
         title

src/graphql/query/core/articles-load-drafts.ts

@@ -11,6 +11,7 @@ export default gql`
       cover
       # community
       media
+      main_topic
       topics {
         id
         title

src/graphql/query/core/articles-load-feed.ts

@@ -10,6 +10,7 @@ export default gql`
       layout
       cover
       # community
+      main_topic
       topics {
         id
         title

src/graphql/query/core/articles-load-followed.ts

@@ -9,6 +9,7 @@ export default gql`
       slug
       cover
       # community
+      main_topic
       topics {
         # id
         title

src/graphql/query/core/articles-load-search.ts

@@ -9,6 +9,7 @@ export default gql`
       slug
       layout
       cover
+      main_topic
       topics {
         id
         title