GroupV1MigrationDialog: sort member list before display
This commit is contained in:
parent
845532c9b7
commit
673d07e176
2 changed files with 20 additions and 7 deletions
|
@ -15,7 +15,7 @@ const i18n = setupI18n('en', enMessages);
|
|||
|
||||
const contact1 = {
|
||||
title: 'Alice',
|
||||
number: '+1 (300) 555-000',
|
||||
number: '+1 (300) 555-0000',
|
||||
id: 'guid-1',
|
||||
markedUnread: false,
|
||||
type: 'direct' as const,
|
||||
|
@ -24,8 +24,17 @@ const contact1 = {
|
|||
|
||||
const contact2 = {
|
||||
title: 'Bob',
|
||||
number: '+1 (300) 555-000',
|
||||
id: 'guid-1',
|
||||
number: '+1 (300) 555-0001',
|
||||
id: 'guid-2',
|
||||
markedUnread: false,
|
||||
type: 'direct' as const,
|
||||
lastUpdated: Date.now(),
|
||||
};
|
||||
|
||||
const contact3 = {
|
||||
title: 'Chet',
|
||||
number: '+1 (300) 555-0002',
|
||||
id: 'guid-3',
|
||||
markedUnread: false,
|
||||
type: 'direct' as const,
|
||||
lastUpdated: Date.now(),
|
||||
|
@ -40,7 +49,7 @@ const createProps = (overrideProps: Partial<PropsType> = {}): PropsType => ({
|
|||
'areWeInvited',
|
||||
booleanOr(overrideProps.areWeInvited, false)
|
||||
),
|
||||
droppedMembers: overrideProps.droppedMembers || [contact1],
|
||||
droppedMembers: overrideProps.droppedMembers || [contact3, contact1],
|
||||
hasMigrated: boolean(
|
||||
'hasMigrated',
|
||||
booleanOr(overrideProps.hasMigrated, false)
|
||||
|
@ -82,8 +91,8 @@ stories.add('Not yet migrated, multiple dropped and invited members', () => {
|
|||
return (
|
||||
<GroupV1MigrationDialog
|
||||
{...createProps({
|
||||
droppedMembers: [contact1, contact2],
|
||||
invitedMembers: [contact1, contact2],
|
||||
droppedMembers: [contact3, contact1, contact2],
|
||||
invitedMembers: [contact2, contact3, contact1],
|
||||
})}
|
||||
/>
|
||||
);
|
||||
|
|
|
@ -36,6 +36,10 @@ function focusRef(el: HTMLElement | null) {
|
|||
}
|
||||
}
|
||||
|
||||
function sort(list: Array<ConversationType>): Array<ConversationType> {
|
||||
return [...list].sort((a, b) => a.title.localeCompare(b.title));
|
||||
}
|
||||
|
||||
export const GroupV1MigrationDialog = React.memo((props: PropsType) => {
|
||||
const {
|
||||
areWeInvited,
|
||||
|
@ -168,7 +172,7 @@ function renderMembers(
|
|||
<div className="module-group-v2-migration-dialog__item__bullet" />
|
||||
<div className="module-group-v2-migration-dialog__item__content">
|
||||
<div>{i18n(key)}</div>
|
||||
{members.map(member => (
|
||||
{sort(members).map(member => (
|
||||
<div
|
||||
key={member.id}
|
||||
className="module-group-v2-migration-dialog__member"
|
||||
|
|
Loading…
Add table
Reference in a new issue