Desktop/ts/components/conversation/ExpireTimer.dom.stories.tsx

// Copyright 2020 Signal Messenger, LLC
// SPDX-License-Identifier: AGPL-3.0-only

import * as React from 'react';
import type { Meta } from '@storybook/react';
import type { Props } from './ExpireTimer.dom.js';
import { ExpireTimer } from './ExpireTimer.dom.js';

export default {
  title: 'Components/Conversation/ExpireTimer',
} satisfies Meta<Props>;

const createProps = (overrideProps: Partial<Props> = {}): Props => ({
  expirationLength: overrideProps.expirationLength || 30 * 1000,
  expirationTimestamp:
    overrideProps.expirationTimestamp || Date.now() + 30 * 1000,
});

export const _30Seconds = (): React.JSX.Element => {
  const props = createProps();

  return <ExpireTimer {...props} />;
};

export const _2Minutes = (): React.JSX.Element => {
  const twoMinutes = 60 * 1000 * 2;
  const props = createProps({
    expirationTimestamp: Date.now() + twoMinutes,
    expirationLength: twoMinutes,
  });

  return <ExpireTimer {...props} />;
};

export function InProgress(): React.JSX.Element {
  const props = createProps({
    expirationTimestamp: Date.now() + 15 * 1000,
  });

  return <ExpireTimer {...props} />;
}

export function Expired(): React.JSX.Element {
  const props = createProps({
    expirationTimestamp: Date.now() - 30 * 1000,
  });

  return <ExpireTimer {...props} />;
}

export function ExpirationTooFarOut(): React.JSX.Element {
  const props = createProps({
    expirationTimestamp: Date.now() + 150 * 1000,
  });

  return <ExpireTimer {...props} />;
}