♻️(frontend) extract MuteAlertDialog in a dedicated component
Will be reused in actions displayed when a participant tile is focused.
This commit is contained in:
committed by
aleb_the_flash
parent
723b8718f9
commit
0b74cf96f2
@@ -0,0 +1,30 @@
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import { Button, Dialog, P } from '@/primitives'
|
||||
import { HStack } from '@/styled-system/jsx'
|
||||
|
||||
export const MuteAlertDialog = ({
|
||||
isOpen,
|
||||
onClose,
|
||||
onSubmit,
|
||||
name,
|
||||
}: {
|
||||
isOpen: boolean
|
||||
onClose: () => void
|
||||
onSubmit: () => void
|
||||
name: string
|
||||
}) => {
|
||||
const { t } = useTranslation('rooms')
|
||||
return (
|
||||
<Dialog isOpen={isOpen} role="alertdialog">
|
||||
<P>{t('participants.muteParticipantAlert.description', { name })}</P>
|
||||
<HStack gap={1}>
|
||||
<Button variant="text" size="sm" onPress={onClose}>
|
||||
{t('participants.muteParticipantAlert.cancel')}
|
||||
</Button>
|
||||
<Button variant="text" size="sm" onPress={onSubmit}>
|
||||
{t('participants.muteParticipantAlert.confirm')}
|
||||
</Button>
|
||||
</HStack>
|
||||
</Dialog>
|
||||
)
|
||||
}
|
||||
@@ -13,36 +13,10 @@ import {
|
||||
} from '@livekit/components-react'
|
||||
import Source = Track.Source
|
||||
import { RiMicFill, RiMicOffFill } from '@remixicon/react'
|
||||
import { Button, Dialog, P } from '@/primitives'
|
||||
import { Button } from '@/primitives'
|
||||
import { useState } from 'react'
|
||||
import { useMuteParticipant } from '@/features/rooms/livekit/api/muteParticipant'
|
||||
|
||||
const MuteAlertDialog = ({
|
||||
isOpen,
|
||||
onClose,
|
||||
onSubmit,
|
||||
name,
|
||||
}: {
|
||||
isOpen: boolean
|
||||
onClose: () => void
|
||||
onSubmit: () => void
|
||||
name: string
|
||||
}) => {
|
||||
const { t } = useTranslation('rooms')
|
||||
return (
|
||||
<Dialog isOpen={isOpen} role="alertdialog">
|
||||
<P>{t('participants.muteParticipantAlert.description', { name })}</P>
|
||||
<HStack gap={1}>
|
||||
<Button variant="text" size="sm" onPress={onClose}>
|
||||
{t('participants.muteParticipantAlert.cancel')}
|
||||
</Button>
|
||||
<Button variant="text" size="sm" onPress={onSubmit}>
|
||||
{t('participants.muteParticipantAlert.confirm')}
|
||||
</Button>
|
||||
</HStack>
|
||||
</Dialog>
|
||||
)
|
||||
}
|
||||
import { MuteAlertDialog } from '../../MuteAlertDialog'
|
||||
|
||||
type MicIndicatorProps = {
|
||||
participant: Participant
|
||||
|
||||
Reference in New Issue
Block a user