From 8b066104e633623bd35bb7af767618edfddd884c Mon Sep 17 00:00:00 2001
From: Ilya Y <75578537+ilya-bkv@users.noreply.github.com>
Date: Tue, 27 Feb 2024 14:41:49 +0300
Subject: [PATCH] Hotfix/can edit fix (#421)

Fix canEdit() in Commetns
---
 src/components/Article/Comment/Comment.tsx | 37 +++++++++++-----------
 src/components/AuthorsList/AuthorsList.tsx | 13 ++++----
 src/stores/ui.ts                           |  4 ++-
 3 files changed, 29 insertions(+), 25 deletions(-)

diff --git a/src/components/Article/Comment/Comment.tsx b/src/components/Article/Comment/Comment.tsx
index d22a8da7..d5b794e6 100644
--- a/src/components/Article/Comment/Comment.tsx
+++ b/src/components/Article/Comment/Comment.tsx
@@ -46,14 +46,13 @@ export const Comment = (props: Props) => {
   const canEdit = createMemo(
     () =>
       Boolean(author()?.id) &&
-      (props.comment?.created_by?.id === author().id || session()?.user?.roles.includes('editor')),
+      (props.comment?.created_by?.slug === author().slug || session()?.user?.roles.includes('editor')),
   )
 
-  const comment = createMemo(() => props.comment)
-  const body = createMemo(() => (comment().body || '').trim())
+  const body = createMemo(() => (props.comment.body || '').trim())
 
   const remove = async () => {
-    if (comment()?.id) {
+    if (props.comment?.id) {
       try {
         const isConfirmed = await showConfirm({
           confirmBody: t('Are you sure you want to delete this comment?'),
@@ -63,7 +62,7 @@ export const Comment = (props: Props) => {
         })
 
         if (isConfirmed) {
-          await deleteReaction(comment().id)
+          await deleteReaction(props.comment.id)
 
           await showSnackbar({ body: t('Comment successfully deleted') })
         }
@@ -113,8 +112,10 @@ export const Comment = (props: Props) => {
 
   return (
     <li
-      id={`comment_${comment().id}`}
-      class={clsx(styles.comment, props.class, { [styles.isNew]: comment()?.created_at > props.lastSeen })}
+      id={`comment_${props.comment.id}`}
+      class={clsx(styles.comment, props.class, {
+        [styles.isNew]: props.comment?.created_at > props.lastSeen,
+      })}
     >
       <Show when={!!body()}>
         <div class={styles.commentContent}>
@@ -123,21 +124,21 @@ export const Comment = (props: Props) => {
             fallback={
               <div>
                 <Userpic
-                  name={comment().created_by.name}
-                  userpic={comment().created_by.pic}
+                  name={props.comment.created_by.name}
+                  userpic={props.comment.created_by.pic}
                   class={clsx({
                     [styles.compactUserpic]: props.compact,
                   })}
                 />
                 <small>
-                  <a href={`#comment_${comment()?.id}`}>{comment()?.shout.title || ''}</a>
+                  <a href={`#comment_${props.comment?.id}`}>{props.comment?.shout.title || ''}</a>
                 </small>
               </div>
             }
           >
             <div class={styles.commentDetails}>
               <div class={styles.commentAuthor}>
-                <AuthorLink author={comment()?.created_by as Author} />
+                <AuthorLink author={props.comment?.created_by as Author} />
               </div>
 
               <Show when={props.isArticleAuthor}>
@@ -148,23 +149,23 @@ export const Comment = (props: Props) => {
                 <div class={styles.articleLink}>
                   <Icon name="arrow-right" class={styles.articleLinkIcon} />
                   <a
-                    href={`${getPagePath(router, 'article', { slug: comment().shout.slug })}?commentId=${
-                      comment().id
-                    }`}
+                    href={`${getPagePath(router, 'article', {
+                      slug: props.comment.shout.slug,
+                    })}?commentId=${props.comment.id}`}
                   >
-                    {comment().shout.title}
+                    {props.comment.shout.title}
                   </a>
                 </div>
               </Show>
-              <CommentDate showOnHover={true} comment={comment()} isShort={true} />
-              <CommentRatingControl comment={comment()} />
+              <CommentDate showOnHover={true} comment={props.comment} isShort={true} />
+              <CommentRatingControl comment={props.comment} />
             </div>
           </Show>
           <div class={styles.commentBody}>
             <Show when={editMode()} fallback={<div innerHTML={body()} />}>
               <Suspense fallback={<p>{t('Loading')}</p>}>
                 <SimplifiedEditor
-                  initialContent={comment().body}
+                  initialContent={props.comment.body}
                   submitButtonText={t('Save')}
                   quoteEnabled={true}
                   imageEnabled={true}
diff --git a/src/components/AuthorsList/AuthorsList.tsx b/src/components/AuthorsList/AuthorsList.tsx
index e3e3ac26..651792e6 100644
--- a/src/components/AuthorsList/AuthorsList.tsx
+++ b/src/components/AuthorsList/AuthorsList.tsx
@@ -3,12 +3,12 @@ import { For, Show, createEffect, createSignal, on, onMount } from 'solid-js'
 import { useFollowing } from '../../context/following'
 import { useLocalize } from '../../context/localize'
 import { apiClient } from '../../graphql/client/core'
+import { Author } from '../../graphql/schema/core.gen'
 import { setAuthorsByFollowers, setAuthorsByShouts, useAuthorsStore } from '../../stores/zine/authors'
 import { AuthorBadge } from '../Author/AuthorBadge'
 import { InlineLoader } from '../InlineLoader'
 import { Button } from '../_shared/Button'
 import styles from './AuthorsList.module.scss'
-import { Author } from "../../graphql/schema/core.gen";
 
 type Props = {
   class?: string
@@ -21,8 +21,9 @@ const PAGE_SIZE = 20
 
 // TODO: проверить нет ли дубликатов в базе данных, если нет - то не использовать addUniqueAuthors()
 const addUniqueAuthors = (prevAuthors: Author[], newAuthors: Author[]) => {
-  const uniqueNewAuthors = newAuthors.filter(newAuthor =>
-    !prevAuthors.some(prevAuthor => prevAuthor.id === newAuthor.id));
+  const uniqueNewAuthors = newAuthors.filter(
+    (newAuthor) => !prevAuthors.some((prevAuthor) => prevAuthor.id === newAuthor.id),
+  )
   return [...prevAuthors, ...uniqueNewAuthors]
 }
 export const AuthorsList = (props: Props) => {
@@ -43,9 +44,9 @@ export const AuthorsList = (props: Props) => {
     })
 
     if (queryType === 'shouts') {
-      setAuthorsByShouts(prev => addUniqueAuthors(prev, result));
+      setAuthorsByShouts((prev) => addUniqueAuthors(prev, result))
     } else {
-      setAuthorsByFollowers(prev => addUniqueAuthors(prev, result));
+      setAuthorsByFollowers((prev) => addUniqueAuthors(prev, result))
     }
     setLoading(false)
   }
@@ -106,7 +107,7 @@ export const AuthorsList = (props: Props) => {
             <Show when={!loading() && authorsList().length > 0 && !allLoaded()}>
               <Button value={t('Load more')} onClick={loadMoreAuthors} />
             </Show>
-            <Show when={loading() &&   !allLoaded()}>
+            <Show when={loading() && !allLoaded()}>
               <InlineLoader />
             </Show>
           </div>
diff --git a/src/stores/ui.ts b/src/stores/ui.ts
index b4ae712b..a97db243 100644
--- a/src/stores/ui.ts
+++ b/src/stores/ui.ts
@@ -48,7 +48,9 @@ export const MODALS: Record<ModalType, ModalType> = {
 
 const [modal, setModal] = createSignal<ModalType>(null)
 
-const { changeSearchParams, clearSearchParams } = useRouter<AuthModalSearchParams & ConfirmEmailSearchParams & RootSearchParams>()
+const { changeSearchParams, clearSearchParams } = useRouter<
+  AuthModalSearchParams & ConfirmEmailSearchParams & RootSearchParams
+>()
 
 export const showModal = (modalType: ModalType, modalSource?: AuthModalSource) => {
   if (modalSource) {