Lens app source code (#119)

Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com>

dashboard/client/components/+custom-resources/certmanager.k8s.io/issuers.tsx

@@ -0,0 +1,103 @@
+import "./issuers.scss"
+
+import * as React from "react";
+import { observer } from "mobx-react";
+import { Trans } from "@lingui/macro";
+import { KubeObjectMenu, KubeObjectMenuProps } from "../../kube-object/kube-object-menu";
+import { KubeObjectListLayout, KubeObjectListLayoutProps } from "../../kube-object";
+import { clusterIssuersApi, Issuer, issuersApi } from "../../../api/endpoints/cert-manager.api";
+import { cssNames } from "../../../utils";
+import { Badge } from "../../badge";
+import { Spinner } from "../../spinner";
+import { apiManager } from "../../../api/api-manager";
+
+enum sortBy {
+  name = "name",
+  namespace = "namespace",
+  type = "type",
+  labels = "labels",
+  age = "age",
+}
+
+@observer
+export class ClusterIssuers extends React.Component<KubeObjectListLayoutProps> {
+  render() {
+    const store = apiManager.getStore(clusterIssuersApi);
+    return (
+      <Issuers
+        {...this.props}
+        isClusterScoped={true}
+        store={store}
+        renderHeaderTitle={<Trans>Cluster Issuers</Trans>}
+      />
+    )
+  }
+}
+
+@observer
+export class Issuers extends React.Component<KubeObjectListLayoutProps> {
+  render() {
+    const { store = apiManager.getStore(issuersApi), ...layoutProps } = this.props;
+    if (!store) {
+      return <Spinner center/>
+    }
+    return (
+      <KubeObjectListLayout
+        store={store}
+        renderHeaderTitle={<Trans>Issuers</Trans>}
+        {...layoutProps}
+        className="Issuers"
+        sortingCallbacks={{
+          [sortBy.name]: (item: Issuer) => item.getName(),
+          [sortBy.namespace]: (item: Issuer) => item.getNs(),
+          [sortBy.type]: (item: Issuer) => item.getType(),
+          [sortBy.labels]: (item: Issuer) => item.getLabels(),
+          [sortBy.age]: (item: Issuer) => item.getAge(false),
+        }}
+        searchFilters={[
+          (item: Issuer) => item.getSearchFields(),
+          (item: Issuer) => item.getType(),
+        ]}
+        renderTableHeader={[
+          { title: <Trans>Name</Trans>, className: "name", sortBy: sortBy.name },
+          { title: <Trans>Namespace</Trans>, className: "namespace", sortBy: sortBy.namespace },
+          { title: <Trans>Labels</Trans>, className: "labels", sortBy: sortBy.labels },
+          { title: <Trans>Type</Trans>, className: "type", sortBy: sortBy.type },
+          { title: <Trans>Age</Trans>, className: "age", sortBy: sortBy.age },
+          { title: <Trans>Status</Trans>, className: "status" },
+        ]}
+        renderTableContents={(issuer: Issuer) => [
+          issuer.getName(),
+          issuer.getNs(),
+          issuer.getLabels().map(label => <Badge key={label} label={label} title={label}/>),
+          issuer.getType(),
+          issuer.getAge(),
+          issuer.getConditions().map(({ type, tooltip, isReady }) => {
+            return (
+              <Badge
+                key={type}
+                label={type}
+                tooltip={tooltip}
+                className={cssNames({ [type.toLowerCase()]: isReady })}
+              />
+            )
+          })
+        ]}
+        renderItemMenu={(item: Issuer) => {
+          return <IssuerMenu object={item}/>
+        }}
+      />
+    );
+  }
+}
+
+export function IssuerMenu(props: KubeObjectMenuProps<Issuer>) {
+  return (
+    <KubeObjectMenu {...props}/>
+  )
+}
+
+apiManager.registerViews([issuersApi, clusterIssuersApi], {
+  List: Issuers,
+  Menu: IssuerMenu,
+})