fix: Read more button always shown

Author: null2264

CHANGELOG.md

@@ -5,6 +5,9 @@
 - Type: changes
 -->
 
+## 2023.10.2
+- UI: fixed read more button always shown
+
 ## 2023.10.1
 - Dev: move files from `app/` to `src/`
 - Dev: cache translation instead always requesting new one

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ghostbox",
-  "version": "2023.10.1",
+  "version": "2023.10.2",
   "displayName": "Ghostbox",
   "description": "An alternative frontend for Akkoma",
   "homepage": "https://fedi.aap.my.id",

src/soapbox/components/status-content.tsx

@@ -34,6 +34,7 @@ const StatusContent: React.FC<IStatusContent> = ({
 }) => {
   const history = useHistory();
 
+  const [isCollapsable, setCollapsable] = useState(false);
   const [collapsed, setCollapsed] = useState(false);
   const [onlyEmoji, setOnlyEmoji] = useState(false);
 
@@ -102,6 +103,7 @@ const StatusContent: React.FC<IStatusContent> = ({
 
     if (collapsable && !collapsed) {
       if (node.current.clientHeight > MAX_HEIGHT) {
+        setCollapsable(true);
         setCollapsed(true);
       }
     }
@@ -161,7 +163,7 @@ const StatusContent: React.FC<IStatusContent> = ({
     />,
   ];
 
-  if (collapsable && collapsed) {
+  if (isCollapsable && collapsed) {
     output.push(
       <div className='flex w-full justify-center pt-2' role='button' tabIndex={0} onClick={toggleCollapsed}>
         <Button
@@ -181,7 +183,7 @@ const StatusContent: React.FC<IStatusContent> = ({
     output.push(<Poll id={status.poll} key='poll' status={status.url} />);
   }
 
-  if (collapsable && !collapsed) {
+  if (isCollapsable && !collapsed) {
     output.push(
       <div className='flex w-full justify-center pt-2' role='button' tabIndex={0} onClick={toggleCollapsed}>
         <Button