Page MenuHomePhabricator

D4469.id14251.diff
No OneTemporary

D4469.id14251.diff

diff --git a/web/chat/chat-tabs.css b/web/chat/chat-tabs.css
--- a/web/chat/chat-tabs.css
+++ b/web/chat/chat-tabs.css
@@ -9,6 +9,10 @@
flex-direction: column;
}
+div.container > div {
+ flex: 1;
+}
+
div.tabItem {
display: flex;
align-items: center;
@@ -21,4 +25,7 @@
div.threadList {
flex: 1;
overflow-y: auto;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
}
diff --git a/web/chat/chat-thread-list.css b/web/chat/chat-thread-list.css
--- a/web/chat/chat-thread-list.css
+++ b/web/chat/chat-thread-list.css
@@ -301,6 +301,14 @@
div.threadListContainer {
display: flex;
flex-direction: column;
+ overflow: auto;
+}
+
+div.createNewThread {
+ display: flex;
+ flex-direction: column;
+ align-items: stretch;
+ padding: 8px;
}
img.longArrow {
height: 40px;
diff --git a/web/chat/chat-thread-list.react.js b/web/chat/chat-thread-list.react.js
--- a/web/chat/chat-thread-list.react.js
+++ b/web/chat/chat-thread-list.react.js
@@ -6,7 +6,10 @@
import { emptyItemText } from 'lib/shared/thread-utils';
import { assetCacheURLPrefix, backgroundIllustrationAsset } from '../assets';
+import Button from '../components/button.react';
import Search from '../components/search.react';
+import { useSelector } from '../redux/redux-utils';
+import { useOnClickNewThread } from '../selectors/nav-selectors';
import ChatThreadListItem from './chat-thread-list-item.react';
import css from './chat-thread-list.css';
import { ThreadListContext } from './thread-list-provider';
@@ -23,6 +26,12 @@
setSearchText,
searchText,
} = threadListContext;
+
+ const onClickNewThread = useOnClickNewThread();
+
+ const isThreadCreation =
+ useSelector(state => state.navInfo.tab) === 'chat-creation';
+
const isBackground = activeTab === 'Background';
const threadComponents: React.Node[] = React.useMemo(() => {
@@ -36,14 +45,21 @@
}, [threadList, isBackground]);
return (
- <div className={css.threadListContainer}>
- <Search
- onChangeText={setSearchText}
- searchText={searchText}
- placeholder="Search threads"
- />
- <div>{threadComponents}</div>
- </div>
+ <>
+ <div className={css.threadListContainer}>
+ <Search
+ onChangeText={setSearchText}
+ searchText={searchText}
+ placeholder="Search threads"
+ />
+ <div>{threadComponents}</div>
+ </div>
+ <div className={css.createNewThread}>
+ <Button disabled={isThreadCreation} onClick={onClickNewThread}>
+ Create new thread
+ </Button>
+ </div>
+ </>
);
}

File Metadata

Mime Type
text/plain
Expires
Sat, Nov 30, 2:02 AM (21 h, 5 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2599006
Default Alt Text
D4469.id14251.diff (2 KB)

Event Timeline