Daniil
54 lines
1.2 KiB
TypeScript
54 lines
1.2 KiB
TypeScript
"use client"
|
||
|
||
import type { IDeleteFileModalProps } from "./DeleteFileModal.d"
|
||
import type { JSX } from "react"
|
||
|
||
import { FunctionComponent } from "react"
|
||
|
||
import { Button, Modal } from "@shared/ui"
|
||
|
||
import styles from "./DeleteFileModal.module.scss"
|
||
|
||
export const DeleteFileModal: FunctionComponent<IDeleteFileModalProps> = ({
|
||
open,
|
||
onOpenChange,
|
||
fileName,
|
||
onConfirm,
|
||
isPending,
|
||
}): JSX.Element => {
|
||
return (
|
||
<Modal
|
||
open={open}
|
||
onOpenChange={onOpenChange}
|
||
title="Удалить файл"
|
||
description="Это действие нельзя отменить"
|
||
>
|
||
<div className={styles.root} data-testid="DeleteFileModal">
|
||
<p className={styles.message}>
|
||
Вы уверены, что хотите удалить файл{" "}
|
||
<span className={styles.fileName}>{fileName}</span>?
|
||
</p>
|
||
|
||
<div className={styles.actions}>
|
||
<Button
|
||
type="button"
|
||
variant="outline"
|
||
disabled={isPending}
|
||
onClick={() => onOpenChange?.(false)}
|
||
>
|
||
Отмена
|
||
</Button>
|
||
<Button
|
||
type="button"
|
||
variant="danger"
|
||
disabled={isPending}
|
||
onClick={onConfirm}
|
||
>
|
||
Удалить
|
||
</Button>
|
||
</div>
|
||
</div>
|
||
</Modal>
|
||
)
|
||
}
|