feat(p/all): use multisub title, description and createdAt in mock description and board header

src/components/board-banner/board-banner.module.css

@@ -19,7 +19,7 @@
   color: var(--board-title-text-color);
 }
 
-.boardAddress {
+.boardSubtitle {
   font-size: var(--board-address-font-size);
   color: var(--board-address-text-color);
 }

src/components/board-banner/board-banner.tsx

@@ -1,7 +1,9 @@
-import { useParams } from 'react-router-dom';
-import { useAccountComment, useSubplebbit } from '@plebbit/plebbit-react-hooks';
 import { useState } from 'react';
+import { useLocation, useParams } from 'react-router-dom';
+import { useAccountComment, useSubplebbit } from '@plebbit/plebbit-react-hooks';
+import { isAllView, isSubscriptionsView } from '../../lib/utils/view-utils';
 import styles from './board-banner.module.css';
+import { useMultisubMetadata } from '../../hooks/use-default-subplebbits';
 
 const totalBanners = 57;
 
@@ -16,21 +18,31 @@ const ImageBanner = () => {
 };
 
 const BoardBanner = () => {
+  const location = useLocation();
   const params = useParams();
+
+  const isInAllView = isAllView(location.pathname);
+  const isInSubscriptionsView = isSubscriptionsView(location.pathname);
+
   const accountComment = useAccountComment({ commentIndex: params?.accountCommentIndex as any });
   const subplebbitAddress = params?.subplebbitAddress || accountComment?.subplebbitAddress;
 
   const subplebbit = useSubplebbit({ subplebbitAddress });
-  const { address, title } = subplebbit || {};
-  const displayAddress = address && address.length > 10 && !address.includes('.') ? address.slice(0, 13).concat('...') : address;
+  const displayAddress =
+    subplebbit?.address && subplebbit?.address.length > 10 && !subplebbit?.address.includes('.') ? subplebbit?.address.slice(0, 13).concat('...') : subplebbit?.address;
+
+  const multisubMetadata = useMultisubMetadata();
+
+  const title = isInAllView ? multisubMetadata?.title : isInSubscriptionsView ? 'Subscriptions' : subplebbit?.title;
+  const subtitle = isInAllView ? 'p/all' : isInSubscriptionsView ? 'p/subscriptions' : `p/${subplebbit?.address}`;
 
   return (
     <div className={styles.content}>
       <div className={styles.bannerCnt}>
-        <ImageBanner key={address} />
+        <ImageBanner key={isInAllView ? 'all' : isInSubscriptionsView ? 'subscriptions' : subplebbit?.address} />
       </div>
       <div className={styles.boardTitle}>{title || `p/${displayAddress}`}</div>
-      <div className={styles.boardAddress}>p/{address}</div>
+      <div className={styles.boardSubtitle}>{subtitle}</div>
       <hr />
     </div>
   );

src/components/subplebbit-description/subplebbit-description.tsx

@@ -1,5 +1,8 @@
 import Post from '../post';
 import { useTranslation } from 'react-i18next';
+import { isAllView } from '../../lib/utils/view-utils';
+import { useMultisubMetadata } from '../../hooks/use-default-subplebbits';
+import { useLocation } from 'react-router-dom';
 
 interface DescriptionPostProps {
   avatarUrl?: string;
@@ -12,14 +15,21 @@ interface DescriptionPostProps {
 
 const SubplebbitDescription = ({ avatarUrl, createdAt, description, shortAddress, subplebbitAddress, title }: DescriptionPostProps) => {
   const { t } = useTranslation();
+  const location = useLocation();
+  const isInAllView = isAllView(location.pathname);
+  const multisubMetadata = useMultisubMetadata();
+
   const post = {
     isDescription: true,
     subplebbitAddress,
-    timestamp: createdAt,
+    timestamp: isInAllView ? multisubMetadata?.createdAt : createdAt,
     author: { displayName: '## Board Mods' },
-    content: description,
+    content: isInAllView ? multisubMetadata?.description : description,
     link: avatarUrl,
-    title: t('welcome_to_board', { board: title || `p/${shortAddress}`, interpolation: { escapeValue: false } }),
+    title: t('welcome_to_board', {
+      board: isInAllView ? multisubMetadata?.title : title || `p/${shortAddress}`,
+      interpolation: { escapeValue: false },
+    }),
     pinned: true,
     locked: true,
   };