import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { defineMessages, useIntl } from "react-intl";
import { UiButton } from "../../@ui/UiButton/UiButton.js";
import { UploadItemStatus } from "../types.js";
import { b, e } from "./uploadFileListBem.js";
const messages = defineMessages({
    statusUploading: { id: "fileUpload.status.uploading" },
    statusUploaded: { id: "fileUpload.status.uploaded" },
    statusFailed: { id: "fileUpload.status.failed" },
    statusReady: { id: "fileUpload.status.ready" },
    actionRetry: { id: "fileUpload.action.retry" },
    actionRemove: { id: "fileUpload.action.remove" },
    listLabel: { id: "fileUpload.list.label" },
    actionRetryFile: { id: "fileUpload.action.retryFile" },
    actionRemoveFile: { id: "fileUpload.action.removeFile" },
});
const getStatusText = (item, intl) => {
    switch (item.status) {
        case UploadItemStatus.Uploading:
            return intl.formatMessage(messages.statusUploading);
        case UploadItemStatus.Success:
            return intl.formatMessage(messages.statusUploaded);
        case UploadItemStatus.Error:
            return item.errorMessage ?? intl.formatMessage(messages.statusFailed);
        case UploadItemStatus.Idle:
        default:
            return intl.formatMessage(messages.statusReady);
    }
};
/**
 * @internal
 */
export function UploadFileList({ files, emptyStateLabel, onRemoveFile, onRetryFile }) {
    const intl = useIntl();
    if (!files.length) {
        return emptyStateLabel ? _jsx("div", { children: emptyStateLabel }) : null;
    }
    return (_jsx("ul", { className: b(), "aria-label": intl.formatMessage(messages.listLabel), children: files.map((item) => {
            const isError = item.status === UploadItemStatus.Error;
            return (_jsxs("li", { className: e("item"), children: [
                    _jsxs("div", { className: e("item-content"), children: [
                            _jsx("span", { className: e("item-name"), children: item.file.name }), _jsx("span", { className: e("item-status"), role: isError ? "alert" : undefined, "aria-live": isError ? undefined : "polite", children: getStatusText(item, intl) })
                        ] }), _jsxs("div", { className: e("item-actions"), children: [isError && onRetryFile ? (_jsx(UiButton, { label: intl.formatMessage(messages.actionRetry), accessibilityConfig: {
                                    ariaLabel: intl.formatMessage(messages.actionRetryFile, {
                                        fileName: item.file.name,
                                    }),
                                }, onClick: () => onRetryFile(item.id) })) : null, onRemoveFile ? (_jsx(UiButton, { label: intl.formatMessage(messages.actionRemove), accessibilityConfig: {
                                    ariaLabel: intl.formatMessage(messages.actionRemoveFile, {
                                        fileName: item.file.name,
                                    }),
                                }, onClick: () => onRemoveFile(item.id) })) : null] })
                ] }, item.id));
        }) }));
}
