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

SafetyNumberChangeDialog: Introduce awareness of stories

Browse source
This commit is contained in:
Scott Nonnenberg 2022-11-10 20:10:30 -08:00 • committed by GitHub
parent 709588a874
commit 5100d17ed2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
36 changed files with 2531 additions and 522 deletions
Download patch file Download diff file Expand all files Collapse all files

168
ts/components/SafetyNumberChangeDialog.stories.tsx
View file

@ -10,6 +10,7 @@ import { setupI18n } from '../util/setupI18n';
import enMessages from '../../_locales/en/messages.json';
import { StorybookThemeContext } from '../../.storybook/StorybookThemeContext';
import { getFakeBadge } from '../test-both/helpers/getFakeBadge';
import { MY_STORY_ID } from '../types/Stories';
const i18n = setupI18n('en', enMessages);
@ -61,11 +62,17 @@ export const SingleContactDialog = (): JSX.Element => {
const theme = useTheme();
return (
<SafetyNumberChangeDialog
contacts={[contactWithAllData]}
contacts={[
{
story: undefined,
contacts: [contactWithAllData],
},
]}
getPreferredBadge={() => undefined}
i18n={i18n}
onCancel={action('cancel')}
onConfirm={action('confirm')}
removeFromStory={action('removeFromStory')}
renderSafetyNumber={() => {
action('renderSafetyNumber');
return <div>This is a mock Safety Number View</div>;
@ -80,11 +87,17 @@ export const DifferentConfirmationText = (): JSX.Element => {
return (
<SafetyNumberChangeDialog
confirmText="You are awesome"
contacts={[contactWithAllData]}
contacts={[
{
story: undefined,
contacts: [contactWithAllData],
},
]}
getPreferredBadge={() => undefined}
i18n={i18n}
onCancel={action('cancel')}
onConfirm={action('confirm')}
removeFromStory={action('removeFromStory')}
renderSafetyNumber={() => {
action('renderSafetyNumber');
return <div>This is a mock Safety Number View</div>;
@ -99,15 +112,20 @@ export const MultiContactDialog = (): JSX.Element => {
return (
<SafetyNumberChangeDialog
contacts={[
contactWithAllData,
contactWithJustProfileVerified,
contactWithJustNumberVerified,
contactWithNothing,
{
story: undefined,
contacts: [contactWithAllData, contactWithJustProfileVerified],
},
{
story: undefined,
contacts: [contactWithJustNumberVerified, contactWithNothing],
},
]}
getPreferredBadge={() => undefined}
i18n={i18n}
onCancel={action('cancel')}
onConfirm={action('confirm')}
removeFromStory={action('removeFromStory')}
renderSafetyNumber={() => {
action('renderSafetyNumber');
return <div>This is a mock Safety Number View</div>;
@ -121,11 +139,20 @@ export const AllVerified = (): JSX.Element => {
const theme = useTheme();
return (
<SafetyNumberChangeDialog
contacts={[contactWithJustProfileVerified, contactWithJustNumberVerified]}
contacts={[
{
story: undefined,
contacts: [
contactWithJustProfileVerified,
contactWithJustNumberVerified,
],
},
]}
getPreferredBadge={() => undefined}
i18n={i18n}
onCancel={action('cancel')}
onConfirm={action('confirm')}
removeFromStory={action('removeFromStory')}
renderSafetyNumber={() => {
action('renderSafetyNumber');
return <div>This is a mock Safety Number View</div>;
@ -143,15 +170,21 @@ export const MultipleContactsAllWithBadges = (): JSX.Element => {
return (
<SafetyNumberChangeDialog
contacts={[
contactWithAllData,
contactWithJustProfileVerified,
contactWithJustNumberVerified,
contactWithNothing,
{
story: undefined,
contacts: [
contactWithAllData,
contactWithJustProfileVerified,
contactWithJustNumberVerified,
contactWithNothing,
],
},
]}
getPreferredBadge={() => getFakeBadge()}
i18n={i18n}
onCancel={action('cancel')}
onConfirm={action('confirm')}
removeFromStory={action('removeFromStory')}
renderSafetyNumber={() => {
action('renderSafetyNumber');
return <div>This is a mock Safety Number View</div>;
@ -170,21 +203,27 @@ export const TenContacts = (): JSX.Element => {
return (
<SafetyNumberChangeDialog
contacts={[
contactWithAllData,
contactWithJustProfileVerified,
contactWithJustNumberVerified,
contactWithNothing,
contactWithAllData,
contactWithAllData,
contactWithAllData,
contactWithAllData,
contactWithAllData,
contactWithAllData,
{
story: undefined,
contacts: [
contactWithAllData,
contactWithJustProfileVerified,
contactWithJustNumberVerified,
contactWithNothing,
contactWithAllData,
contactWithAllData,
contactWithAllData,
contactWithAllData,
contactWithAllData,
contactWithAllData,
],
},
]}
getPreferredBadge={() => undefined}
i18n={i18n}
onCancel={action('cancel')}
onConfirm={action('confirm')}
removeFromStory={action('removeFromStory')}
renderSafetyNumber={() => {
action('renderSafetyNumber');
return <div>This is a mock Safety Number View</div>;
@ -197,3 +236,90 @@ export const TenContacts = (): JSX.Element => {
TenContacts.story = {
name: 'Ten contacts; first isReviewing = false, then scrolling dialog',
};
export const NoContacts = (): JSX.Element => {
const theme = useTheme();
return (
<SafetyNumberChangeDialog
contacts={[
{
story: {
name: 'My Story',
conversationId: 'our-conversation-id',
distributionId: MY_STORY_ID,
},
contacts: [],
},
{
story: {
name: 'Custom List A',
conversationId: 'our-conversation-id',
distributionId: 'some-other-distribution-id',
},
contacts: [],
},
]}
getPreferredBadge={() => undefined}
i18n={i18n}
onCancel={action('cancel')}
onConfirm={action('confirm')}
removeFromStory={action('removeFromStory')}
renderSafetyNumber={() => {
action('renderSafetyNumber');
return <div>This is a mock Safety Number View</div>;
}}
theme={theme}
/>
);
};
export const InMultipleStories = (): JSX.Element => {
const theme = useTheme();
return (
<SafetyNumberChangeDialog
contacts={[
{
story: {
name: 'Not to be trusted',
conversationId: 'our-conversation-id',
distributionId: MY_STORY_ID,
},
contacts: [contactWithAllData, contactWithJustProfileVerified],
},
{
story: {
name: 'Custom List A',
conversationId: 'our-conversation-id',
distributionId: 'some-other-distribution-id',
},
contacts: [
contactWithAllData,
contactWithAllData,
contactWithAllData,
],
},
{
story: {
name: 'Hiking Buds',
conversationId: 'hiking-group-id',
},
contacts: [
contactWithJustNumberVerified,
contactWithAllData,
contactWithAllData,
],
},
]}
getPreferredBadge={() => undefined}
i18n={i18n}
onCancel={action('cancel')}
onConfirm={action('confirm')}
removeFromStory={action('removeFromStory')}
renderSafetyNumber={() => {
action('renderSafetyNumber');
return <div>This is a mock Safety Number View</div>;
}}
theme={theme}
/>
);
};