argo-cd

1
import {Tooltip} from 'argo-ui';
2
import * as React from 'react';
3
import {DataLoader} from '.';
4
import * as models from '../models';
5
import {services} from '../services';
6

7
export const clusterName = (name: string | null) => {
8
    return name || 'Unknown';
9
};
10

11
export const clusterTitle = (cluster: models.Cluster) => {
12
    return `${clusterName(cluster.name)} (${cluster.server})`;
13
};
14

15
const clusterHTML = (cluster: models.Cluster, showUrl: boolean) => {
16
    const text = showUrl ? clusterTitle(cluster) : clusterName(cluster.name);
17
    return (
18
        <Tooltip content={cluster.server}>
19
            <span>{text}</span>
20
        </Tooltip>
21
    );
22
};
23

24
async function getCluster(clusters: Promise<models.Cluster[]>, server: string, name: string): Promise<models.Cluster> {
25
    let cluster: models.Cluster;
26
    if (clusters) {
27
        cluster = await clusters.then(items => items.find(item => item.server === server || item.name === name));
28
    } else {
29
        try {
30
            cluster = await services.clusters.get(server, name);
31
        } catch {
32
            cluster = null;
33
        }
34
    }
35
    if (!cluster) {
36
        cluster = {
37
            name: server,
38
            server
39
        };
40
    }
41
    return cluster;
42
}
43

44
export const ClusterCtx = React.createContext<Promise<Array<models.Cluster>>>(null);
45

46
export const Cluster = (props: {server: string; name?: string; showUrl?: boolean}) => (
47
    <ClusterCtx.Consumer>
48
        {clusters => (
49
            <DataLoader input={props} loadingRenderer={() => <span>{props.server}</span>} load={input => getCluster(clusters, input.server, input.name)}>
50
                {(cluster: models.Cluster) => clusterHTML(cluster, props.showUrl)}
51
            </DataLoader>
52
        )}
53
    </ClusterCtx.Consumer>
54
);
55