mirrors/signal-desktop
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 2 Wiki Activity Actions

New left pane search design

Browse source
This commit is contained in:
Josh Perez 2022-01-27 17:12:26 -05:00 • committed by GitHub
parent babd61377b
commit bf45182a39
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
24 changed files with 500 additions and 359 deletions
Download patch file Download diff file Expand all files Collapse all files

64
ts/components/LeftPane.stories.tsx
View file

@ -35,6 +35,13 @@ const defaultConversations: Array<ConversationType> = [
}),
];
const defaultSearchProps = {
searchConversation: undefined,
searchDisabled: false,
searchTerm: 'hello',
startSearchCounter: 0,
};
const defaultGroups: Array<ConversationType> = [
getDefaultConversation({
id: 'biking-group',
@ -72,18 +79,19 @@ const pinnedConversations: Array<ConversationType> = [
];
const defaultModeSpecificProps = {
...defaultSearchProps,
mode: LeftPaneMode.Inbox as const,
pinnedConversations,
conversations: defaultConversations,
archivedConversations: defaultArchivedConversations,
isAboutToSearchInAConversation: false,
startSearchCounter: 0,
};
const emptySearchResultsGroup = { isLoading: false, results: [] };
const useProps = (overrideProps: Partial<PropsType> = {}): PropsType => ({
cantAddContactToGroup: action('cantAddContactToGroup'),
clearConversationSearch: action('clearConversationSearch'),
clearGroupCreationError: action('clearGroupCreationError'),
clearSearch: action('clearSearch'),
closeCantAddContactToGroupModal: action('closeCantAddContactToGroupModal'),
@ -177,12 +185,12 @@ story.add('Inbox: no conversations', () => (
<LeftPane
{...useProps({
modeSpecificProps: {
...defaultSearchProps,
mode: LeftPaneMode.Inbox,
pinnedConversations: [],
conversations: [],
archivedConversations: [],
isAboutToSearchInAConversation: false,
startSearchCounter: 0,
},
})}
/>
@ -192,12 +200,12 @@ story.add('Inbox: only pinned conversations', () => (
<LeftPane
{...useProps({
modeSpecificProps: {
...defaultSearchProps,
mode: LeftPaneMode.Inbox,
pinnedConversations,
conversations: [],
archivedConversations: [],
isAboutToSearchInAConversation: false,
startSearchCounter: 0,
},
})}
/>
@ -207,12 +215,12 @@ story.add('Inbox: only non-pinned conversations', () => (
<LeftPane
{...useProps({
modeSpecificProps: {
...defaultSearchProps,
mode: LeftPaneMode.Inbox,
pinnedConversations: [],
conversations: defaultConversations,
archivedConversations: [],
isAboutToSearchInAConversation: false,
startSearchCounter: 0,
},
})}
/>
@ -222,12 +230,12 @@ story.add('Inbox: only archived conversations', () => (
<LeftPane
{...useProps({
modeSpecificProps: {
...defaultSearchProps,
mode: LeftPaneMode.Inbox,
pinnedConversations: [],
conversations: [],
archivedConversations: defaultArchivedConversations,
isAboutToSearchInAConversation: false,
startSearchCounter: 0,
},
})}
/>
@ -237,12 +245,12 @@ story.add('Inbox: pinned and archived conversations', () => (
<LeftPane
{...useProps({
modeSpecificProps: {
...defaultSearchProps,
mode: LeftPaneMode.Inbox,
pinnedConversations,
conversations: [],
archivedConversations: defaultArchivedConversations,
isAboutToSearchInAConversation: false,
startSearchCounter: 0,
},
})}
/>
@ -252,12 +260,12 @@ story.add('Inbox: non-pinned and archived conversations', () => (
<LeftPane
{...useProps({
modeSpecificProps: {
...defaultSearchProps,
mode: LeftPaneMode.Inbox,
pinnedConversations: [],
conversations: defaultConversations,
archivedConversations: defaultArchivedConversations,
isAboutToSearchInAConversation: false,
startSearchCounter: 0,
},
})}
/>
@ -267,12 +275,12 @@ story.add('Inbox: pinned and non-pinned conversations', () => (
<LeftPane
{...useProps({
modeSpecificProps: {
...defaultSearchProps,
mode: LeftPaneMode.Inbox,
pinnedConversations,
conversations: defaultConversations,
archivedConversations: [],
isAboutToSearchInAConversation: false,
startSearchCounter: 0,
},
})}
/>
@ -288,11 +296,11 @@ story.add('Search: no results when searching everywhere', () => (
<LeftPane
{...useProps({
modeSpecificProps: {
...defaultSearchProps,
mode: LeftPaneMode.Search,
conversationResults: emptySearchResultsGroup,
contactResults: emptySearchResultsGroup,
messageResults: emptySearchResultsGroup,
searchTerm: 'foo bar',
primarySendsSms: false,
},
})}
@ -303,11 +311,11 @@ story.add('Search: no results when searching everywhere (SMS)', () => (
<LeftPane
{...useProps({
modeSpecificProps: {
...defaultSearchProps,
mode: LeftPaneMode.Search,
conversationResults: emptySearchResultsGroup,
contactResults: emptySearchResultsGroup,
messageResults: emptySearchResultsGroup,
searchTerm: 'foo bar',
primarySendsSms: true,
},
})}
@ -318,12 +326,12 @@ story.add('Search: no results when searching in a conversation', () => (
<LeftPane
{...useProps({
modeSpecificProps: {
...defaultSearchProps,
mode: LeftPaneMode.Search,
conversationResults: emptySearchResultsGroup,
contactResults: emptySearchResultsGroup,
messageResults: emptySearchResultsGroup,
searchConversationName: 'Bing Bong',
searchTerm: 'foo bar',
primarySendsSms: false,
},
})}
@ -334,11 +342,11 @@ story.add('Search: all results loading', () => (
<LeftPane
{...useProps({
modeSpecificProps: {
...defaultSearchProps,
mode: LeftPaneMode.Search,
conversationResults: { isLoading: true },
contactResults: { isLoading: true },
messageResults: { isLoading: true },
searchTerm: 'foo bar',
primarySendsSms: false,
},
})}
@ -349,6 +357,7 @@ story.add('Search: some results loading', () => (
<LeftPane
{...useProps({
modeSpecificProps: {
...defaultSearchProps,
mode: LeftPaneMode.Search,
conversationResults: {
isLoading: false,
@ -356,7 +365,6 @@ story.add('Search: some results loading', () => (
},
contactResults: { isLoading: true },
messageResults: { isLoading: true },
searchTerm: 'foo bar',
primarySendsSms: false,
},
})}
@ -367,6 +375,7 @@ story.add('Search: has conversations and contacts, but not messages', () => (
<LeftPane
{...useProps({
modeSpecificProps: {
...defaultSearchProps,
mode: LeftPaneMode.Search,
conversationResults: {
isLoading: false,
@ -374,7 +383,6 @@ story.add('Search: has conversations and contacts, but not messages', () => (
},
contactResults: { isLoading: false, results: defaultConversations },
messageResults: { isLoading: false, results: [] },
searchTerm: 'foo bar',
primarySendsSms: false,
},
})}
@ -385,6 +393,7 @@ story.add('Search: all results', () => (
<LeftPane
{...useProps({
modeSpecificProps: {
...defaultSearchProps,
mode: LeftPaneMode.Search,
conversationResults: {
isLoading: false,
@ -398,7 +407,6 @@ story.add('Search: all results', () => (
{ id: 'msg2', conversationId: 'bar' },
],
},
searchTerm: 'foo bar',
primarySendsSms: false,
},
})}
@ -614,12 +622,13 @@ story.add('Captcha dialog: required', () => (
<LeftPane
{...useProps({
modeSpecificProps: {
...defaultSearchProps,
mode: LeftPaneMode.Inbox,
pinnedConversations,
conversations: defaultConversations,
archivedConversations: [],
isAboutToSearchInAConversation: false,
startSearchCounter: 0,
searchTerm: '',
},
challengeStatus: 'required',
})}
@ -630,12 +639,13 @@ story.add('Captcha dialog: pending', () => (
<LeftPane
{...useProps({
modeSpecificProps: {
...defaultSearchProps,
mode: LeftPaneMode.Inbox,
pinnedConversations,
conversations: defaultConversations,
archivedConversations: [],
isAboutToSearchInAConversation: false,
startSearchCounter: 0,
searchTerm: '',
},
challengeStatus: 'pending',
})}
@ -648,12 +658,13 @@ story.add('Crash report dialog', () => (
<LeftPane
{...useProps({
modeSpecificProps: {
...defaultSearchProps,
mode: LeftPaneMode.Inbox,
pinnedConversations,
conversations: defaultConversations,
archivedConversations: [],
isAboutToSearchInAConversation: false,
startSearchCounter: 0,
searchTerm: '',
},
crashReportCount: 42,
})}
@ -715,3 +726,20 @@ story.add('Group Metadata: Custom Timer', () => (
})}
/>
));
story.add('Searching Conversation', () => (
<LeftPane
{...useProps({
modeSpecificProps: {
...defaultSearchProps,
mode: LeftPaneMode.Inbox,
pinnedConversations: [],
conversations: defaultConversations,
archivedConversations: [],
isAboutToSearchInAConversation: false,
searchConversation: getDefaultConversation(),
searchTerm: '',
},
})}
/>
));