feat(mod-queue): add view mode selection and integrate with post components

src/components/post-form/post-form.module.css

@@ -18,6 +18,18 @@
   margin-top: -3px;
 }
 
+.modQueueTitle {
+  font-size: 1.5em;
+  font-weight: bold;
+  padding: 10px 0;
+}
+
+@media (min-width: 640px) {
+  .modQueueTitle {
+    font-size: 1em;
+  }
+}
+
 .closed {
   font-size: x-large;
   text-align: center;

src/components/post-form/post-form.tsx

@@ -8,7 +8,7 @@ import useSubplebbitsPagesStore from '@plebbit/plebbit-react-hooks/dist/stores/s
 import { getHasThumbnail, getLinkMediaInfo } from '../../lib/utils/media-utils';
 import { formatMarkdown } from '../../lib/utils/post-utils';
 import { isValidURL } from '../../lib/utils/url-utils';
-import { isAllView, isCatalogView, isModView, isPostPageView, isSubscriptionsView } from '../../lib/utils/view-utils';
+import { isAllView, isCatalogView, isModQueueView, isModView, isPostPageView, isSubscriptionsView } from '../../lib/utils/view-utils';
 import { useDefaultSubplebbits } from '../../hooks/use-default-subplebbits';
 import { useResolvedSubplebbitAddress } from '../../hooks/use-resolved-subplebbit-address';
 import useFetchGifFirstFrame from '../../hooks/use-fetch-gif-first-frame';
@@ -373,6 +373,7 @@ const PostForm = () => {
   const isInPostView = isPostPageView(location.pathname, params);
   const isInAllView = isAllView(location.pathname);
   const isInModView = isModView(location.pathname);
+  const isInModQueueView = isModQueueView(location.pathname);
   const isInSubscriptionsView = isSubscriptionsView(location.pathname, params);
   const isInCatalogView = isCatalogView(location.pathname, params);
 
@@ -398,7 +399,9 @@ const PostForm = () => {
     <>
       <div className={styles.postFormDesktop}>
         {!(isInAllView || isInSubscriptionsView || isInModView) && showForm && <OfflineAlert subplebbitAddress={subplebbitAddress} />}
-        {isThreadClosed ? (
+        {isInModQueueView ? (
+          <div className={styles.modQueueTitle}>{t('moderation_queue')}</div>
+        ) : isThreadClosed ? (
           <div className={styles.closed}>
             {t('thread_closed')}
             <br />
@@ -418,7 +421,9 @@ const PostForm = () => {
       </div>
       <div className={styles.postFormMobile}>
         {!(isInAllView || isInSubscriptionsView || isInModView) && showForm && <OfflineAlert subplebbitAddress={subplebbitAddress} />}
-        {isThreadClosed ? (
+        {isInModQueueView ? (
+          <div className={styles.modQueueTitle}>{t('moderation_queue')}</div>
+        ) : isThreadClosed ? (
           <div className={styles.closed}>
             {t('thread_closed')}
             <br />