From 7b1ebf7eecafff97d2cdf88dd318233b07109b18 Mon Sep 17 00:00:00 2001 From: "plebeius.eth" Date: Fri, 12 Jan 2024 13:40:09 +0100 Subject: [PATCH] feat(sidebar): add moderation tools and community settings link --- public/assets/community_settings.png | Bin 0 -> 1146 bytes src/components/sidebar/sidebar.module.css | 25 ++++++++++++++ src/components/sidebar/sidebar.tsx | 31 +++++++++++++++--- .../subplebbit-settings.module.css | 17 +++++++++- .../subplebbit-settings.tsx | 6 +++- src/views/subplebbit/subplebbit.module.css | 1 + src/views/subplebbits/subplebbits.tsx | 1 - 7 files changed, 73 insertions(+), 8 deletions(-) create mode 100644 public/assets/community_settings.png diff --git a/public/assets/community_settings.png b/public/assets/community_settings.png new file mode 100644 index 0000000000000000000000000000000000000000..3472a1c0131e6c3090ce7dd23bb65ca66d863e92 GIT binary patch literal 1146 zcmeAS@N?(olHy`uVBq!ia0vp^{2CS5^;dDAA(5FO z5hW46K32*3xq68y`AMmI6}bf<1q?P7RzPNMYDuC(MQ%=Bu~mhw5?F;5kPQ;nS5g2g zDap1~itr6kaLzAERWQ>t&@)i7<5EyiuqjGOvkG!?gK7uzY?U%fN(!v>^~=l4^~#O) z@{7{-4J|D#^$m>ljf`}GDs+o0^GXscbn}XpA%?)raY-#sF3Kz@$;{7F0GXSZlwVq6 ztE2?72o50bEXhnm*pycc^%l^B`XCv7Lp=k1xY|DM$yRxSGPh`0m%>Py3O0z&qfS|2PV8W%*=qX_LK+;rIni2{8O~>$ZG4op8D*@Ip%d@9QtCF`-Cd1 z_+u8D^|;L4vF#!6&VLJD&GFII`s|kXJbng$nZm>OhohcHuIQ8P=np;cf74e!b?(Vu z&37&Mxc-z*$vvBfjVmP$yN|>>9yKUBoh2y!^`KkOiBozG&vq$Iov3^9i*aVc|8Gtu zRcikwPI!EEUMRnCnoN^iPV-s654jimkH}n(?g;bti8MK%rN;BE`}tSaiI*kKr^Me4 z@a}h*oy8cqY+*{8V)L;NDSOze^=-L5QamHC^Q!O)FH2K+^17k+o$eLg;|qQ5T9!z7 zsG2F?F>d+FK3m{Yh@!&B(kM3Jw##-MKg!KNt?E+}t?Dt6Zk?y$wxpaP<-YBjlj~Eg zcf9c1BsQ&PGpBHEZiY>cQmUBJi`+I=-r|kD9Q(g>DxEwbZuKU#bx}&xweY&fwIxE! zz1TObeW!Fuy-F~nJo$qwPvdoG4XZ+N)u+)9HDb1$E=!(Oe538+H{;&BPje!COD*P1 z{`EzsFH1a4DX^!C>BXsCJsy|Y)3(mvTI`xFrgHZ9$$H(Sz1r$KH> { + const { t } = useTranslation(); + const location = useLocation(); + const params = useParams(); + const isInSubplebbitSettingsView = isSubplebbitSettingsView(location.pathname, params); + + return ( +
+
moderation tools
+
    +
  • + + {t('community_settings')} + +
    • +
+
+ ); +}; + const Sidebar = ({ address, cid, createdAt, description, downvoteCount = 0, roles, rules, timestamp = 0, title, updatedAt, upvoteCount = 0 }: sidebarProps) => { const { t } = useTranslation(); const { allActiveUserCount, hourActiveUserCount } = useSubplebbitStats({ subplebbitAddress: address }); @@ -114,6 +134,9 @@ const Sidebar = ({ address, cid, createdAt, description, downvoteCount = 0, role alert('Not available in this version. You can create a community with the CLI: https://github.com/plebbit/plebbit-cli'); }; + const account = useAccount(); + const isModerator = roles?.[account.author?.address]?.role; + return (
@@ -163,13 +186,11 @@ const Sidebar = ({ address, cid, createdAt, description, downvoteCount = 0, role {blocked ? t('unblock_community') : t('block_community')} - - {t('settings')} -
)} + {isModerator && } {roles && } ); diff --git a/src/views/subplebbit/subplebbit-settings/subplebbit-settings.module.css b/src/views/subplebbit/subplebbit-settings/subplebbit-settings.module.css index 02a10fc6..7353a02c 100644 --- a/src/views/subplebbit/subplebbit-settings/subplebbit-settings.module.css +++ b/src/views/subplebbit/subplebbit-settings/subplebbit-settings.module.css @@ -1,5 +1,20 @@ +@media (max-width: 768px) { + .content { + padding: 7px 0px 0px 0px; + } + + .sidebar { + display: none; + } +} + +@media (min-width: 768px) { + .content { + padding: 7px 5px 0px 5px; + } +} + .content { - padding: 7px 5px 50px 5px; color: var(--text); } diff --git a/src/views/subplebbit/subplebbit-settings/subplebbit-settings.tsx b/src/views/subplebbit/subplebbit-settings/subplebbit-settings.tsx index 04f57fd5..a6e74cc3 100644 --- a/src/views/subplebbit/subplebbit-settings/subplebbit-settings.tsx +++ b/src/views/subplebbit/subplebbit-settings/subplebbit-settings.tsx @@ -5,6 +5,7 @@ import { RolesCollection } from '../../../lib/utils/user-utils'; import { useTranslation } from 'react-i18next'; import stringify from 'json-stringify-pretty-compact'; import styles from './subplebbit-settings.module.css'; +import Sidebar from '../../../components/sidebar'; const isElectron = window.electron && window.electron.isElectron; @@ -200,7 +201,7 @@ const SubplebbitSettings = () => { const subplebbit = useSubplebbit({ subplebbitAddress }); const userRole = subplebbit?.roles?.[account.author?.address]?.role; const isAdmin = userRole === 'admin' || userRole === 'owner'; - const { address, description, rules, suggested, roles, title } = subplebbit || {}; + const { address, createdAt, description, rules, suggested, roles, title, updatedAt } = subplebbit || {}; const [text, setText] = useState(''); let usePublishSubplebbitEditOptions; @@ -263,6 +264,9 @@ const SubplebbitSettings = () => { return (
+
+ +
{!isAdmin &&
only the admins and the owner of a community can edit its settings
} {!isElectron && isAdmin &&
you must be using the desktop app to edit community settings
} diff --git a/src/views/subplebbit/subplebbit.module.css b/src/views/subplebbit/subplebbit.module.css index fb2654ac..90e3706a 100644 --- a/src/views/subplebbit/subplebbit.module.css +++ b/src/views/subplebbit/subplebbit.module.css @@ -2,6 +2,7 @@ padding-left: 5px; } +/* position virtuoso window content relatively to sidebar */ div[data-viewport-type="window"] { position: relative !important; } diff --git a/src/views/subplebbits/subplebbits.tsx b/src/views/subplebbits/subplebbits.tsx index fdd6133e..80f7fdac 100644 --- a/src/views/subplebbits/subplebbits.tsx +++ b/src/views/subplebbits/subplebbits.tsx @@ -51,7 +51,6 @@ const Tabs = () => { const Infobar = () => { const account = useAccount(); const { accountSubplebbits } = useAccountSubplebbits(); - console.log(accountSubplebbits); const subscriptions = account?.subscriptions || []; const { t } = useTranslation(); const location = useLocation();