[Glitch] Change labels on thread indicators in web UI

Partial port of a021dee642 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>

app/javascript/flavours/glitch/components/status_prepend.jsx

@@ -150,11 +150,13 @@ export default class StatusPrepend extends PureComponent {
 
     return !type ? null : (
       <aside className={type === 'reblogged_by' || type === 'featured' ? 'status__prepend' : 'notification__message'}>
-        <Icon
-          className={`status__prepend-icon ${type === 'favourite' ? 'star-icon' : ''}`}
-          id={iconId}
-          icon={iconComponent}
-        />
+        <div className='status__prepend__icon'>
+          <Icon
+            className={type === 'favourite' ? 'star-icon' : null}
+            id={iconId}
+            icon={iconComponent}
+          />
+        </div>
         <Message />
         {children}
       </aside>

app/javascript/flavours/glitch/components/status_thread_label.tsx

@@ -0,0 +1,50 @@
+import { FormattedMessage } from 'react-intl';
+
+import ReplyIcon from '@/material-icons/400-24px/reply.svg?react';
+import { Icon } from 'flavours/glitch/components/icon';
+import { DisplayedName } from 'flavours/glitch/features/notifications_v2/components/displayed_name';
+import { useAppSelector } from 'flavours/glitch/store';
+
+export const StatusThreadLabel: React.FC<{
+  accountId: string;
+  inReplyToAccountId: string;
+}> = ({ accountId, inReplyToAccountId }) => {
+  const inReplyToAccount = useAppSelector((state) =>
+    state.accounts.get(inReplyToAccountId),
+  );
+
+  let label;
+
+  if (accountId === inReplyToAccountId) {
+    label = (
+      <FormattedMessage
+        id='status.continued_thread'
+        defaultMessage='Continued thread'
+      />
+    );
+  } else if (inReplyToAccount) {
+    label = (
+      <FormattedMessage
+        id='status.replied_to'
+        defaultMessage='Replied to {name}'
+        values={{ name: <DisplayedName accountIds={[inReplyToAccountId]} /> }}
+      />
+    );
+  } else {
+    label = (
+      <FormattedMessage
+        id='status.replied_in_thread'
+        defaultMessage='Replied in thread'
+      />
+    );
+  }
+
+  return (
+    <div className='status__prepend'>
+      <div className='status__prepend__icon'>
+        <Icon id='reply' icon={ReplyIcon} />
+      </div>
+      {label}
+    </div>
+  );
+};