@messenger-box/platform-browser 10.0.3-alpha.17 → 10.0.3-alpha.171

package/src/components/post/timestamp/timestamp.stories.tsx

@@ -1,190 +0,0 @@
-// // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
-// // See LICENSE.txt for license information.
-
-// import React, {ComponentProps} from 'react';
-// import {Unit} from '@formatjs/intl-relativetimeformat';
-// import moment from 'moment';
-
-// import {storiesOf} from '@storybook/react';
-// import {withKnobs, date, boolean, optionsKnob} from '@storybook/addon-knobs';
-
-// import StoryGrid from 'storybook/story_grid';
-// import StoryBox from 'storybook/story_box';
-
-// import {STANDARD_UNITS} from './relative_ranges';
-
-// import Timestamp from './index';
-
-// function* range(start: number, end: number): Iterable<number> {
-//     for (let i = start; start < end ? i <= end : i >= end; start < end ? i++ : i--) {
-//         yield i;
-//     }
-// }
-
-// const unitDiffs = new Map<Unit, number[]>([
-//     ['second', [...range(-1, -3), -57, -58, -59]],
-//     ['minute', [...range(-1, -3), -57, -58, -59]],
-//     ['hour', [...range(-1, -3), -12, -22, -23]],
-//     ['day', [...range(-1, -7), -14, -22]],
-//     ['week', [...range(-1, -4)]],
-//     ['month', [...range(-1, -3), ...range(-11, -13)]],
-//     ['quarter', [...range(-1, -5)]],
-//     ['year', [...range(-1, -3)]],
-// ]);
-
-// const units = [...unitDiffs.keys()];
-
-// type Props = ComponentProps<typeof Timestamp>;
-
-// /* eslint-disable max-nested-callbacks */
-// storiesOf('Connected/Timestamp', module).
-//     addDecorator(withKnobs).
-//     add('interactive', () => {
-//         const props: Props = {
-//             value: date('value'),
-//             units: optionsKnob<string[]>(
-//                 'auto relative units (ordered)',
-//                 Object.keys(STANDARD_UNITS).reduce((opts: Record<string, any>, opt: string) => {
-//                     opts[opt] = opt;
-//                     return opts;
-//                 }, {}),
-//                 ['second', 'minute', 'hour', 'day', 'week', 'month', 'year'],
-//                 {display: 'multi-select'},
-//             ),
-//             userTimezone: {
-//                 useAutomaticTimezone: true,
-//                 automaticTimezone: new Intl.DateTimeFormat().resolvedOptions().timeZone,
-//                 manualTimezone: 'Etc/UTC',
-//             },
-//         };
-
-//         if (!boolean('show date?', true)) {
-//             props.useDate = false;
-//         }
-
-//         if (!boolean('show time?', true)) {
-//             props.useTime = false;
-//         } else if (boolean('show timeZone name?', true)) {
-//             props.useTime = {hour: 'numeric', minute: 'numeric', timeZoneName: 'short'};
-//         }
-
-//         if (!boolean('use auto timeZone', true)) {
-//             props.userTimezone!.useAutomaticTimezone = false;
-
-//             props.userTimezone!.manualTimezone = optionsKnob(
-//                 'manual timeZone',
-//                 moment.tz.names().reduce((opts: Record<string, any>, opt: string) => {
-//                     opts[opt] = opt;
-//                     return opts;
-//                 }, {}),
-//                 'Etc/UTC',
-//                 {display: 'select'},
-//             );
-//         }
-
-//         return (
-//             <StoryGrid>
-//                 <StoryBox>
-//                     <Timestamp {...props}/>
-//                 </StoryBox>
-//             </StoryGrid>
-//         );
-//     }).
-//     add('relative, auto unit', () => {
-//         const propVariations: Array<[string, Props]> = [
-//             ['rel=progressive', {} as Props],
-//             ['rel=progressive, date-only', {useTime: false} as Props],
-//             ['rel=progressive, numeric', {numeric: 'always'} as Props],
-//         ];
-//         return (
-//             <StoryGrid>
-//                 {propVariations.map(([label, props], boxIndex) => (
-//                     <StoryBox
-//                         key={`kind-${boxIndex}`}
-//                         label={label}
-//                     >
-//                         {[...unitDiffs].map(([unit, diffs], unitIndex) => (
-//                             <StoryBox
-//                                 key={unit}
-//                                 label={unit}
-//                             >
-//                                 <Timestamp
-//                                     key={`start-${0}`}
-//                                     {...props}
-//                                     units={units.slice(unitIndex, units.length)}
-//                                     value={moment().toDate()}
-//                                 >
-//                                     {({formatted}, {relative}) => (
-//                                         <span style={{width: '100%'}}>
-//                                             <pre
-//                                                 style={{
-//                                                     display: 'inline-grid',
-//                                                     marginRight: '2rem',
-//                                                     width: '4rem',
-//                                                     padding: '0px 5px',
-//                                                     textAlign: 'center',
-//                                                     borderColor: relative && relative.updateIntervalInSeconds != null ? 'green' : 'red',
-//                                                 }}
-//                                             >
-//                                                 {0}
-//                                             </pre>
-//                                             {formatted}
-//                                         </span>
-//                                     )}
-//                                 </Timestamp>
-
-//                                 {diffs.map((diff) => (
-//                                     <Timestamp
-//                                         key={`start-${diff}`}
-//                                         units={units}
-//                                         {...props}
-//                                         value={moment().add(diff, unit).toDate()}
-//                                     >
-//                                         {({formatted}, {relative}) => (
-//                                             <span
-//                                                 key={`span-${diff}`}
-//                                                 style={{width: '100%'}}
-//                                             >
-//                                                 <pre
-//                                                     style={{
-//                                                         display: 'inline-grid',
-//                                                         marginRight: '2rem',
-//                                                         width: '4rem',
-//                                                         padding: '0px 5px',
-//                                                         textAlign: 'center',
-//                                                         borderColor: relative && relative.updateIntervalInSeconds != null ? 'green' : 'red',
-//                                                     }}
-//                                                 >
-//                                                     {diff}
-//                                                 </pre>
-//                                                 {formatted}
-//                                             </span>
-//                                         )}
-//                                     </Timestamp>
-//                                 ))}
-//                             </StoryBox>
-//                         ))}
-//                     </StoryBox>
-//                 ))}
-//             </StoryGrid>
-//         );
-//     }).
-//     add('relative, fixed unit', () => (
-//         <StoryGrid>
-//             {units.map((unit) => (
-//                 <StoryBox
-//                     key={`fixed-box-${unit}`}
-//                     label={unit}
-//                 >
-//                     {[-999, ...range(-12, -1), 0, ...range(1, 12), 999].map((diff) => (
-//                         <Timestamp
-//                             key={`fixed-time-${diff}`}
-//                             useTime={false}
-//                             unit={unit}
-//                             value={moment().add(diff, unit).toDate()}
-//                         />
-//                     ))}
-//                 </StoryBox>
-//             ))}
-//         </StoryGrid>
-//     ));

