Page MenuHomePhabricator
Files F3301277

D4610.id14983.diff
No OneTemporary
Actions

D4610.id14983.diff
View Options

diff --git a/lib/shared/thread-utils.js b/lib/shared/thread-utils.js
--- a/lib/shared/thread-utils.js
+++ b/lib/shared/thread-utils.js
@@ -160,6 +160,10 @@
return !!(threadInfo && threadInfo.type !== threadTypes.SIDEBAR);
}
+function threadIsSidebar(threadInfo: ?(ThreadInfo | RawThreadInfo)): boolean {
+ return threadInfo?.type === threadTypes.SIDEBAR;
+}
+
function threadInBackgroundChatList(
threadInfo: ?(ThreadInfo | RawThreadInfo),
): boolean {
@@ -1403,6 +1407,7 @@
threadInChatList,
threadIsTopLevel,
threadIsChannel,
+ threadIsSidebar,
threadInBackgroundChatList,
threadInHomeChatList,
threadIsInHome,
diff --git a/web/modals/threads/sidebars/sidebars-modal.css b/web/modals/threads/sidebars/sidebars-modal.css
--- a/web/modals/threads/sidebars/sidebars-modal.css
+++ b/web/modals/threads/sidebars/sidebars-modal.css
@@ -1,3 +1,11 @@
+div.sidebarListContainer {
+ display: flex;
+ flex-direction: column;
+ line-height: var(--line-height-text);
+ width: 383px;
+ height: 458px;
+}
+
div.sidebarList {
overflow: auto;
color: var(--sidebars-modal-color);
diff --git a/web/modals/threads/sidebars/sidebars-modal.react.js b/web/modals/threads/sidebars/sidebars-modal.react.js
new file mode 100644
--- /dev/null
+++ b/web/modals/threads/sidebars/sidebars-modal.react.js
@@ -0,0 +1,80 @@
+// @flow
+
+import * as React from 'react';
+
+import { useFilteredChildThreads } from 'lib/hooks/child-threads';
+import { threadInChatList, threadIsSidebar } from 'lib/shared/thread-utils';
+
+import Tabs from '../../../components/tabs.react';
+import SearchModal from '../../search-modal.react';
+import SidebarList from './sidebar-list.react';
+import css from './sidebars-modal.css';
+
+type SidebarTab = 'All Threads' | 'My Threads';
+
+type ContentProps = {
+ +searchText: string,
+ +threadID: string,
+ +defaultTab: SidebarTab,
+};
+
+function SidebarsModalContent(props: ContentProps): React.Node {
+ const { searchText, threadID, defaultTab } = props;
+ const [tab, setTab] = React.useState<SidebarTab>(defaultTab);
+
+ const sidebarList = useFilteredChildThreads(threadID, {
+ predicate: threadIsSidebar,
+ searchText,
+ });
+
+ const sidebarsChatListVisibleInChat = sidebarList.filter(chatItem =>
+ threadInChatList(chatItem.threadInfo),
+ );
+
+ return (
+ <div className={css.sidebarListContainer}>
+ <Tabs.Container activeTab={tab} setTab={setTab}>
+ <Tabs.Item id="All Threads" header="All Threads">
+ <SidebarList sidebars={sidebarList} />
+ </Tabs.Item>
+ <Tabs.Item id="My Threads" header="My Threads">
+ <SidebarList sidebars={sidebarsChatListVisibleInChat} />
+ </Tabs.Item>
+ </Tabs.Container>
+ </div>
+ );
+}
+
+type Props = {
+ +threadID: string,
+ +onClose: () => void,
+ +defaultTab?: SidebarTab,
+};
+
+function SidebarsModal(props: Props): React.Node {
+ const { threadID, onClose, defaultTab = 'All Threads' } = props;
+
+ const sidebarsContent = React.useCallback(
+ (searchText: string) => (
+ <SidebarsModalContent
+ searchText={searchText}
+ defaultTab={defaultTab}
+ threadID={threadID}
+ />
+ ),
+ [defaultTab, threadID],
+ );
+
+ return (
+ <SearchModal
+ name="Threads"
+ searchPlaceholder="Search"
+ onClose={onClose}
+ size="fit-content"
+ >
+ {sidebarsContent}
+ </SearchModal>
+ );
+}
+
+export default SidebarsModal;

File Metadata

Mime Type
text/plain
Expires
Tue, Nov 19, 1:28 AM (21 h, 33 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2536164
Default Alt Text
D4610.id14983.diff (3 KB)

Event Timeline