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 subscribe button to catalog, fix in board

Browse Source
This commit is contained in:
Tom
2023-05-03 18:32:16 +02:00
parent dd4c6ef58c
commit 3b17609336
2 changed files with 35 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/views/Board.jsx
+3 -5
View File
@@ -325,18 +325,16 @@ const Board = () => {
try {
if (subscribed === false) {
await subscribe(selectedAddress);
setSuccessMessage(`Subscribed to ${selectedTitle ?? selectedAddress}`);
setSuccessMessage(`Subscribed to ${selectedTitle ? selectedTitle : selectedAddress}`);
} else if (subscribed === true) {
await unsubscribe(selectedAddress);
setSuccessMessage(`Unsubscribed from ${selectedTitle ?? selectedAddress}`);
setSuccessMessage(`Unsubscribed from ${selectedTitle ? selectedTitle : selectedAddress}`);
}
} catch (error) {
setErrorMessage(error);
}
};
return (
<>
<Helmet>
src/components/views/Catalog.jsx
+32 -8
View File
@@ -2,7 +2,7 @@ import React, { Fragment, useCallback, useEffect, useRef, useState } from 'react
import { Helmet } from 'react-helmet-async';
import InfiniteScroll from 'react-infinite-scroller';
import { Link, useNavigate, useParams } from 'react-router-dom';
import { useFeed, usePublishComment } from '@plebbit/plebbit-react-hooks';
import { useAccount, useFeed, usePublishComment, useSubscribe } from '@plebbit/plebbit-react-hooks';
import { debounce } from 'lodash';
import useGeneralStore from '../../hooks/stores/useGeneralStore';
import { Container, NavBar, Header, Break, PostForm, PostFormLink, PostFormTable } from '../styled/Board.styled';
@@ -15,6 +15,7 @@ import getCommentMediaInfo from '../../utils/getCommentMediaInfo';
import handleStyleChange from '../../utils/handleStyleChange';
import useClickForm from '../../hooks/useClickForm';
import useError from '../../hooks/useError';
import useSuccess from '../../hooks/useSuccess';
import packageJson from '../../../package.json'
const {version} = packageJson
@@ -37,6 +38,8 @@ const Catalog = () => {
showPostFormLink,
} = useGeneralStore(state => state);
const account = useAccount();
const nameRef = useRef();
const subjectRef = useRef();
const commentRef = useRef();
@@ -48,8 +51,12 @@ const Catalog = () => {
const { feed, hasMore, loadMore } = useFeed({subplebbitAddresses: [`${selectedAddress}`], sortType: 'new'});
const { subplebbitAddress } = useParams();
const { subscribed, subscribe, unsubscribe } = useSubscribe({subplebbitAddress: selectedAddress});
const [errorMessage, setErrorMessage] = useState(null);
const [successMessage, setSuccessMessage] = useState(null);
useError(errorMessage, [errorMessage]);
useSuccess(successMessage, [successMessage]);
const [triggerPublishComment, setTriggerPublishComment] = useState(false);
@@ -230,6 +237,19 @@ const Catalog = () => {
navigate(`/p/${selected}`);
};
const handleSubscribe = async () => {
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);
}
};
return (
<>
@@ -384,13 +404,17 @@ const Catalog = () => {
</div>
{feed.length > 0 ? (
<>
<span className="subscribe-button-desktop">
[
<button id="subscribe" style={{all: 'unset', cursor: 'pointer'}}>Subscribe</button>
]
</span>
<button className="subscribe-button-mobile btn-wrap">Subscribe</button>
</>
<span className="subscribe-button-desktop">
[
<button id="subscribe" style={{all: 'unset', cursor: 'pointer'}}
onClick={() => handleSubscribe()}>{subscribed ? "Unsubscribe" : "Subscribe"}
</button>
]
</span>
<button className="subscribe-button-mobile btn-wrap"
onClick={() => handleSubscribe()}>{subscribed ? "Unsubscribe" : "Subscribe"}
</button>
</>
) : (
<div id="stats" style={{float: "right", marginTop: "5px"}}>
<span>Fetching IPFS...</span>