diff --git a/src/components/BoardSubscription.jsx b/src/components/BoardSubscription.jsx
deleted file mode 100644
index 17705a24..00000000
--- a/src/components/BoardSubscription.jsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import React from "react";
-import { useSubplebbit } from "@plebbit/plebbit-react-hooks";
-import { Tooltip } from 'react-tooltip';
-
-
-const BoardSubscription = ({ address }) => {
- const subplebbit = useSubplebbit({ subplebbitAddress: address });
- const isOnline = subplebbit.updatedAt > Date.now() / 1000 - 60 * 20;
-
- return (
- <>
- {address} {!isOnline && (
-
- )}
- >
- );
-};
-
-export default BoardSubscription;
\ No newline at end of file
diff --git a/src/components/OfflineIndicator.jsx b/src/components/OfflineIndicator.jsx
new file mode 100644
index 00000000..bae408c8
--- /dev/null
+++ b/src/components/OfflineIndicator.jsx
@@ -0,0 +1,28 @@
+import React from "react";
+import { useSubplebbit } from "@plebbit/plebbit-react-hooks";
+
+
+const OfflineIndicator = ({ address, className, tooltipPlace }) => {
+ const subplebbit = useSubplebbit({ subplebbitAddress: address });
+ const isOnline = subplebbit.updatedAt > Date.now() / 1000 - 60 * 20;
+
+ return (
+ <>
+ {!isOnline && (
+ <>
+ {" "}
+
+ >
+ )}
+ >
+ );
+};
+
+export default OfflineIndicator;
\ No newline at end of file
diff --git a/src/components/styled/Board.styled.jsx b/src/components/styled/Board.styled.jsx
index 93c3dc6e..f8461f5c 100644
--- a/src/components/styled/Board.styled.jsx
+++ b/src/components/styled/Board.styled.jsx
@@ -30,6 +30,12 @@ export const NavBar = styled.div`
#board-nav-mobile {
display: none;
}
+
+ .offline-nav {
+ width: 12px;
+ position: relative;
+ margin: 2px 2px -2px -2px;
+ }
}
@media (max-width: 480px) {
@@ -1617,6 +1623,13 @@ export const BoardForm = styled.div`
margin-top: 10px;
}
+ .offline-sub {
+ width: 13px;
+ margin-right: -5px;
+ margin-bottom: -2px;
+ position: relative;
+ }
+
${({ selectedStyle }) => {
switch (selectedStyle) {
case 'Yotsuba':
diff --git a/src/components/styled/Home.styled.jsx b/src/components/styled/Home.styled.jsx
index 954921d0..a9d0026a 100644
--- a/src/components/styled/Home.styled.jsx
+++ b/src/components/styled/Home.styled.jsx
@@ -286,18 +286,28 @@ export const BoardsContent = styled.div`
.boardlink, #view-all {
font-size: 1.2em;
}
+
+ .disconnected {
+ width: 15px;
+ margin-bottom: -1px;
+ position: absolute;
+ }
}
@media (min-width: 480px) {
#mobile-br {
display: none;
}
+
+ .disconnected {
+ width: 11px;
+ margin-bottom: -1px;
+ margin-top: 2px;
+ position: absolute;
+ }
}
- .disconnected {
- width: 13px;
- position: absolute;
- }
+
`;
export const Footer = styled.div`
diff --git a/src/components/views/Board.jsx b/src/components/views/Board.jsx
index 241c7612..c8466ef4 100644
--- a/src/components/views/Board.jsx
+++ b/src/components/views/Board.jsx
@@ -10,6 +10,7 @@ import useGeneralStore from '../../hooks/stores/useGeneralStore';
import { Container, NavBar, Header, Break, PostFormLink, PostFormTable, PostForm, TopBar, BoardForm } from '../styled/Board.styled';
import { Footer } from '../styled/Thread.styled';
import ImageBanner from '../ImageBanner';
+import OfflineIndicator from '../OfflineIndicator';
import Post from '../Post';
import PostLoader from '../PostLoader';
import ReplyModal from '../ReplyModal';
@@ -325,10 +326,8 @@ const Board = () => {
try {
if (subscribed === false) {
await subscribe(selectedAddress);
- setSuccessMessage(`Subscribed to ${selectedTitle ? selectedTitle : selectedAddress}`);
} else if (subscribed === true) {
await unsubscribe(selectedAddress);
- setSuccessMessage(`Unsubscribed from ${selectedTitle ? selectedTitle : selectedAddress}`);
}
} catch (error) {
setErrorMessage(error);
@@ -360,6 +359,10 @@ const Board = () => {
{index === 0 ? null : "\u00a0"}
handleClickTitle(subplebbit.title, subplebbit.address)}
>{subplebbit.title ? subplebbit.title : subplebbit.address}
+
{index !== defaultSubplebbits.length - 1 ? " /" : null}
))}
diff --git a/src/components/views/Catalog.jsx b/src/components/views/Catalog.jsx
index 38e125ff..30add702 100644
--- a/src/components/views/Catalog.jsx
+++ b/src/components/views/Catalog.jsx
@@ -10,6 +10,7 @@ import { Threads } from '../styled/Catalog.styled';
import { TopBar, Footer } from '../styled/Thread.styled';
import CatalogLoader from '../CatalogLoader';
import ImageBanner from '../ImageBanner';
+import OfflineIndicator from '../OfflineIndicator';
import SettingsModal from '../SettingsModal';
import getCommentMediaInfo from '../../utils/getCommentMediaInfo';
import handleStyleChange from '../../utils/handleStyleChange';
@@ -239,10 +240,8 @@ const Catalog = () => {
try {
if (subscribed === false) {
await subscribe(selectedAddress);
- setSuccessMessage(`Subscribed to ${selectedTitle ? selectedTitle : selectedAddress}`);
} else if (subscribed === true) {
await unsubscribe(selectedAddress);
- setSuccessMessage(`Unsubscribed from ${selectedTitle ? selectedTitle : selectedAddress}`);
}
} catch (error) {
setErrorMessage(error);
@@ -273,6 +272,10 @@ const Catalog = () => {
setSelectedAddress(subplebbit.address);
}}
>{subplebbit.title ? subplebbit.title : subplebbit.address}
+
{index !== defaultSubplebbits.length - 1 ? " /" : null}
))}
diff --git a/src/components/views/Home.jsx b/src/components/views/Home.jsx
index 7bf04feb..0d1ce4c9 100644
--- a/src/components/views/Home.jsx
+++ b/src/components/views/Home.jsx
@@ -5,7 +5,7 @@ import useGeneralStore from '../../hooks/stores/useGeneralStore';
import { Link, useNavigate } from 'react-router-dom';
import { Container, Header, Logo, Page, Search, About, AboutTitle, AboutContent, Boards, BoardsTitle, BoardsContent, Footer } from '../styled/Home.styled';
import BoardAvatar from '../BoardAvatar';
-import BoardSubscription from '../BoardSubscription';
+import OfflineIndicator from '../OfflineIndicator';
import packageJson from '../../../package.json'
import { Tooltip } from 'react-tooltip';
const {version} = packageJson
@@ -104,7 +104,11 @@ const Home = () => {
<>
-
+ {subscription}
+
>
diff --git a/src/components/views/Subscriptions.jsx b/src/components/views/Subscriptions.jsx
index 0f8c248d..bcbab54f 100644
--- a/src/components/views/Subscriptions.jsx
+++ b/src/components/views/Subscriptions.jsx
@@ -10,6 +10,7 @@ import useGeneralStore from '../../hooks/stores/useGeneralStore';
import { Container, NavBar, Header, Break, TopBar, BoardForm } from '../styled/Board.styled';
import { Footer } from '../styled/Thread.styled';
import ImageBanner from '../ImageBanner';
+import OfflineIndicator from '../OfflineIndicator';
import Post from '../Post';
import PostLoader from '../PostLoader';
import ReplyModal from '../ReplyModal';
@@ -173,6 +174,10 @@ const Subscriptions = () => {
{index === 0 ? null : "\u00a0"}
handleClickTitle(subplebbit.title, subplebbit.address)}
>{subplebbit.title ? subplebbit.title : subplebbit.address}
+
{index !== defaultSubplebbits.length - 1 ? " /" : null}
))}
@@ -387,6 +392,10 @@ const Subscriptions = () => {
>{thread.subplebbitAddress.slice(0, 10) + "(...)"}
)}
+
[
setSelectedThread(thread.cid)} className="reply-link" >Reply
diff --git a/src/components/views/Thread.jsx b/src/components/views/Thread.jsx
index 7fa3d912..74a0b97b 100644
--- a/src/components/views/Thread.jsx
+++ b/src/components/views/Thread.jsx
@@ -9,6 +9,7 @@ import useGeneralStore from '../../hooks/stores/useGeneralStore';
import { Container, NavBar, Header, Break, PostForm, PostFormTable } from '../styled/Board.styled';
import { ReplyFormLink, TopBar, BottomBar, BoardForm, Footer } from '../styled/Thread.styled';
import ImageBanner from '../ImageBanner';
+import OfflineIndicator from '../OfflineIndicator';
import Post from '../Post';
import PostLoader from '../PostLoader';
import ReplyModal from '../ReplyModal';
@@ -297,6 +298,10 @@ const Thread = () => {
setSelectedAddress(subplebbit.address);
}}
>{subplebbit.title ? subplebbit.title : subplebbit.address}
+
{index !== defaultSubplebbits.length - 1 ? " /" : null}
))}