@veecode-platform/plugin-kong-service-manager/dist/components/ServicePage/aboutService/AboutService.esm.js

import React from 'react';
import { List, ListItem, Box, ListItemText, Chip } from '@material-ui/core';
import { useAboutServiceStyles } from './styles.esm.js';
import { CopyTextButton } from '@backstage/core-components';
import dayjs from 'dayjs';
import ErrorBoundary from '../../ErrorBoundary/ErrorBondary.esm.js';
import { BoxComponent } from '../../shared/BoxComponent/BoxComponent.esm.js';
import '../../shared/SelectComponent/Select.esm.js';
import { EmptyStateComponent } from '../../shared/EmptyStateComponent/EmptyStateComponent.esm.js';
import '../../shared/HtmlTooltip/HtmlTooltip.esm.js';
import '../../shared/ButtonComponent/styles.esm.js';
import '../../shared/LoadingComponent/styles.esm.js';
import '../../shared/MissingAnnotation/styles.esm.js';
import '@backstage/plugin-catalog-react';
import { SkeletonComponent } from '../../shared/SkeletonComponent/SkeletonComponent.esm.js';
import { LabelField } from '../../shared/Fields/Fields.esm.js';
import '@material-ui/icons/OpenInNew';
import '@material-ui/icons/RemoveRedEye';
import '@material-ui/icons/VisibilityOff';
import '@material-ui/icons/Close';
import '@material-ui/icons/Info';
import '@material-ui/icons/ArrowDropDown';
import '@material-ui/icons/ArrowDropUp';
import '@material-ui/icons/AccountCircle';
import '@material-ui/icons/Add';
import '@material-ui/icons/Remove';
import '@material-ui/icons/Undo';

const AboutService = (props) => {
  const { error, loading, serviceDetails } = props;
  const { listComponent, listItemWrapper, listItem, itemValue } = useAboutServiceStyles();
  if (error) return /* @__PURE__ */ React.createElement(EmptyStateComponent, null);
  if (loading) return /* @__PURE__ */ React.createElement(BoxComponent, { title: "About Service" }, /* @__PURE__ */ React.createElement(List, { className: listComponent }, /* @__PURE__ */ React.createElement(
    SkeletonComponent,
    {
      options: ["id", "Enabled", "Last Updated", "Created", "Protocol", "Host", "Path", "Port", "Tags"]
    }
  )));
  return /* @__PURE__ */ React.createElement(ErrorBoundary, null, /* @__PURE__ */ React.createElement(BoxComponent, { title: "About Service" }, /* @__PURE__ */ React.createElement(List, { className: listComponent }, serviceDetails ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(ListItem, { className: listItemWrapper }, /* @__PURE__ */ React.createElement(Box, { className: listItem }, /* @__PURE__ */ React.createElement(LabelField, { title: "ID" }), /* @__PURE__ */ React.createElement(ListItemText, { className: itemValue }, serviceDetails.id, /* @__PURE__ */ React.createElement(
    CopyTextButton,
    {
      text: serviceDetails.id,
      tooltipText: "Copy ID",
      tooltipDelay: 3e3
    }
  )))), /* @__PURE__ */ React.createElement(ListItem, { className: listItemWrapper }, /* @__PURE__ */ React.createElement(Box, { className: listItem }, /* @__PURE__ */ React.createElement(LabelField, { title: "Name" }), /* @__PURE__ */ React.createElement(ListItemText, { className: itemValue }, serviceDetails.name))), /* @__PURE__ */ React.createElement(ListItem, { className: listItemWrapper }, /* @__PURE__ */ React.createElement(Box, { className: listItem }, /* @__PURE__ */ React.createElement(LabelField, { title: "Enabled" }), /* @__PURE__ */ React.createElement(ListItemText, { className: itemValue }, serviceDetails.enabled ? "\u2705 Enabled" : "\u274C Disabled"))), /* @__PURE__ */ React.createElement(ListItem, { className: listItemWrapper }, /* @__PURE__ */ React.createElement(Box, { className: listItem }, /* @__PURE__ */ React.createElement(LabelField, { title: "Last updated" }), /* @__PURE__ */ React.createElement(ListItemText, { className: itemValue, title: dayjs.unix(serviceDetails.updated_at).format("MM/DD/YYYY") }, `Updated ${dayjs().diff(dayjs.unix(serviceDetails.updated_at), "day")} days ago`))), /* @__PURE__ */ React.createElement(ListItem, { className: listItemWrapper }, /* @__PURE__ */ React.createElement(Box, { className: listItem }, /* @__PURE__ */ React.createElement(LabelField, { title: "Created" }), /* @__PURE__ */ React.createElement(ListItemText, { className: itemValue, title: `Created ${dayjs().diff(dayjs.unix(serviceDetails.created_at), "day")} days ago` }, dayjs.unix(serviceDetails.created_at).format("MM/DD/YYYY")))), /* @__PURE__ */ React.createElement(ListItem, { className: listItemWrapper }, /* @__PURE__ */ React.createElement(Box, { className: listItem }, /* @__PURE__ */ React.createElement(LabelField, { title: "Protocol" }), /* @__PURE__ */ React.createElement(ListItemText, { className: itemValue }, serviceDetails.protocol ?? " - "))), /* @__PURE__ */ React.createElement(ListItem, { className: listItemWrapper }, /* @__PURE__ */ React.createElement(Box, { className: listItem }, /* @__PURE__ */ React.createElement(LabelField, { title: "Host" }), /* @__PURE__ */ React.createElement(ListItemText, { className: itemValue }, serviceDetails.host ?? " - "))), /* @__PURE__ */ React.createElement(ListItem, { className: listItemWrapper }, /* @__PURE__ */ React.createElement(Box, { className: listItem }, /* @__PURE__ */ React.createElement(LabelField, { title: "Path" }), /* @__PURE__ */ React.createElement(ListItemText, { className: itemValue }, serviceDetails.path ?? " - "))), /* @__PURE__ */ React.createElement(ListItem, { className: listItemWrapper }, /* @__PURE__ */ React.createElement(Box, { className: listItem }, /* @__PURE__ */ React.createElement(LabelField, { title: "Port" }), /* @__PURE__ */ React.createElement(ListItemText, { className: itemValue }, serviceDetails.port ?? " - "))), /* @__PURE__ */ React.createElement(ListItem, { className: listItemWrapper }, /* @__PURE__ */ React.createElement(Box, { className: listItem }, /* @__PURE__ */ React.createElement(LabelField, { title: "Tags" }), /* @__PURE__ */ React.createElement(ListItemText, { className: itemValue }, serviceDetails.tags && serviceDetails.tags.length > 0 ? serviceDetails.tags.map((t) => /* @__PURE__ */ React.createElement(Chip, { label: t, key: t })) : " - ")))) : /* @__PURE__ */ React.createElement(ListItem, null, /* @__PURE__ */ React.createElement(ListItemText, null, "No records to display")))));
};

export { AboutService as default };
//# sourceMappingURL=AboutService.esm.js.map