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

import * as React from 'react';
import { action } from '@storybook/addon-actions';
import type { Meta } from '@storybook/react';
import type { PropsType } from './IncomingCallBar.dom.js';
import { IncomingCallBar } from './IncomingCallBar.dom.js';
import { CallMode } from '../types/CallDisposition.std.js';
import { getDefaultConversation } from '../test-helpers/getDefaultConversation.std.js';

const { i18n } = window.SignalContext;

const commonProps = {
  acceptCall: action('accept-call'),
  bounceAppIconStart: action('bounceAppIconStart'),
  bounceAppIconStop: action('bounceAppIconStop'),
  call: {
    conversationId: 'fake-conversation-id',
    callId: 0,
    isIncoming: true,
    isVideoCall: true,
  },
  conversation: getDefaultConversation({
    id: '3051234567',
    avatarUrl: undefined,
    name: 'Rick Sanchez',
    phoneNumber: '3051234567',
    profileName: 'Rick Sanchez',
    title: 'Rick Sanchez',
  }),
  declineCall: action('decline-call'),
  i18n,
  notifyForCall: action('notify-for-call'),
};

const directConversation = getDefaultConversation({
  id: '3051234567',
  avatarUrl: undefined,
  name: 'Rick Sanchez',
  phoneNumber: '3051234567',
  profileName: 'Rick Sanchez',
  title: 'Rick Sanchez',
});

const groupConversation = getDefaultConversation({
  avatarUrl: undefined,
  name: 'Tahoe Trip',
  title: 'Tahoe Trip',
  type: 'group',
});

export default {
  title: 'Components/IncomingCallBar',
} satisfies Meta<PropsType>;

export function IncomingDirectCallVideo(): React.JSX.Element {
  return (
    <IncomingCallBar
      {...commonProps}
      conversation={directConversation}
      callMode={CallMode.Direct}
      isVideoCall
    />
  );
}

export function IncomingDirectCallAudio(): React.JSX.Element {
  return (
    <IncomingCallBar
      {...commonProps}
      conversation={directConversation}
      callMode={CallMode.Direct}
      isVideoCall={false}
    />
  );
}

export function IncomingGroupCallOnlyCallingYou(): React.JSX.Element {
  return (
    <IncomingCallBar
      {...commonProps}
      conversation={groupConversation}
      callMode={CallMode.Group}
      otherMembersRung={[]}
      ringer={{ firstName: 'Rick', title: 'Rick Sanchez' }}
    />
  );
}

export function IncomingGroupCallCallingYouAnd1Other(): React.JSX.Element {
  return (
    <IncomingCallBar
      {...commonProps}
      conversation={groupConversation}
      callMode={CallMode.Group}
      otherMembersRung={[{ firstName: 'Morty', title: 'Morty Smith' }]}
      ringer={{ firstName: 'Rick', title: 'Rick Sanchez' }}
    />
  );
}

export function IncomingGroupCallCallingYouAnd2Others(): React.JSX.Element {
  return (
    <IncomingCallBar
      {...commonProps}
      conversation={groupConversation}
      callMode={CallMode.Group}
      otherMembersRung={[
        { firstName: 'Morty', title: 'Morty Smith' },
        { firstName: 'Summer', title: 'Summer Smith' },
      ]}
      ringer={{ firstName: 'Rick', title: 'Rick Sanchez' }}
    />
  );
}

export function IncomingGroupCallCallingYouAnd3Others(): React.JSX.Element {
  return (
    <IncomingCallBar
      {...commonProps}
      conversation={groupConversation}
      callMode={CallMode.Group}
      otherMembersRung={[
        { firstName: 'Morty', title: 'Morty Smith' },
        { firstName: 'Summer', title: 'Summer Smith' },
        { firstName: 'Beth', title: 'Beth Smith' },
      ]}
      ringer={{ firstName: 'Rick', title: 'Rick Sanchez' }}
    />
  );
}

export function IncomingGroupCallCallingYouAnd4Others(): React.JSX.Element {
  return (
    <IncomingCallBar
      {...commonProps}
      conversation={groupConversation}
      callMode={CallMode.Group}
      otherMembersRung={[
        { firstName: 'Morty', title: 'Morty Smith' },
        { firstName: 'Summer', title: 'Summer Smith' },
        { firstName: 'Beth', title: 'Beth Sanchez' },
        { firstName: 'Jerry', title: 'Beth Smith' },
      ]}
      ringer={{ firstName: 'Rick', title: 'Rick Sanchez' }}
    />
  );
}
