feat: add offline icon to board title, show alert before posting if sub appears offline

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

@@ -28,6 +28,16 @@
   width: 90%;
 }
 
+.offlineIcon {
+ background-image: url('/public/assets/icons/offline.png');
+ display: inline-block;
+ margin-left: 10px;
+ width: 16px;
+ height: 16px;
+ background-repeat: no-repeat;
+ background-size: contain;
+ image-rendering: pixelated;
+}
 
 @media (max-width: 640px) {
   .bannerCnt {

src/components/board-header/board-header.tsx

@@ -34,12 +34,17 @@ const BoardHeader = () => {
   const title = isInAllView ? multisubMetadata?.title : isInSubscriptionsView ? 'Subscriptions' : subplebbit?.title;
   const subtitle = isInAllView ? 'p/all' : isInSubscriptionsView ? 'p/subscriptions' : `p/${address}`;
 
+  const isBoardOffline = subplebbit?.updatedAt && subplebbit.updatedAt < Date.now() / 1000 - 60 * 60;
+
   return (
     <div className={styles.content}>
       <div className={styles.bannerCnt}>
         <ImageBanner key={isInAllView ? 'all' : isInSubscriptionsView ? 'subscriptions' : address} />
       </div>
-      <div className={styles.boardTitle}>{title || `p/${shortAddress || subplebbitAddress}`}</div>
+      <div className={styles.boardTitle}>
+        {title || `p/${shortAddress || subplebbitAddress}`}
+        {isBoardOffline && <span className={styles.offlineIcon} />}
+      </div>
       <div className={styles.boardSubtitle}>{subtitle}</div>
       <hr />
     </div>