From f769564edfea3ec6406c49ef639685d942e14e09 Mon Sep 17 00:00:00 2001
From: Paul Frazee <pfrazee@gmail.com>
Date: Mon, 24 Jun 2024 10:11:43 -0700
Subject: Remove the 'Who can reply' element except when viewing root, and add
 "edit" (#4615)

* Remove the 'Who can reply' element except when viewing root, and add the edit text to authors

* Switch to icon
---
 src/view/com/post-thread/PostThreadItem.tsx | 305 ++++++++++++++--------------
 1 file changed, 150 insertions(+), 155 deletions(-)

(limited to 'src/view/com/post-thread/PostThreadItem.tsx')

diff --git a/src/view/com/post-thread/PostThreadItem.tsx b/src/view/com/post-thread/PostThreadItem.tsx
index 92b529db7..46c6c958e 100644
--- a/src/view/com/post-thread/PostThreadItem.tsx
+++ b/src/view/com/post-thread/PostThreadItem.tsx
@@ -34,8 +34,8 @@ import {ContentHider} from '../../../components/moderation/ContentHider'
 import {LabelsOnMyPost} from '../../../components/moderation/LabelsOnMe'
 import {PostAlerts} from '../../../components/moderation/PostAlerts'
 import {PostHider} from '../../../components/moderation/PostHider'
+import {WhoCanReply} from '../../../components/WhoCanReply'
 import {getTranslatorLink, isPostInLanguage} from '../../../locale/helpers'
-import {WhoCanReplyBlock, WhoCanReplyInline} from '../threadgate/WhoCanReply'
 import {ErrorMessage} from '../util/error/ErrorMessage'
 import {Link, TextLink} from '../util/Link'
 import {formatCount} from '../util/numeric/format'
@@ -406,177 +406,172 @@ let PostThreadItemLoaded = ({
     const isThreadedChildAdjacentBot =
       isThreadedChild && nextPost?.ctx.depth === depth
     return (
-      <>
-        <PostOuterWrapper
-          post={post}
-          depth={depth}
-          showParentReplyLine={!!showParentReplyLine}
-          treeView={treeView}
-          hasPrecedingItem={hasPrecedingItem}
-          hideTopBorder={hideTopBorder}>
-          <PostHider
-            testID={`postThreadItem-by-${post.author.handle}`}
-            href={postHref}
-            disabled={overrideBlur}
-            style={[pal.view]}
-            modui={moderation.ui('contentList')}
-            iconSize={isThreadedChild ? 26 : 38}
-            iconStyles={
-              isThreadedChild
-                ? {marginRight: 4}
-                : {marginLeft: 2, marginRight: 2}
-            }
-            profile={post.author}
-            interpretFilterAsBlur>
-            <View
-              style={{
-                flexDirection: 'row',
-                gap: 10,
-                paddingLeft: 8,
-                height: isThreadedChildAdjacentTop ? 8 : 16,
-              }}>
-              <View style={{width: 38}}>
-                {!isThreadedChild && showParentReplyLine && (
+      <PostOuterWrapper
+        post={post}
+        depth={depth}
+        showParentReplyLine={!!showParentReplyLine}
+        treeView={treeView}
+        hasPrecedingItem={hasPrecedingItem}
+        hideTopBorder={hideTopBorder}>
+        <PostHider
+          testID={`postThreadItem-by-${post.author.handle}`}
+          href={postHref}
+          disabled={overrideBlur}
+          style={[pal.view]}
+          modui={moderation.ui('contentList')}
+          iconSize={isThreadedChild ? 26 : 38}
+          iconStyles={
+            isThreadedChild ? {marginRight: 4} : {marginLeft: 2, marginRight: 2}
+          }
+          profile={post.author}
+          interpretFilterAsBlur>
+          <View
+            style={{
+              flexDirection: 'row',
+              gap: 10,
+              paddingLeft: 8,
+              height: isThreadedChildAdjacentTop ? 8 : 16,
+            }}>
+            <View style={{width: 38}}>
+              {!isThreadedChild && showParentReplyLine && (
+                <View
+                  style={[
+                    styles.replyLine,
+                    {
+                      flexGrow: 1,
+                      backgroundColor: pal.colors.replyLine,
+                      marginBottom: 4,
+                    },
+                  ]}
+                />
+              )}
+            </View>
+          </View>
+
+          <View
+            style={[
+              styles.layout,
+              {
+                paddingBottom:
+                  showChildReplyLine && !isThreadedChild
+                    ? 0
+                    : isThreadedChildAdjacentBot
+                    ? 4
+                    : 8,
+              },
+            ]}>
+            {/* If we are in threaded mode, the avatar is rendered in PostMeta */}
+            {!isThreadedChild && (
+              <View style={styles.layoutAvi}>
+                <PreviewableUserAvatar
+                  size={38}
+                  profile={post.author}
+                  moderation={moderation.ui('avatar')}
+                  type={post.author.associated?.labeler ? 'labeler' : 'user'}
+                />
+
+                {showChildReplyLine && (
                   <View
                     style={[
                       styles.replyLine,
                       {
                         flexGrow: 1,
                         backgroundColor: pal.colors.replyLine,
-                        marginBottom: 4,
+                        marginTop: 4,
                       },
                     ]}
                   />
                 )}
               </View>
-            </View>
+            )}
 
             <View
-              style={[
-                styles.layout,
-                {
-                  paddingBottom:
-                    showChildReplyLine && !isThreadedChild
-                      ? 0
-                      : isThreadedChildAdjacentBot
-                      ? 4
-                      : 8,
-                },
-              ]}>
-              {/* If we are in threaded mode, the avatar is rendered in PostMeta */}
-              {!isThreadedChild && (
-                <View style={styles.layoutAvi}>
-                  <PreviewableUserAvatar
-                    size={38}
-                    profile={post.author}
-                    moderation={moderation.ui('avatar')}
-                    type={post.author.associated?.labeler ? 'labeler' : 'user'}
-                  />
-
-                  {showChildReplyLine && (
-                    <View
-                      style={[
-                        styles.replyLine,
-                        {
-                          flexGrow: 1,
-                          backgroundColor: pal.colors.replyLine,
-                          marginTop: 4,
-                        },
-                      ]}
-                    />
-                  )}
-                </View>
-              )}
-
-              <View
+              style={
+                isThreadedChild
+                  ? styles.layoutContentThreaded
+                  : styles.layoutContent
+              }>
+              <PostMeta
+                author={post.author}
+                moderation={moderation}
+                authorHasWarning={!!post.author.labels?.length}
+                timestamp={post.indexedAt}
+                postHref={postHref}
+                showAvatar={isThreadedChild}
+                avatarModeration={moderation.ui('avatar')}
+                avatarSize={28}
+                displayNameType="md-bold"
+                displayNameStyle={isThreadedChild && s.ml2}
                 style={
-                  isThreadedChild
-                    ? styles.layoutContentThreaded
-                    : styles.layoutContent
-                }>
-                <PostMeta
-                  author={post.author}
-                  moderation={moderation}
-                  authorHasWarning={!!post.author.labels?.length}
-                  timestamp={post.indexedAt}
-                  postHref={postHref}
-                  showAvatar={isThreadedChild}
-                  avatarModeration={moderation.ui('avatar')}
-                  avatarSize={28}
-                  displayNameType="md-bold"
-                  displayNameStyle={isThreadedChild && s.ml2}
-                  style={
-                    isThreadedChild && {
-                      alignItems: 'center',
-                      paddingBottom: isWeb ? 5 : 2,
-                    }
+                  isThreadedChild && {
+                    alignItems: 'center',
+                    paddingBottom: isWeb ? 5 : 2,
                   }
-                />
-                <LabelsOnMyPost post={post} />
-                <PostAlerts
-                  modui={moderation.ui('contentList')}
-                  style={[a.pt_2xs, a.pb_2xs]}
-                />
-                {richText?.text ? (
-                  <View style={styles.postTextContainer}>
-                    <RichText
-                      enableTags
-                      value={richText}
-                      style={[a.flex_1, a.text_md]}
-                      numberOfLines={limitLines ? MAX_POST_LINES : undefined}
-                      authorHandle={post.author.handle}
-                    />
-                  </View>
-                ) : undefined}
-                {limitLines ? (
-                  <TextLink
-                    text={_(msg`Show More`)}
-                    style={pal.link}
-                    onPress={onPressShowMore}
-                    href="#"
+                }
+              />
+              <LabelsOnMyPost post={post} />
+              <PostAlerts
+                modui={moderation.ui('contentList')}
+                style={[a.pt_2xs, a.pb_2xs]}
+              />
+              {richText?.text ? (
+                <View style={styles.postTextContainer}>
+                  <RichText
+                    enableTags
+                    value={richText}
+                    style={[a.flex_1, a.text_md]}
+                    numberOfLines={limitLines ? MAX_POST_LINES : undefined}
+                    authorHandle={post.author.handle}
                   />
-                ) : undefined}
-                {post.embed && (
-                  <View style={[a.pb_xs]}>
-                    <PostEmbeds embed={post.embed} moderation={moderation} />
-                  </View>
-                )}
-                <PostCtrls
-                  post={post}
-                  record={record}
-                  richText={richText}
-                  onPressReply={onPressReply}
-                  logContext="PostThreadItem"
+                </View>
+              ) : undefined}
+              {limitLines ? (
+                <TextLink
+                  text={_(msg`Show More`)}
+                  style={pal.link}
+                  onPress={onPressShowMore}
+                  href="#"
                 />
-              </View>
+              ) : undefined}
+              {post.embed && (
+                <View style={[a.pb_xs]}>
+                  <PostEmbeds embed={post.embed} moderation={moderation} />
+                </View>
+              )}
+              <PostCtrls
+                post={post}
+                record={record}
+                richText={richText}
+                onPressReply={onPressReply}
+                logContext="PostThreadItem"
+              />
             </View>
-            {hasMore ? (
-              <Link
-                style={[
-                  styles.loadMore,
-                  {
-                    paddingLeft: treeView ? 8 : 70,
-                    paddingTop: 0,
-                    paddingBottom: treeView ? 4 : 12,
-                  },
-                ]}
-                href={postHref}
-                title={itemTitle}
-                noFeedback>
-                <Text type="sm-medium" style={pal.textLight}>
-                  <Trans>More</Trans>
-                </Text>
-                <FontAwesomeIcon
-                  icon="angle-right"
-                  color={pal.colors.textLight}
-                  size={14}
-                />
-              </Link>
-            ) : undefined}
-          </PostHider>
-        </PostOuterWrapper>
-        <WhoCanReplyBlock post={post} isThreadAuthor={isThreadAuthor} />
-      </>
+          </View>
+          {hasMore ? (
+            <Link
+              style={[
+                styles.loadMore,
+                {
+                  paddingLeft: treeView ? 8 : 70,
+                  paddingTop: 0,
+                  paddingBottom: treeView ? 4 : 12,
+                },
+              ]}
+              href={postHref}
+              title={itemTitle}
+              noFeedback>
+              <Text type="sm-medium" style={pal.textLight}>
+                <Trans>More</Trans>
+              </Text>
+              <FontAwesomeIcon
+                icon="angle-right"
+                color={pal.colors.textLight}
+                size={14}
+              />
+            </Link>
+          ) : undefined}
+        </PostHider>
+      </PostOuterWrapper>
     )
   }
 }
@@ -671,7 +666,7 @@ function ExpandedPostDetails({
         s.mb10,
       ]}>
       <Text style={[a.text_sm, pal.textLight]}>{niceDate(post.indexedAt)}</Text>
-      <WhoCanReplyInline post={post} isThreadAuthor={isThreadAuthor} />
+      <WhoCanReply post={post} isThreadAuthor={isThreadAuthor} />
       {needsTranslation && (
         <>
           <Text style={[a.text_sm, pal.textLight]}>&middot;</Text>
-- 
cgit 1.4.1