Improvements to SafetyNumberChangeDialog

This commit is contained in:
Scott Nonnenberg 2022-11-01 17:10:27 -07:00 committed by GitHub
parent 6700f6fa15
commit 4fc1b6388c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 329 additions and 114 deletions

View file

@ -22,22 +22,24 @@ const contactWithAllData = getDefaultConversation({
phoneNumber: '(305) 123-4567',
});
const contactWithJustProfile = getDefaultConversation({
const contactWithJustProfileVerified = getDefaultConversation({
id: 'def',
avatarPath: undefined,
title: '-*Smartest Dude*-',
profileName: '-*Smartest Dude*-',
name: undefined,
phoneNumber: '(305) 123-4567',
isVerified: true,
});
const contactWithJustNumber = getDefaultConversation({
const contactWithJustNumberVerified = getDefaultConversation({
id: 'xyz',
avatarPath: undefined,
profileName: undefined,
name: undefined,
title: '(305) 123-4567',
phoneNumber: '(305) 123-4567',
isVerified: true,
});
const contactWithNothing = getDefaultConversation({
@ -98,8 +100,8 @@ export const MultiContactDialog = (): JSX.Element => {
<SafetyNumberChangeDialog
contacts={[
contactWithAllData,
contactWithJustProfile,
contactWithJustNumber,
contactWithJustProfileVerified,
contactWithJustNumberVerified,
contactWithNothing,
]}
getPreferredBadge={() => undefined}
@ -115,14 +117,35 @@ export const MultiContactDialog = (): JSX.Element => {
);
};
export const AllVerified = (): JSX.Element => {
const theme = useTheme();
return (
<SafetyNumberChangeDialog
contacts={[contactWithJustProfileVerified, contactWithJustNumberVerified]}
getPreferredBadge={() => undefined}
i18n={i18n}
onCancel={action('cancel')}
onConfirm={action('confirm')}
renderSafetyNumber={() => {
action('renderSafetyNumber');
return <div>This is a mock Safety Number View</div>;
}}
theme={theme}
/>
);
};
AllVerified.story = {
name: 'All verified; Send button instead',
};
export const MultipleContactsAllWithBadges = (): JSX.Element => {
const theme = useTheme();
return (
<SafetyNumberChangeDialog
contacts={[
contactWithAllData,
contactWithJustProfile,
contactWithJustNumber,
contactWithJustProfileVerified,
contactWithJustNumberVerified,
contactWithNothing,
]}
getPreferredBadge={() => getFakeBadge()}
@ -142,14 +165,14 @@ MultipleContactsAllWithBadges.story = {
name: 'Multiple contacts, all with badges',
};
export const ScrollDialog = (): JSX.Element => {
export const TenContacts = (): JSX.Element => {
const theme = useTheme();
return (
<SafetyNumberChangeDialog
contacts={[
contactWithAllData,
contactWithJustProfile,
contactWithJustNumber,
contactWithJustProfileVerified,
contactWithJustNumberVerified,
contactWithNothing,
contactWithAllData,
contactWithAllData,
@ -170,3 +193,7 @@ export const ScrollDialog = (): JSX.Element => {
/>
);
};
TenContacts.story = {
name: 'Ten contacts; first isReviewing = false, then scrolling dialog',
};