Render disappearing message timers generically
This commit is contained in:
parent
c1730e055f
commit
736075322c
16 changed files with 372 additions and 307 deletions
|
@ -1,9 +1,10 @@
|
|||
// Copyright 2020 Signal Messenger, LLC
|
||||
// Copyright 2020-2021 Signal Messenger, LLC
|
||||
// SPDX-License-Identifier: AGPL-3.0-only
|
||||
|
||||
import * as React from 'react';
|
||||
import * as moment from 'moment';
|
||||
import { storiesOf } from '@storybook/react';
|
||||
import { boolean, select, text } from '@storybook/addon-knobs';
|
||||
import { boolean, number, select, text } from '@storybook/addon-knobs';
|
||||
|
||||
import { setup as setupI18n } from '../../../js/modules/i18n';
|
||||
import enMessages from '../../../_locales/en/messages.json';
|
||||
|
@ -30,60 +31,69 @@ const createProps = (overrideProps: Partial<Props> = {}): Props => ({
|
|||
text('profileName', overrideProps.profileName || '') || undefined,
|
||||
title: text('title', overrideProps.title || ''),
|
||||
name: text('name', overrideProps.name || '') || undefined,
|
||||
disabled: boolean('disabled', overrideProps.disabled || false),
|
||||
timespan: text('timespan', overrideProps.timespan || ''),
|
||||
...(boolean('disabled', overrideProps.disabled || false)
|
||||
? {
|
||||
disabled: true,
|
||||
}
|
||||
: {
|
||||
disabled: false,
|
||||
expireTimer: number(
|
||||
'expireTimer',
|
||||
('expireTimer' in overrideProps ? overrideProps.expireTimer : 0) || 0
|
||||
),
|
||||
}),
|
||||
});
|
||||
|
||||
story.add('Set By Other', () => {
|
||||
const props = createProps({
|
||||
expireTimer: moment.duration(1, 'hour').asSeconds(),
|
||||
type: 'fromOther',
|
||||
phoneNumber: '(202) 555-1000',
|
||||
profileName: 'Mr. Fire',
|
||||
title: 'Mr. Fire',
|
||||
timespan: '1 hour',
|
||||
});
|
||||
|
||||
return (
|
||||
<>
|
||||
<TimerNotification {...props} />
|
||||
<div style={{ padding: '1em' }} />
|
||||
<TimerNotification {...props} disabled timespan="Off" />
|
||||
<TimerNotification {...props} disabled />
|
||||
</>
|
||||
);
|
||||
});
|
||||
|
||||
story.add('Set By You', () => {
|
||||
const props = createProps({
|
||||
expireTimer: moment.duration(1, 'hour').asSeconds(),
|
||||
type: 'fromMe',
|
||||
phoneNumber: '(202) 555-1000',
|
||||
profileName: 'Mr. Fire',
|
||||
title: 'Mr. Fire',
|
||||
timespan: '1 hour',
|
||||
});
|
||||
|
||||
return (
|
||||
<>
|
||||
<TimerNotification {...props} />
|
||||
<div style={{ padding: '1em' }} />
|
||||
<TimerNotification {...props} disabled timespan="Off" />
|
||||
<TimerNotification {...props} disabled />
|
||||
</>
|
||||
);
|
||||
});
|
||||
|
||||
story.add('Set By Sync', () => {
|
||||
const props = createProps({
|
||||
expireTimer: moment.duration(1, 'hour').asSeconds(),
|
||||
type: 'fromSync',
|
||||
phoneNumber: '(202) 555-1000',
|
||||
profileName: 'Mr. Fire',
|
||||
title: 'Mr. Fire',
|
||||
timespan: '1 hour',
|
||||
});
|
||||
|
||||
return (
|
||||
<>
|
||||
<TimerNotification {...props} />
|
||||
<div style={{ padding: '1em' }} />
|
||||
<TimerNotification {...props} disabled timespan="Off" />
|
||||
<TimerNotification {...props} disabled />
|
||||
</>
|
||||
);
|
||||
});
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue