import {Button, Divider, List, Result, Space, Tooltip, Typography, Upload} from "antd";
import {CloudDownloadOutlined, DeleteOutlined, UploadOutlined} from "@ant-design/icons";
import useBackupManageTab from "./useBackupManageTab.js";
import LoadingIndicator from "../../../../Widgets/LoadingIndicator/LoadingIndicator.jsx";

const BackupManageTab = () => {
    const backupManageTabData = useBackupManageTab();

    if (backupManageTabData.isLoadingBackups) {
        return <LoadingIndicator/>;
    }

    if (backupManageTabData.isErrorBackups) {
        return <Result status={500} title="Произошла ошибка при загрузке резервных копий"/>
    }

    return (
        <>
            <Space direction="horizontal" size="large" style={{width: "100%"}}>
                <Button
                    type="primary"
                    icon={<CloudDownloadOutlined/>}
                    onClick={backupManageTabData.createBackupHandler}
                    loading={backupManageTabData.isCreatingBackup}

                >
                    Создать резервную копию
                </Button>
                <Upload
                    showUploadList={false}
                    accept=".tar.gz,.zip"
                    disabled={backupManageTabData.isUploadingBackup}
                    beforeUpload={(file) => {
                        backupManageTabData.uploadBackupHandler(file);
                        return false;
                    }}
                >
                    <Button icon={<UploadOutlined/>} block>
                        Загрузить резервную копию для восстановления
                    </Button>
                </Upload>
            </Space>
            <Divider/>
            <List
                dataSource={backupManageTabData.backups}
                renderItem={(backup) => (
                    <List.Item>
                        <Typography.Text>{backup.filename}</Typography.Text>
                        <Typography.Text>Создан: {new Date(backup.timestamp).toLocaleString()}</Typography.Text>
                        <Tooltip title="Скачать резервную копию">
                            <Button
                                type="primary"
                                icon={<CloudDownloadOutlined/>}
                                onClick={() => backupManageTabData.downloadBackupHandler(backup.id, backup.filename)}
                                loading={backupManageTabData.isDownloadingBackup}
                            >
                                Скачать
                            </Button>
                        </Tooltip>
                        <Tooltip title="Удалить резервную копию">
                            <Button
                                type="primary"
                                icon={<DeleteOutlined/>}
                                onClick={() => backupManageTabData.deleteBackupHandler(backup.id)}
                                loading={backupManageTabData.isDeletingBackup}
                                danger
                            >
                                Удалить
                            </Button>
                        </Tooltip>
                    </List.Item>
                )}
            />
        </>

    );
};

export default BackupManageTab;