External/5chan
1
0
Fork 0
mirror of https://github.com/bitsocialnet/5chan.git synced 2026-08-03 07:41:04 +02:00
Code Issues Packages Projects Releases Wiki Activity

add offline indicator to subscriptions mobile

Browse Source
This commit is contained in:
Tom
2023-05-06 16:10:27 +02:00
parent 511e2248c9
commit 75867699f5
3 changed files with 57 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/styled/Board.styled.jsx
+9
View File
@@ -2980,6 +2980,15 @@ export const BoardForm = styled.div`
@media (max-width: 480px) { @media (max-width: 480px) {
margin-bottom: 335px; margin-bottom: 335px;
.offline-mobile-sub {
width: 18px;
margin-right: 5px;
}
.offline-mobile-sub-reply {
width: 15px;
}
.thread { .thread {
display: none; display: none;
} }
src/components/views/Catalog.jsx
+1 -1
View File
@@ -53,7 +53,7 @@ const Catalog = () => {
const { subscribed, subscribe, unsubscribe } = useSubscribe({subplebbitAddress: selectedAddress}); const { subscribed, subscribe, unsubscribe } = useSubscribe({subplebbitAddress: selectedAddress});
const [errorMessage, setErrorMessage] = useState(null); const [errorMessage, setErrorMessage] = useState(null);
const [successMessage, setSuccessMessage] = useState(null); const [successMessage] = useState(null);
useError(errorMessage, [errorMessage]); useError(errorMessage, [errorMessage]);
useSuccess(successMessage, [successMessage]); useSuccess(successMessage, [successMessage]);
src/components/views/Subscriptions.jsx
+47 -17
View File
@@ -163,12 +163,11 @@ const Subscriptions = () => {
isOpen={isSettingsOpen} isOpen={isSettingsOpen}
closeModal={() => setIsSettingsOpen(false)} /> closeModal={() => setIsSettingsOpen(false)} />
<NavBar selectedStyle={selectedStyle}> <NavBar selectedStyle={selectedStyle}>
<> <>
<span className="boardList"> <span className="boardList">
[ [
<Link to="" onClick={() => {}}>Subscriptions</Link> <Link to={`/profile/p/subscriptions`}>Subscriptions</Link>
]&nbsp;[ ]&nbsp;[
</span>
{defaultSubplebbits.map((subplebbit, index) => ( {defaultSubplebbits.map((subplebbit, index) => (
<span className="boardList" key={`span-${subplebbit.address}`}> <span className="boardList" key={`span-${subplebbit.address}`}>
{index === 0 ? null : "\u00a0"} {index === 0 ? null : "\u00a0"}
@@ -179,9 +178,10 @@ const Subscriptions = () => {
className="offline-nav" className="offline-nav"
tooltipPlace="bottom" /> tooltipPlace="bottom" />
{index !== defaultSubplebbits.length - 1 ? " /" : null} {index !== defaultSubplebbits.length - 1 ? " /" : null}
</span> </span>
))} ))}
] ]
</span>
<span className="nav"> <span className="nav">
[ [
<button style={{all: 'unset', cursor: 'pointer'}} onClick={ <button style={{all: 'unset', cursor: 'pointer'}} onClick={
@@ -675,12 +675,27 @@ const Subscriptions = () => {
<span key={`p-t-mob-span-${index}`} className="date-time-mobile highlight-address-mobile"> <span key={`p-t-mob-span-${index}`} className="date-time-mobile highlight-address-mobile">
p/ p/
<Link key={`p-t-${index}`} to={`/p/${thread.subplebbitAddress}`} id="reply-button" title="Visit this board"> <Link key={`p-t-${index}`} to={`/p/${thread.subplebbitAddress}`} id="reply-button" title="Visit this board">
{thread.subplebbitAddress.includes(".eth") ? thread.subplebbitAddress : ( {thread.subplebbitAddress.includes(".eth") ?
<span key={`short-add${index}`} (
data-tooltip-id="tooltip" <>
data-tooltip-content={thread.subplebbitAddress} {thread.subplebbitAddress}
data-tooltip-place="top" <OfflineIndicator key={`offline-indicator-${index}`}
>{thread.subplebbitAddress.slice(0, 10) + "(...)"}</span> address={thread.subplebbitAddress}
tooltipPlace="top"
className="offline-mobile-sub" />
</>
) : (
<>
<span key={`short-add${index}`}
data-tooltip-id="tooltip"
data-tooltip-content={thread.subplebbitAddress}
data-tooltip-place="top"
>{thread.subplebbitAddress.slice(0, 10) + "(...)"}</span>
<OfflineIndicator key={`offline-indicator-${index}`}
address={thread.subplebbitAddress}
tooltipPlace="top"
className="offline-mobile-sub" />
</>
)} )}
</Link> </Link>
</span> </span>
@@ -826,12 +841,27 @@ const Subscriptions = () => {
<span key={`p-t-mob-span-${index}`} className="date-time-mobile highlight-address-mobile"> <span key={`p-t-mob-span-${index}`} className="date-time-mobile highlight-address-mobile">
&nbsp;p/ &nbsp;p/
<Link key={`p-t-${index}`} to={`/p/${thread.subplebbitAddress}`} id="reply-button" title="Visit this board"> <Link key={`p-t-${index}`} to={`/p/${thread.subplebbitAddress}`} id="reply-button" title="Visit this board">
{thread.subplebbitAddress.includes(".eth") ? thread.subplebbitAddress : ( {thread.subplebbitAddress.includes(".eth") ?
<span key={`short-add${index}`} (
data-tooltip-id="tooltip" <>
data-tooltip-content={thread.subplebbitAddress} {thread.subplebbitAddress}
data-tooltip-place="top" <OfflineIndicator key={`offline-indicator-${index}`}
>{thread.subplebbitAddress.slice(0, 10) + "(...)"}</span> address={thread.subplebbitAddress}
tooltipPlace="top"
className="offline-mobile-sub-reply" />
</>
) : (
<>
<span key={`short-add${index}`}
data-tooltip-id="tooltip"
data-tooltip-content={thread.subplebbitAddress}
data-tooltip-place="top"
>{thread.subplebbitAddress.slice(0, 10) + "(...)"}</span>
<OfflineIndicator key={`offline-indicator-${index}`}
address={thread.subplebbitAddress}
tooltipPlace="top"
className="offline-mobile-sub-reply" />
</>
)} )}
</Link> </Link>
</span> </span>