diff --git a/web/chat/thread-menu.react.js b/web/chat/thread-menu.react.js
--- a/web/chat/thread-menu.react.js
+++ b/web/chat/thread-menu.react.js
@@ -4,13 +4,20 @@
faArrowRight,
faBell,
faCog,
+ faCommentAlt,
+ faPlusCircle,
faUserFriends,
} from '@fortawesome/free-solid-svg-icons';
import classNames from 'classnames';
import * as React from 'react';
import { childThreadInfos } from 'lib/selectors/thread-selectors';
-import { type ThreadInfo, threadTypes } from 'lib/types/thread-types';
+import { threadHasPermission } from 'lib/shared/thread-utils';
+import {
+ type ThreadInfo,
+ threadTypes,
+ threadPermissions,
+} from 'lib/types/thread-types';
import { useSelector } from '../redux/redux-utils';
import SWMansionIcon from '../SWMansionIcon.react';
@@ -66,10 +73,63 @@
);
}, [hasSidebars]);
+ const canCreateSubchannels = React.useMemo(
+ () => threadHasPermission(threadInfo, threadPermissions.CREATE_SUBCHANNELS),
+ [threadInfo],
+ );
+
+ const hasSubchannels = React.useMemo(() => {
+ const subchannels =
+ childThreads?.filter(
+ childThreadInfo => childThreadInfo.type !== threadTypes.SIDEBAR,
+ ) ?? [];
+ return subchannels.length > 0;
+ }, [childThreads]);
+
+ const viewSubchannelsItem = React.useMemo(() => {
+ if (!hasSubchannels && !canCreateSubchannels) {
+ return null;
+ }
+ return (
+
+ );
+ }, [canCreateSubchannels, hasSubchannels]);
+
+ const createSubchannelsItem = React.useMemo(() => {
+ if (!canCreateSubchannels) {
+ return null;
+ }
+ return (
+
+ );
+ }, [canCreateSubchannels]);
+
const menuItems = React.useMemo(() => {
- const items = [settingsItem, notificatiosItem, membersItem, sidebarItem];
+ const items = [
+ settingsItem,
+ notificatiosItem,
+ membersItem,
+ sidebarItem,
+ viewSubchannelsItem,
+ createSubchannelsItem,
+ ];
return items.filter(Boolean);
- }, [notificatiosItem, settingsItem, membersItem, sidebarItem]);
+ }, [
+ notificatiosItem,
+ settingsItem,
+ membersItem,
+ sidebarItem,
+ viewSubchannelsItem,
+ createSubchannelsItem,
+ ]);
const menuActionListClasses = classNames(css.topBarMenuActionList, {
[css.disabled]: !isOpen,