signal-desktop/ts/components/CallingAudioIndicator.stories.tsx
2022-11-17 16:45:19 -08:00

54 lines
1.2 KiB
TypeScript

// Copyright 2022 Signal Messenger, LLC
// SPDX-License-Identifier: AGPL-3.0-only
import React, { useState, useEffect } from 'react';
import { boolean } from '@storybook/addon-knobs';
import { CallingAudioIndicator } from './CallingAudioIndicator';
import { AUDIO_LEVEL_INTERVAL_MS } from '../calling/constants';
export default {
title: 'Components/CallingAudioIndicator',
};
export function Extreme(): JSX.Element {
const [audioLevel, setAudioLevel] = useState(1);
useEffect(() => {
const timer = setTimeout(() => {
setAudioLevel(1 - audioLevel);
}, 2 * AUDIO_LEVEL_INTERVAL_MS);
return () => {
clearTimeout(timer);
};
}, [audioLevel, setAudioLevel]);
return (
<CallingAudioIndicator
hasAudio={boolean('hasAudio', true)}
audioLevel={audioLevel}
/>
);
}
export function Random(): JSX.Element {
const [audioLevel, setAudioLevel] = useState(1);
useEffect(() => {
const timer = setTimeout(() => {
setAudioLevel(Math.random());
}, AUDIO_LEVEL_INTERVAL_MS);
return () => {
clearTimeout(timer);
};
}, [audioLevel, setAudioLevel]);
return (
<CallingAudioIndicator
hasAudio={boolean('hasAudio', true)}
audioLevel={audioLevel}
/>
);
}