@openshift-assisted/ui-lib
Version:
React component library for the Assisted Installer UI
56 lines • 3.05 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const react_1 = tslib_1.__importDefault(require("react"));
const react_core_1 = require("@patternfly/react-core");
const ui_1 = require("../ui");
const config_1 = require("../../config");
require("./ClusterProgress.css");
const use_translation_wrapper_1 = require("../../hooks/use-translation-wrapper");
const getProgressVariant = (status) => {
switch (status) {
case 'cancelled':
case 'error':
return react_core_1.ProgressVariant.danger;
case 'installed':
case 'adding-hosts':
return react_core_1.ProgressVariant.success;
default:
return undefined;
}
};
const getMeasureLocation = (status) => ['installed', 'adding-hosts'].includes(status)
? react_core_1.ProgressMeasureLocation.none
: react_core_1.ProgressMeasureLocation.top;
const getInstallationStatus = (status, installCompletedAt, t) => {
if (status === 'installed' || status === 'adding-hosts') {
return t('ai:Installed on {{humanizedDataTime}}', {
humanizedDataTime: (0, ui_1.getHumanizedDateTime)(installCompletedAt),
});
}
if (status === 'error') {
return t('ai:Failed on {{humanizedDataTime}}', {
humanizedDataTime: (0, ui_1.getHumanizedDateTime)(installCompletedAt),
});
}
if (status === 'cancelled') {
return t('ai:Cancelled on {{humanizedDataTime}}', {
humanizedDataTime: (0, ui_1.getHumanizedDateTime)(installCompletedAt),
});
}
return (0, config_1.clusterStatusLabels)(t)[status] || status;
};
const ClusterProgress = ({ cluster, minimizedView = false, totalPercentage, }) => {
const { status } = cluster;
const { t } = (0, use_translation_wrapper_1.useTranslation)();
return (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement(ui_1.DetailList, null,
react_1.default.createElement(react_core_1.Flex, { direction: { default: minimizedView ? 'row' : 'column' } },
react_1.default.createElement(react_core_1.FlexItem, null,
react_1.default.createElement(ui_1.DetailItem, { title: t('ai:Started on'), value: (0, ui_1.getHumanizedDateTime)(cluster.installStartedAt), idPrefix: "cluster-progress-started-on" })),
react_1.default.createElement(react_core_1.FlexItem, null,
react_1.default.createElement(ui_1.DetailItem, { value: getInstallationStatus(cluster.status, cluster.installCompletedAt, t), idPrefix: "cluster-progress-status" })))),
!minimizedView && (react_1.default.createElement(react_core_1.Progress, { id: "cluster-progress-bar", value: totalPercentage || 0, label: `${totalPercentage || 0}%`, title: " ", measureLocation: getMeasureLocation(status), variant: getProgressVariant(status), className: "cluster-progress-bar" }))));
};
exports.default = ClusterProgress;
//# sourceMappingURL=ClusterProgress.js.map