From 256ed6a106c704b1b702355681a43d8607f9abb8 Mon Sep 17 00:00:00 2001
From: saltrafael <oversaid_logodaedaly@slmail.me>
Date: Mon, 4 Oct 2021 16:25:43 -0300
Subject: [PATCH] Remove expand/collapse from channel discussion page

---
 ui/component/channelDiscussion/view.jsx |  2 +-
 ui/component/commentsList/view.jsx      | 13 ++++++++-----
 ui/page/file/view.jsx                   |  2 +-
 3 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/ui/component/channelDiscussion/view.jsx b/ui/component/channelDiscussion/view.jsx
index 15b215f50..ed1b8d97e 100644
--- a/ui/component/channelDiscussion/view.jsx
+++ b/ui/component/channelDiscussion/view.jsx
@@ -17,7 +17,7 @@ function ChannelDiscussion(props: Props) {
   }
   return (
     <section className="section">
-      <CommentsList uri={uri} linkedCommentId={linkedCommentId} />
+      <CommentsList uri={uri} linkedCommentId={linkedCommentId} commentsAreExpanded />
     </section>
   );
 }
diff --git a/ui/component/commentsList/view.jsx b/ui/component/commentsList/view.jsx
index 29023e241..debff2d0e 100644
--- a/ui/component/commentsList/view.jsx
+++ b/ui/component/commentsList/view.jsx
@@ -48,6 +48,7 @@ type Props = {
   activeChannelId: ?string,
   settingsByChannelId: { [channelId: string]: PerChannelSettings },
   fetchReacts: (Array<string>) => Promise<any>,
+  commentsAreExpanded?: boolean,
   fetchTopLevelComments: (string, number, number, number) => void,
   fetchComment: (string) => void,
   resetComments: (string) => void,
@@ -74,6 +75,7 @@ function CommentList(props: Props) {
     activeChannelId,
     settingsByChannelId,
     fetchReacts,
+    commentsAreExpanded,
     fetchTopLevelComments,
     fetchComment,
     resetComments,
@@ -88,7 +90,8 @@ function CommentList(props: Props) {
   const fetchedCommentsOnce = useFetched(isFetchingComments);
   const fetchedReactsOnce = useFetched(isFetchingReacts);
   const fetchedLinkedComment = useFetched(isFetchingCommentsById);
-  const [expandedComments, setExpandedComments] = React.useState(!isMobile && !isMediumScreen);
+  const hasDefaultExpansion = commentsAreExpanded || (!isMobile && !isMediumScreen);
+  const [expandedComments, setExpandedComments] = React.useState(hasDefaultExpansion);
   const totalFetchedComments = allCommentIds ? allCommentIds.length : 0;
   const channelId = getChannelIdFromClaim(claim);
   const channelSettings = channelId ? settingsByChannelId[channelId] : undefined;
@@ -203,7 +206,7 @@ function CommentList(props: Props) {
     }
 
     const handleCommentScroll = debounce(() => {
-      if (!isMobile && !isMediumScreen && shouldFetchNextPage(page, topLevelTotalPages, window, document)) {
+      if (hasDefaultExpansion && shouldFetchNextPage(page, topLevelTotalPages, window, document)) {
         setPage(page + 1);
       }
     }, DEBOUNCE_SCROLL_HANDLER_MS);
@@ -216,7 +219,7 @@ function CommentList(props: Props) {
         return () => window.removeEventListener('scroll', handleCommentScroll);
       }
     }
-  }, [isFetchingComments, isMediumScreen, isMobile, moreBelow, page, readyToDisplayComments, topLevelTotalPages]);
+  }, [hasDefaultExpansion, isFetchingComments, moreBelow, page, readyToDisplayComments, topLevelTotalPages]);
 
   const getCommentElems = (comments) => {
     return comments.map((comment) => (
@@ -299,7 +302,7 @@ function CommentList(props: Props) {
             {readyToDisplayComments && topLevelComments && getCommentElems(topLevelComments)}
           </ul>
 
-          {(isMobile || isMediumScreen) && (
+          {!hasDefaultExpansion && (
             <div className="card__bottom-actions--comments">
               {(!expandedComments || moreBelow) && (
                 <Button
@@ -320,7 +323,7 @@ function CommentList(props: Props) {
             </div>
           )}
 
-          {(isFetchingComments || (!isMobile && !isMediumScreen && moreBelow)) && (
+          {(isFetchingComments || (hasDefaultExpansion && moreBelow)) && (
             <div className="main--empty" ref={spinnerRef}>
               <Spinner type="small" />
             </div>
diff --git a/ui/page/file/view.jsx b/ui/page/file/view.jsx
index 199db9133..f0954e4a3 100644
--- a/ui/page/file/view.jsx
+++ b/ui/page/file/view.jsx
@@ -220,7 +220,7 @@ function FilePage(props: Props) {
       {!collection && !isMarkdown && !videoTheaterMode && <RecommendedContent uri={uri} />}
       {isMarkdown && (
         <div className="file-page__post-comments">
-          <CommentsList uri={uri} linkedCommentId={linkedCommentId} />
+          <CommentsList uri={uri} linkedCommentId={linkedCommentId} commentsAreExpanded />
         </div>
       )}
     </Page>