feat(board): add p/all and p/subscriptions

src/views/board/board.tsx

@@ -1,9 +1,11 @@
 import { useEffect, useMemo, useRef } from 'react';
 import { useLocation, useParams } from 'react-router-dom';
-import { useFeed, useSubplebbit } from '@plebbit/plebbit-react-hooks';
+import { useAccount, useFeed, useSubplebbit } from '@plebbit/plebbit-react-hooks';
 import { Virtuoso, VirtuosoHandle, StateSnapshot } from 'react-virtuoso';
 import { useTranslation } from 'react-i18next';
 import styles from './board.module.css';
+import { isAllView, isSubscriptionsView } from '../../lib/utils/view-utils';
+import { useDefaultSubplebbitAddresses } from '../../hooks/use-default-subplebbits';
 import useFeedStateString from '../../hooks/use-feed-state-string';
 import useReplyModal from '../../hooks/use-reply-modal';
 import LoadingEllipsis from '../../components/loading-ellipsis';
@@ -19,12 +21,30 @@ const Board = () => {
   const { t } = useTranslation();
   const location = useLocation();
   const { subplebbitAddress } = useParams<{ subplebbitAddress: string }>();
-  const subplebbitAddresses = useMemo(() => [subplebbitAddress], [subplebbitAddress]) as string[];
+
+  const isInAllView = isAllView(location.pathname);
+  const defaultSubplebbitAddresses = useDefaultSubplebbitAddresses();
+
+  const account = useAccount();
+  const subscriptions = account?.subscriptions;
+  const isInSubscriptionsView = isSubscriptionsView(location.pathname);
+
+  const subplebbitAddresses = useMemo(() => {
+    if (isInAllView) {
+      return defaultSubplebbitAddresses;
+    }
+    if (isInSubscriptionsView) {
+      return subscriptions || [];
+    }
+    return [subplebbitAddress];
+  }, [isInAllView, isInSubscriptionsView, subplebbitAddress, defaultSubplebbitAddresses, subscriptions]);
+
   const sortType = 'active';
   const { feed, hasMore, loadMore } = useFeed({ subplebbitAddresses, sortType });
 
   const subplebbit = useSubplebbit({ subplebbitAddress });
-  const { createdAt, description, rules, shortAddress, state, suggested, title } = subplebbit || {};
+  const { createdAt, description, rules, shortAddress, state, suggested } = subplebbit || {};
+  const title = isInAllView ? t('all') : isInSubscriptionsView ? t('subscriptions') : subplebbit?.title;
 
   const { activeCid, closeModal, openReplyModal, showReplyModal, scrollY } = useReplyModal();
 
@@ -69,16 +89,17 @@ const Board = () => {
       {feed.length > 0 && (
         <>
           {rules && rules.length > 0 && <SubplebbitRules subplebbitAddress={subplebbitAddress} createdAt={createdAt} rules={rules} />}
-          {description && description.length > 0 && (
-            <SubplebbitDescription
-              avatarUrl={suggested?.avatarUrl}
-              subplebbitAddress={subplebbitAddress}
-              createdAt={createdAt}
-              description={description}
-              shortAddress={shortAddress}
-              title={title}
-            />
-          )}
+          {(description && description.length > 0) ||
+            (isInAllView && (
+              <SubplebbitDescription
+                avatarUrl={suggested?.avatarUrl}
+                subplebbitAddress={subplebbitAddress}
+                createdAt={createdAt}
+                description={description}
+                shortAddress={shortAddress}
+                title={title}
+              />
+            ))}
         </>
       )}
       <Virtuoso

src/views/home/home.tsx

@@ -115,6 +115,15 @@ const Boards = ({ multisub, subplebbits }: { multisub: Subplebbit[]; subplebbits
       </div>
       <div className={styles.boardsBoxContent}>
         <div className={styles.column}>
+          <h3>Multiboards</h3>
+          <div className={styles.list}>
+            <div className={styles.subplebbit}>
+              <Link to='/p/all'>All</Link>
+            </div>
+            <div className={styles.subplebbit}>
+              <Link to='/p/subscriptions'>Subscriptions</Link>
+            </div>
+          </div>
           <h3>Plebbit</h3>
           <div className={styles.list}>
             {plebbitSubs.map((sub) => (