diff --git a/src/components/views/Home.jsx b/src/components/views/Home.jsx index fa88c6ee..9da3cdba 100644 --- a/src/components/views/Home.jsx +++ b/src/components/views/Home.jsx @@ -13,264 +13,264 @@ const { version } = packageJson; const commitRef = process?.env?.REACT_APP_COMMIT_REF ? ` ${process.env.REACT_APP_COMMIT_REF.slice(0, 7)}` : ''; const SubplebbitTitle = ({ address }) => { - const subplebbitAddress = address; - const subplebbit = useSubplebbit({ subplebbitAddress }); - const title = subplebbit.title ?? null; + const subplebbitAddress = address; + const subplebbit = useSubplebbit({ subplebbitAddress }); + const title = subplebbit.title ?? null; - return <>{title ? {title} :  }; + return <>{title ? {title} :  }; }; const Home = () => { - const { bodyStyle, setBodyStyle, defaultSubplebbits, setSelectedAddress, selectedStyle, setSelectedStyle, setSelectedTitle } = useGeneralStore((state) => state); + const { bodyStyle, setBodyStyle, defaultSubplebbits, setSelectedAddress, selectedStyle, setSelectedStyle, setSelectedTitle } = useGeneralStore((state) => state); - const account = useAccount(); - const navigate = useNavigate(); + const account = useAccount(); + const navigate = useNavigate(); - const inputRef = useRef(null); - const prevStyle = useRef(selectedStyle); - const prevBodyStyle = useRef(bodyStyle); + const inputRef = useRef(null); + const prevStyle = useRef(selectedStyle); + const prevBodyStyle = useRef(bodyStyle); - const [isCreateBoardOpen, setIsCreateBoardOpen] = useState(false); + const [isCreateBoardOpen, setIsCreateBoardOpen] = useState(false); - // prevent dark mode - useEffect(() => { - const currentPrevStyle = prevStyle.current; - const currentPrevBodyStyle = prevBodyStyle.current; + // prevent dark mode + useEffect(() => { + const currentPrevStyle = prevStyle.current; + const currentPrevBodyStyle = prevBodyStyle.current; - setBodyStyle({ - background: '#ffe url(assets/fade.png) top repeat-x', - color: 'maroon', - fontFamily: 'Helvetica, Arial, sans-serif', - }); - setSelectedStyle('Yotsuba'); + setBodyStyle({ + background: '#ffe url(assets/fade.png) top repeat-x', + color: 'maroon', + fontFamily: 'Helvetica, Arial, sans-serif', + }); + setSelectedStyle('Yotsuba'); - return () => { - setSelectedStyle(currentPrevStyle); - setBodyStyle(currentPrevBodyStyle); - }; - }, [setBodyStyle, setSelectedStyle]); + return () => { + setSelectedStyle(currentPrevStyle); + setBodyStyle(currentPrevBodyStyle); + }; + }, [setBodyStyle, setSelectedStyle]); - return ( - <> - setIsCreateBoardOpen(false)} /> - - plebchan - - - -
- - - plebchan - - -
- - - { - if (event.key === 'Enter') { - event.preventDefault(); - const address = inputRef.current.value; - if (address) { - setSelectedAddress(address); - navigate(`/p/${address}`); - } - } - }} - /> - { - const address = inputRef.current.value; - if (address) { - setSelectedAddress(address); - navigate(`/p/${address}`); - } - }} - /> - - - -

What is plebchan?

- - -
-

- Plebchan is the only serverless, adminless, fully decentralized 4chan alternative where any pleb can create and own unlimited boards, and nobody can - take them down. Boards can always find competition, and board owners can monetize freely, so janitors aren't needed. Plebchan is a client for{' '} - - plebbit - - , a pure P2P protocol and tooling for creating decentralized forum applications. All data is just text, and plebchan's speed depends on how many users - are{' '} - - . Search for any board address above, or feel free to click on a popular board below that interests you and jump right in!{' '} -

-
-

There are no global rules, each board is completely independent and its owner decides how/if it should be moderated.

-
-

