diff --git a/src/components/modals/AdminListModal.jsx b/src/components/modals/AdminListModal.jsx
new file mode 100644
index 00000000..1b598878
--- /dev/null
+++ b/src/components/modals/AdminListModal.jsx
@@ -0,0 +1,82 @@
+import React, { useEffect, useState, useRef } from 'react';
+import Modal from 'react-modal';
+import Draggable from 'react-draggable';
+import { StyledModal } from '../styled/modals/ReplyModal.styled';
+import useGeneralStore from '../../hooks/stores/useGeneralStore';
+import { BoardForm } from '../styled/views/Board.styled'
+import { Link } from 'react-router-dom';
+
+
+
+const AdminListModal = ({ isOpen, closeModal, roles }) => {
+ const {
+ selectedAddress,
+ selectedStyle,
+ selectedTitle,
+ } = useGeneralStore(state => state);
+
+ const [isMobile, setIsMobile] = useState(window.innerWidth <= 480);
+ const nodeRef = useRef(null);
+ const rolesList = roles
+ ? Object.entries(roles).map(([address, { role }]) => ({ address, role }))
+ : [];
+
+ useEffect(() => {
+ const handleResize = () => setIsMobile(window.innerWidth <= 480);
+ window.addEventListener('resize', handleResize);
+
+ // Cleanup function
+ return () => {
+ window.removeEventListener('resize', handleResize);
+ };
+ }, [setIsMobile]);
+
+
+ return (
+
+
+
+
+ Admins for {selectedTitle ?? selectedAddress}
+
+
+
+ {rolesList.map(({ address, role }, index) => (
+
+ • {}} className="quote-link">u/{address}: {role}
+
+ ))}
+
+
+
+
+
+ );
+};
+
+Modal.setAppElement('#root');
+
+export default AdminListModal;
\ No newline at end of file
diff --git a/src/components/views/Board.jsx b/src/components/views/Board.jsx
index 6e9d0bac..e0451dcc 100755
--- a/src/components/views/Board.jsx
+++ b/src/components/views/Board.jsx
@@ -14,6 +14,7 @@ import { PostMenuCatalog } from '../styled/views/Catalog.styled';
import EditModal from '../modals/EditModal';
import EditLabel from '../EditLabel';
import ImageBanner from '../ImageBanner';
+import AdminListModal from '../modals/AdminListModal';
import ModerationModal from '../modals/ModerationModal';
import OfflineIndicator from '../OfflineIndicator';
import PendingLabel from '../PendingLabel';
@@ -100,6 +101,7 @@ const Board = () => {
const { subscribed, subscribe, unsubscribe } = useSubscribe({subplebbitAddress: selectedAddress});
const stateString = useStateString(subplebbit);
+ const [isAdminListOpen, setIsAdminListOpen] = useState(false);
const [isReplyOpen, setIsReplyOpen] = useState(false);
const [isEditModalOpen, setIsEditModalOpen] = useState(false);
const [originalCommentContent, setOriginalCommentContent] = useState(null);
@@ -610,6 +612,21 @@ const Board = () => {
{((selectedTitle ? selectedTitle : selectedAddress) + " - plebchan")}
+ setIsAdminListOpen(false)}
+ roles={subplebbit.roles} />
+ setIsEditModalOpen(false)}
+ originalCommentContent={originalCommentContent} />
+ {setIsModerationOpen(false); setDeletePost(false)}}
+ deletePost={deletePost} />
{
selectedStyle={selectedStyle}
isOpen={isSettingsOpen}
closeModal={() => setIsSettingsOpen(false)} />
- {setIsModerationOpen(false); setDeletePost(false)}}
- deletePost={deletePost} />
- setIsEditModalOpen(false)}
- originalCommentContent={originalCommentContent} />
<>
@@ -822,7 +829,10 @@ const Board = () => {
Rules
- ## Board Admins
+ {setIsAdminListOpen(!isAdminListOpen)}}
+ >## Board Admins
{getDate(subplebbit.createdAt)}
@@ -894,7 +904,10 @@ const Board = () => {
- ## Board Admins
+ {setIsAdminListOpen(!isAdminListOpen)}}
+ >## Board Admins
@@ -961,7 +974,10 @@ const Board = () => {
Welcome to {subplebbit.title || subplebbit.address}
- ## Board Admins
+ {setIsAdminListOpen(!isAdminListOpen)}}
+ >## Board Admins
{getDate(subplebbit.createdAt)}
@@ -1031,7 +1047,10 @@ const Board = () => {
- ## Board Admins
+ {setIsAdminListOpen(!isAdminListOpen)}}
+ >## Board Admins
diff --git a/src/components/views/Description.jsx b/src/components/views/Description.jsx
index c61204fa..745f66ca 100644
--- a/src/components/views/Description.jsx
+++ b/src/components/views/Description.jsx
@@ -9,6 +9,7 @@ import { Container, NavBar, Header, Break, PostMenu, PostForm } from '../styled/
import { TopBar, BoardForm, Footer, ReplyFormLink} from '../styled/views/Thread.styled';
import { PostMenuCatalog } from '../styled/views/Catalog.styled';
import ImageBanner from '../ImageBanner';
+import AdminListModal from '../modals/AdminListModal';
import OfflineIndicator from '../OfflineIndicator';
import SettingsModal from '../modals/SettingsModal';
import getDate from '../../utils/getDate';
@@ -35,6 +36,7 @@ const Description = () => {
const postMenuRef = useRef(null);
const postMenuCatalogRef = useRef(null);
+ const [isAdminListOpen, setIsAdminListOpen] = useState(false);
const [prevScrollPos, setPrevScrollPos] = useState(0);
const [visible, setVisible] = useState(true);
const [menuPosition, setMenuPosition] = useState({top: 0, left: 0});
@@ -123,6 +125,11 @@ const Description = () => {
+ setIsAdminListOpen(false)}
+ roles={subplebbit.roles} />
{
Welcome to {subplebbit.title || subplebbit.address}
- ## Board Admins
+ {setIsAdminListOpen(!isAdminListOpen)}}
+ >## Board Admins
{getDate(subplebbit.createdAt)}
@@ -362,7 +372,10 @@ const Description = () => {
- ## Board Admins
+ {setIsAdminListOpen(!isAdminListOpen)}}
+ >## Board Admins
diff --git a/src/components/views/Rules.jsx b/src/components/views/Rules.jsx
index ceb2fdfb..8bb86f05 100644
--- a/src/components/views/Rules.jsx
+++ b/src/components/views/Rules.jsx
@@ -9,6 +9,7 @@ import { Container, NavBar, Header, Break, PostMenu, PostForm } from '../styled/
import { TopBar, BoardForm, Footer, ReplyFormLink} from '../styled/views/Thread.styled';
import { PostMenuCatalog } from '../styled/views/Catalog.styled';
import ImageBanner from '../ImageBanner';
+import AdminListModal from '../modals/AdminListModal';
import OfflineIndicator from '../OfflineIndicator';
import SettingsModal from '../modals/SettingsModal';
import getDate from '../../utils/getDate';
@@ -34,6 +35,7 @@ const Rules = () => {
const postMenuRef = useRef(null);
const postMenuCatalogRef = useRef(null);
+ const [isAdminListOpen, setIsAdminListOpen] = useState(false);
const [prevScrollPos, setPrevScrollPos] = useState(0);
const [visible, setVisible] = useState(true);
const [menuPosition, setMenuPosition] = useState({top: 0, left: 0});
@@ -122,6 +124,11 @@ const Rules = () => {
+ setIsAdminListOpen(false)}
+ roles={subplebbit.roles} />
{
Rules
- ## Board Admins
+ {setIsAdminListOpen(!isAdminListOpen)}}
+ >## Board Admins
{getDate(subplebbit.createdAt)}
@@ -342,7 +352,10 @@ const Rules = () => {
- ## Board Admins
+ {setIsAdminListOpen(!isAdminListOpen)}}
+ >## Board Admins
diff --git a/yarn.lock b/yarn.lock
index 10ff9117..e1ae8c3d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2722,21 +2722,6 @@
uuid "8.3.2"
zustand "4.0.0"
-"@plebbit/plebbit-react-hooks@https://github.com/plebbit/plebbit-react-hooks.git#efa802a1af8c75362e0d9a9afe1bc769f54e34cd":
- version "0.0.1"
- resolved "https://github.com/plebbit/plebbit-react-hooks.git#efa802a1af8c75362e0d9a9afe1bc769f54e34cd"
- dependencies:
- "@plebbit/plebbit-js" "https://github.com/plebbit/plebbit-js.git#77a05093408982086c02afea24e1d1923e1ae8a8"
- "@plebbit/plebbit-logger" "https://github.com/plebbit/plebbit-logger.git"
- assert "2.0.0"
- ethers "5.6.9"
- localforage "1.10.0"
- lodash.isequal "4.5.0"
- memoizee "0.4.15"
- quick-lru "5.1.1"
- uuid "8.3.2"
- zustand "4.0.0"
-
"@pmmmwh/react-refresh-webpack-plugin@^0.5.3":
version "0.5.10"
resolved "https://registry.yarnpkg.com/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.10.tgz#2eba163b8e7dbabb4ce3609ab5e32ab63dda3ef8"