feat(board header): add yellow offline icon for loading online status, red icon for offline status

src/stores/use-subplebbit-offline-store.ts

@@ -0,0 +1,51 @@
+import { create } from 'zustand';
+
+interface SubplebbitOfflineState {
+  state?: string;
+  updatedAt?: number;
+  updatingState?: string;
+  initialLoad: boolean;
+}
+
+interface SubplebbitOfflineStore {
+  subplebbitOfflineState: Record<string, SubplebbitOfflineState>;
+  setSubplebbitOfflineState: (address: string, state: Partial<SubplebbitOfflineState>) => void;
+  initializesubplebbitOfflineState: (address: string) => void;
+}
+
+const useSubplebbitOfflineStore = create<SubplebbitOfflineStore>((set) => ({
+  subplebbitOfflineState: {},
+  setSubplebbitOfflineState: (address, newState) =>
+    set((state) => ({
+      subplebbitOfflineState: {
+        ...state.subplebbitOfflineState,
+        [address]: {
+          ...state.subplebbitOfflineState[address],
+          ...newState,
+        },
+      },
+    })),
+  initializesubplebbitOfflineState: (address) => {
+    set((state) => ({
+      subplebbitOfflineState: {
+        ...state.subplebbitOfflineState,
+        [address]: {
+          initialLoad: true,
+        },
+      },
+    }));
+    setTimeout(() => {
+      set((state) => ({
+        subplebbitOfflineState: {
+          ...state.subplebbitOfflineState,
+          [address]: {
+            ...state.subplebbitOfflineState[address],
+            initialLoad: false,
+          },
+        },
+      }));
+    }, 7000);
+  },
+}));
+
+export default useSubplebbitOfflineStore;