- {' '} - HOW TO RUN A BOARD (currently via CLI only): (1) have a computer you can use as server, because users will connect to your board - peer-to-peer; (2) go to{' '} - - https://github.com/plebbit/plebbit-cli#install - {' '} - and follow the instructions to run your daemon, create a subplebbit (board) and edit its settings; (3) users can always connect to your - board via its address, but it can be whitelisted by submitting a pull request here:{' '} - - https://github.com/plebbit/temporary-default-subplebbits - {' '} - this will be automated with a plebbit DAO using the plebbit token. -

-
- - - {account?.subscriptions?.length > 0 ? ( - - -

Subscriptions

- - -

- You have subscribed to {account?.subscriptions?.length} board{account?.subscriptions?.length > 1 ? 's' : null} -

-   - { - window.scrollTo(0, 0); - }} - > - [view all] - -
- {account?.subscriptions?.map((subscription, index) => ( - - { - window.scrollTo(0, 0); - }} - to={`/p/${subscription}`} - > -
- {subscription}  - - -
- - ))} -
- - - ) : null} - - -

Whitelisted Boards

- - - {defaultSubplebbits.map((subplebbit, index) => ( -
-
- {subplebbit.title ?? } -
-
- { - setSelectedTitle(subplebbit.title); - setSelectedAddress(subplebbit.address); - window.scrollTo(0, 0); - }} - > - - - -
-
- {subplebbit.address} -
-
- ))} - - - - -
- plebchan v{version} - {commitRef}. GPL-2.0 -
- - - ); + return ( + <> + setIsCreateBoardOpen(false)} /> + + plebchan + + + +
+ + + plebchan + + +
+ + + { + if (event.key === 'Enter') { + event.preventDefault(); + const address = inputRef.current.value; + if (address) { + setSelectedAddress(address); + navigate(`/p/${address}`); + } + } + }} + /> + { + const address = inputRef.current.value; + if (address) { + setSelectedAddress(address); + navigate(`/p/${address}`); + } + }} + /> + + + +

What is plebchan?

+ + +
+

+ Plebchan is the only serverless, adminless, fully decentralized 4chan alternative where any pleb can create and own unlimited boards, and nobody can + take them down. Boards can always find competition, and board owners can monetize freely, so janitors aren't needed. Plebchan is a client for{' '} + + plebbit + + , a pure P2P protocol and tooling for creating decentralized forum applications. All data is just text, and plebchan's speed depends on how many users + are{' '} + + . Search for any board address above, or feel free to click on a popular board below that interests you and jump right in!{' '} +

+
+

There are no global rules, each board is completely independent and its owner decides how/if it should be moderated.

+
+

+ {' '} + HOW TO RUN A BOARD (currently via CLI only): (1) have a computer you can use as server, because users will connect to your board + peer-to-peer; (2) go to{' '} + + https://github.com/plebbit/plebbit-cli#install + {' '} + and follow the instructions to run your daemon, create a subplebbit (board) and edit its settings; (3) users can always connect to your + board via its address, but it can be added below by submitting a pull request here:{' '} + + https://github.com/plebbit/temporary-default-subplebbits + {' '} + this will be automated with a plebbit DAO using the plebbit token. +

+
+ + + {account?.subscriptions?.length > 0 ? ( + + +

Subscriptions

+ + +

+ You have subscribed to {account?.subscriptions?.length} board{account?.subscriptions?.length > 1 ? 's' : null} +

+   + { + window.scrollTo(0, 0); + }} + > + [view all] + +
+ {account?.subscriptions?.map((subscription, index) => ( + + { + window.scrollTo(0, 0); + }} + to={`/p/${subscription}`} + > +
+ {subscription}  + + +
+ + ))} +
+ + + ) : null} + + +

Default Boards

+ + + {defaultSubplebbits.map((subplebbit, index) => ( +
+
+ {subplebbit.title ?? } +
+
+ { + setSelectedTitle(subplebbit.title); + setSelectedAddress(subplebbit.address); + window.scrollTo(0, 0); + }} + > + + + +
+
+ {subplebbit.address} +
+
+ ))} + + + + +
+ plebchan v{version} + {commitRef}. GPL-2.0 +
+ + + ); }; export default Home;