package/src/components/post/timestamp/timestamp.test.tsx

@@ -1,309 +0,0 @@
-// // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
-// // See LICENSE.txt for license information.
-
-// import * as React from 'react';
-// import moment from 'moment';
-// import {createIntl} from 'react-intl';
-
-// import {shallowWithIntl, mountWithIntl} from 'tests/helpers/intl-test-helper';
-// import {fakeDate} from 'tests/helpers/date';
-// import defaultMessages from 'i18n/en.json';
-
-// import Timestamp from './timestamp';
-// import SemanticTime from './semantic_time';
-
-// import {RelativeRanges} from './index';
-
-// describe('components/timestamp/Timestamp', () => {
-//     let resetFakeDate: () => void;
-
-//     beforeEach(() => {
-//         resetFakeDate = fakeDate(new Date('2019-05-03T13:20:00Z'));
-//     });
-
-//     afterEach(() => {
-//         resetFakeDate();
-//     });
-
-//     function daysFromNow(diff: number) {
-//         const date = new Date();
-//         date.setDate(date.getDate() + diff);
-//         return date;
-//     }
-
-//     test('should be wrapped in SemanticTime and support passthrough className and label', () => {
-//         const wrapper = shallowWithIntl(
-//             <Timestamp
-//                 useTime={false}
-//                 className='test class'
-//                 label='test label'
-//             />,
-//         );
-//         expect(wrapper).toMatchSnapshot();
-//         expect(wrapper.find(SemanticTime).exists()).toBeTruthy();
-//         expect(wrapper.find(SemanticTime).prop('className')).toBe('test class');
-//         expect(wrapper.find(SemanticTime).prop('aria-label')).toBe('test label');
-//     });
-
-//     test('should not be wrapped in SemanticTime', () => {
-//         const wrapper = shallowWithIntl(
-//             <Timestamp
-//                 useTime={false}
-//                 useSemanticOutput={false}
-//             />,
-//         );
-//         expect(wrapper).toMatchSnapshot();
-//         expect(wrapper.find(SemanticTime).exists()).toBeFalsy();
-//     });
-
-//     test.each(moment.tz.names())('should render supported timezone %p', (timeZone) => {
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 value={new Date('Fri Jan 12 2018 20:15:13 GMT+0000 (+00)').getTime()}
-//                 useDate={false}
-//                 timeZone={timeZone}
-//             />,
-//             {
-//                 intl: createIntl({
-//                     locale: 'es',
-//                     defaultLocale: 'es',
-//                     timeZone: 'Etc/UTC',
-//                     messages: defaultMessages,
-//                     textComponent: 'span',
-//                 }),
-//             },
-//         );
-//         expect(wrapper.find('time').prop('dateTime')).toEqual(expect.any(String));
-//         expect(wrapper.text()).toMatch(/\d{1,2}:\d{2}\s(?:AM|PM|a\.\sm\.|p\.\sm\.)/);
-//     });
-
-//     test('should render title-case Today', () => {
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 useTime={false}
-//                 ranges={[
-//                     RelativeRanges.TODAY_TITLE_CASE,
-//                 ]}
-//             />,
-//         );
-//         expect(wrapper.text()).toEqual('Today');
-//     });
-
-//     test('should render normal today', () => {
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 value={daysFromNow(0)}
-//                 useTime={false}
-//                 ranges={[
-//                     RelativeRanges.TODAY_YESTERDAY,
-//                 ]}
-//             />,
-//         );
-//         expect(wrapper.text()).toEqual('today');
-//     });
-
-//     test('should render title-case Yesterday', () => {
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 value={daysFromNow(-1)}
-//                 useTime={false}
-//                 ranges={[
-//                     RelativeRanges.YESTERDAY_TITLE_CASE,
-//                 ]}
-//             />,
-//         );
-//         expect(wrapper.text()).toEqual('Yesterday');
-//     });
-
-//     test('should render normal yesterday', () => {
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 value={daysFromNow(-1)}
-//                 useTime={false}
-//                 ranges={[
-//                     RelativeRanges.TODAY_YESTERDAY,
-//                 ]}
-//             />,
-//         );
-//         expect(wrapper.text()).toEqual('yesterday');
-//     });
-
-//     test('should render normal tomorrow', () => {
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 value={daysFromNow(1)}
-//                 useTime={false}
-//                 unit='day'
-//             />,
-//         );
-//         expect(wrapper.text()).toEqual('tomorrow');
-//     });
-
-//     test('should render 3 days ago', () => {
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 value={daysFromNow(-3)}
-//                 useTime={false}
-//                 unit='day'
-//             />,
-//         );
-//         expect(wrapper.text()).toEqual('3 days ago');
-//     });
-
-//     test('should render 3 days ago as weekday', () => {
-//         const date = daysFromNow(-3);
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 value={date}
-//                 useTime={false}
-//             />,
-//         );
-//         expect(wrapper.text()).toEqual(moment.utc(date).format('dddd'));
-//     });
-
-//     test('should render 6 days ago as weekday', () => {
-//         const date = daysFromNow(-6);
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 value={date}
-//                 useTime={false}
-//             />,
-//         );
-
-//         expect(wrapper.text()).toEqual(moment(date).format('dddd'));
-//     });
-
-//     test('should render 2 days ago as weekday in supported timezone', () => {
-//         const date = daysFromNow(-2);
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 value={date}
-//                 timeZone='Asia/Manila'
-//                 useTime={false}
-//             />,
-//         );
-
-//         expect(wrapper.text()).toEqual(moment.utc(date).tz('Asia/Manila').format('dddd'));
-//     });
-
-//     test('should render date in current year', () => {
-//         const date = daysFromNow(-20);
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 value={date}
-//                 useTime={false}
-//             />,
-//         );
-
-//         expect(wrapper.text()).toEqual(moment.utc(date).format('MMMM DD'));
-//     });
-
-//     test('should render date from previous year', () => {
-//         const date = daysFromNow(-365);
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 value={date}
-//                 useTime={false}
-//             />,
-//         );
-
-//         expect(wrapper.text()).toEqual(moment.utc(date).format('MMMM DD, YYYY'));
-//     });
-
-//     test('should render time without timezone', () => {
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 value={new Date('Fri Jan 12 2018 20:15:13 GMT+0800 (+08)').getTime()}
-//                 useDate={false}
-//             />,
-//         );
-//         expect(wrapper.text()).toBe('12:15 PM');
-//     });
-
-//     test('should render time without timezone, in military time', () => {
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 value={new Date('Fri Jan 12 2018 23:15:13 GMT+0800 (+08)').getTime()}
-//                 hourCycle='h23'
-//                 useDate={false}
-//             />,
-//         );
-//         expect(wrapper.find('time').prop('dateTime')).toBe('2018-01-12T15:15:13.000Z');
-//         expect(wrapper.text()).toBe('15:15');
-//     });
-
-//     test('should render date without timezone', () => {
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 value={new Date('Fri Jan 12 2018 23:15:13 GMT+0800 (+08)').getTime()}
-//                 useTime={false}
-//             />,
-//         );
-
-//         expect(wrapper.find('time').prop('dateTime')).toBe('2018-01-12T15:15:13.000Z');
-//         expect(wrapper.text()).toBe('January 12, 2018');
-//     });
-
-//     test('should render time with timezone enabled', () => {
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 value={new Date('Fri Jan 12 2018 20:15:13 GMT+0000 (+00)').getTime()}
-//                 useDate={false}
-//                 timeZone='Australia/Sydney'
-//             />,
-//         );
-//         expect(wrapper.find('time').prop('dateTime')).toBe('2018-01-12T20:15:13.000Z');
-//         expect(wrapper.text()).toBe('7:15 AM');
-//     });
-
-//     test('should render time with unsupported timezone', () => {
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 value={new Date('Fri Jan 12 2018 20:15:13 GMT+0000 (+00)').getTime()}
-//                 useDate={false}
-//                 timeZone='US/Hawaii'
-//             />,
-//         );
-//         expect(wrapper.find('time').prop('dateTime')).toBe('2018-01-12T20:15:13.000Z');
-//         expect(wrapper.text()).toBe('10:15 AM');
-//     });
-
-//     test('should render date with unsupported timezone', () => {
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 value={new Date('Fri Jan 12 2018 20:15:13 GMT+0000 (+00)').getTime()}
-//                 useTime={false}
-//                 timeZone='US/Hawaii'
-//             />,
-//         );
-//         expect(wrapper.find('time').prop('dateTime')).toBe('2018-01-12T20:15:13.000Z');
-//         expect(wrapper.find('time').prop('aria-label')).toBe('Fri Jan 12 2018 10:15:13 GMT-1000 (US/Hawaii)');
-//         expect(wrapper.text()).toBe('January 12, 2018');
-//     });
-
-//     test('should render datetime with timezone enabled, in military time', () => {
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 value={new Date('Fri Jan 12 2018 20:15:13 GMT-0800').getTime()}
-//                 hourCycle='h23'
-//                 timeZone='Australia/Sydney'
-//             />,
-//         );
-//         expect(wrapper.find('time').prop('dateTime')).toBe('2018-01-13T04:15:13.000Z');
-//         expect(wrapper.find('time').prop('aria-label')).toBe('Sat Jan 13 2018 15:15:13 GMT+1100 (Australia/Sydney)');
-//         expect(wrapper.text()).toBe('January 13, 2018 at 15:15');
-//     });
-
-//     test('should render time with unsupported timezone enabled, in military time', () => {
-//         const wrapper = mountWithIntl(
-//             <Timestamp
-//                 value={new Date('Fri Jan 12 2018 20:15:13 GMT-0800 (+00)').getTime()}
-//                 hourCycle='h23'
-//                 useDate={false}
-//                 timeZone='US/Alaska'
-//             />,
-//         );
-//         expect(wrapper.find('time').prop('aria-label')).toBe('Fri Jan 12 2018 19:15:13 GMT-0900 (US/Alaska)');
-//         expect(wrapper.text()).toBe('19:15');
-//     });
-// });