canEdit-fix

src/components/Article/Comment/Comment.tsx

@@ -38,12 +38,14 @@ export const Comment = (props: Props) => {
   const [loading, setLoading] = createSignal(false)
   const [editMode, setEditMode] = createSignal(false)
   const [clearEditor, setClearEditor] = createSignal(false)
-  const { author } = useSession()
+  const { author, session } = useSession()
   const { createReaction, deleteReaction, updateReaction } = useReactions()
   const { showConfirm } = useConfirm()
   const { showSnackbar } = useSnackbar()
 
-  const isCommentAuthor = createMemo(() => props.comment.created_by?.slug === author()?.slug)
+  const canEdit = createMemo(
+    () => props.comment.created_by?.slug === author()?.slug || session()?.user?.roles.includes('editor'),
+  )
   const comment = createMemo(() => props.comment)
   const body = createMemo(() => (comment().body || '').trim())
 
@@ -108,9 +110,7 @@ export const Comment = (props: Props) => {
   return (
     <li
       id={`comment_${comment().id}`}
-      class={clsx(styles.comment, props.class, {
-        [styles.isNew]: !isCommentAuthor() && comment()?.created_at > props.lastSeen,
-      })}
+      class={clsx(styles.comment, props.class, { [styles.isNew]: comment()?.created_at > props.lastSeen })}
     >
       <Show when={!!body()}>
         <div class={styles.commentContent}>
@@ -189,7 +189,7 @@ export const Comment = (props: Props) => {
                   {loading() ? t('Loading') : t('Reply')}
                 </button>
               </ShowIfAuthenticated>
-              <Show when={isCommentAuthor()}>
+              <Show when={canEdit()}>
                 <button
                   class={clsx(styles.commentControl, styles.commentControlEdit)}
                   onClick={toggleEditMode}

src/components/Article/FullArticle.tsx

@@ -75,10 +75,15 @@ export const FullArticle = (props: Props) => {
   const [isReactionsLoaded, setIsReactionsLoaded] = createSignal(false)
   const [isActionPopupActive, setIsActionPopupActive] = createSignal(false)
   const { t, formatDate, lang } = useLocalize()
-  const { author, isAuthenticated, requireAuthentication } = useSession()
+  const { author, session, isAuthenticated, requireAuthentication } = useSession()
 
   const formattedDate = createMemo(() => formatDate(new Date(props.article.published_at * 1000)))
-  const canEdit = () => props.article.authors?.some((a) => Boolean(a) && a?.slug === author()?.slug)
+  const canEdit = createMemo(
+    () =>
+      props.article.authors?.some((a) => Boolean(a) && a?.slug === author()?.slug) ||
+      props.article?.created_by.slug === author()?.slug ||
+      session()?.user?.roles.includes('editor'),
+  )
 
   const mainTopic = createMemo(() => {
     const mainTopicSlug = props.article.topics.length > 0 ? props.article.main_topic : null

src/components/Feed/ArticleCard/ArticleCard.tsx

@@ -106,7 +106,7 @@ const LAYOUT_ASPECT = {
 
 export const ArticleCard = (props: ArticleCardProps) => {
   const { t, lang, formatDate } = useLocalize()
-  const { author } = useSession()
+  const { author, session } = useSession()
   const { changeSearchParams } = useRouter()
   const [isActionPopupActive, setIsActionPopupActive] = createSignal(false)
   const [isCoverImageLoadError, setIsCoverImageLoadError] = createSignal(false)
@@ -120,9 +120,12 @@ export const ArticleCard = (props: ArticleCardProps) => {
     props.article.published_at ? formatDate(new Date(props.article.published_at * 1000)) : '',
   )
 
-  const canEdit = () =>
-    props.article.authors?.some((a) => a && a?.slug === author()?.slug) ||
-    props.article.created_by?.id === author()?.id
+  const canEdit = createMemo(
+    () =>
+      props.article.authors?.some((a) => a && a?.slug === author()?.slug) ||
+      props.article.created_by?.id === author()?.id ||
+      session()?.user?.roles.includes('editor'),
+  )
 
   const scrollToComments = (event) => {
     event.preventDefault()