Page MenuHomePhorge
Files F32089061

chat-tabs.react.js
No OneTemporary
Actions

Size
1 KB
Referenced Files
None
Subscribers
None

chat-tabs.react.js
View Options

// @flow
import invariant from 'invariant';
import * as React from 'react';
import { unreadBackgroundCount } from 'lib/selectors/thread-selectors';
import Tabs from '../components/tabs.react';
import { useSelector } from '../redux/redux-utils';
import css from './chat-tabs.css';
import ChatThreadList from './chat-thread-list.react';
import ChatThreadTab from './chat-thread-tab.react';
import { ThreadListContext } from './thread-list-provider';
function ChatTabs(): React.Node {
let backgroundTitle = 'Background';
const unreadBackgroundCountVal = useSelector(unreadBackgroundCount);
if (unreadBackgroundCountVal) {
backgroundTitle += ` (${unreadBackgroundCountVal})`;
}
const threadListContext = React.useContext(ThreadListContext);
invariant(
threadListContext,
'threadListContext should be set in ChatThreadList',
);
const { activeTab, setActiveTab } = threadListContext;
const setActiveChatTab = React.useCallback(
(newTab: 'Background' | 'Focus') => {
setActiveTab(newTab);
},
[setActiveTab],
);
const chatThreadList = React.useMemo(
() => (
<div className={css.threadList}>
<ChatThreadList />
</div>
),
[],
);
const focusTabsItem = React.useMemo(
() => (
<Tabs.Item
id="Focus"
header={<ChatThreadTab title="Focus" icon="home-1" />}
>
{chatThreadList}
</Tabs.Item>
),
[chatThreadList],
);
const backgroundTabsItem = React.useMemo(
() => (
<Tabs.Item
id="Background"
header={<ChatThreadTab title={backgroundTitle} icon="bell-disabled" />}
>
{chatThreadList}
</Tabs.Item>
),
[backgroundTitle, chatThreadList],
);
return (
<div className={css.container}>
<Tabs.Container activeTab={activeTab} setTab={setActiveChatTab}>
{focusTabsItem}
{backgroundTabsItem}
</Tabs.Container>
</div>
);
}
export default ChatTabs;

File Metadata

Mime Type
text/x-java
Expires
Sun, Dec 7, 7:55 AM (7 h, 39 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5727115
Default Alt Text
chat-tabs.react.js (1 KB)

Event Timeline