"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.DashboardScreen = void 0;
var tslib_1 = require("tslib");
var React = tslib_1.__importStar(require("react"));
var ui_1 = require("../ui");
var DashboardScreen = function (_a) {
    var api = _a.api, onNavigate = _a.onNavigate;
    var _b = React.useState(), requestTypesCount = _b[0], setRequestTypesCount = _b[1];
    var _c = React.useState(), routesCount = _c[0], setRoutesCount = _c[1];
    React.useEffect(function () {
        api.requestTypes.list().then(function (items) { return setRequestTypesCount(items.length); }).catch(function () { return setRequestTypesCount(undefined); });
        api.templateRoutes.list().then(function (items) { return setRoutesCount(items.length); }).catch(function () { return setRoutesCount(undefined); });
    }, [api]);
    return (React.createElement("div", null,
        React.createElement(ui_1.StatRow, null,
            React.createElement(ui_1.StatCard, { label: "\u0422\u0438\u043F\u043E\u0432 \u0437\u0430\u044F\u0432\u043E\u043A", value: requestTypesCount !== null && requestTypesCount !== void 0 ? requestTypesCount : '—' }),
            React.createElement(ui_1.StatCard, { label: "\u041C\u0430\u0440\u0448\u0440\u0443\u0442\u043E\u0432 \u0441\u043E\u0433\u043B\u0430\u0441\u043E\u0432\u0430\u043D\u0438\u044F", value: routesCount !== null && routesCount !== void 0 ? routesCount : '—' })),
        React.createElement("div", { style: { fontSize: 10, textTransform: 'uppercase', letterSpacing: 1.6, color: 'var(--gray-400)', fontWeight: 600, marginBottom: 12 } }, "\u0420\u0430\u0437\u0434\u0435\u043B\u044B"),
        React.createElement("hr", { style: { height: 1, background: 'linear-gradient(90deg, var(--gold-400), transparent 70%)', border: 0, margin: '6px 0 22px' } }),
        React.createElement(ui_1.CardGrid, null,
            React.createElement(ui_1.NavCard, { icon: "clipboard", title: "\u0422\u0438\u043F\u044B \u0437\u0430\u044F\u0432\u043E\u043A", description: "\u0421\u043F\u0440\u0430\u0432\u043E\u0447\u043D\u0438\u043A \u0442\u0438\u043F\u043E\u0432 \u0437\u0430\u044F\u0432\u043E\u043A \u0438 \u0438\u0445 \u0441\u0442\u0440\u0430\u043D\u0438\u0446", onClick: function () { return onNavigate('requestTypes'); } }),
            React.createElement(ui_1.NavCard, { icon: "route", title: "\u041C\u0430\u0440\u0448\u0440\u0443\u0442\u044B \u0441\u043E\u0433\u043B\u0430\u0441\u043E\u0432\u0430\u043D\u0438\u044F", description: "\u041C\u0430\u0440\u0448\u0440\u0443\u0442\u044B, \u0448\u0430\u0433\u0438 \u0438 \u0438\u0441\u043F\u043E\u043B\u043D\u0438\u0442\u0435\u043B\u0438", onClick: function () { return onNavigate('routes'); } }),
            React.createElement(ui_1.NavCard, { icon: "search", title: "\u041F\u0440\u043E\u0432\u0435\u0440\u043A\u0430 \u043C\u0430\u0440\u0448\u0440\u0443\u0442\u0430", description: "\u041A\u0430\u043A \u0440\u0430\u0437\u0440\u0435\u0448\u0438\u0442\u0441\u044F \u043C\u0430\u0440\u0448\u0440\u0443\u0442 \u0434\u043B\u044F \u043A\u043E\u043D\u043A\u0440\u0435\u0442\u043D\u043E\u0433\u043E \u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u0435\u043B\u044F", onClick: function () { return onNavigate('resolve'); } }))));
};
exports.DashboardScreen = DashboardScreen;
//# sourceMappingURL=DashboardScreen.js.map