-
Notifications
You must be signed in to change notification settings - Fork 3.1k
/
links.tsx
77 lines (69 loc) · 2.67 KB
/
links.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
import {ObjectMeta} from 'argo-ui/src/models/kubernetes';
import {useEffect, useState} from 'react';
import * as React from 'react';
import {Link, Workflow} from '../../../models';
import {services} from '../services';
import {Button} from './button';
function toEpoch(datetime: string) {
if (datetime) {
return new Date(datetime).getTime();
} else {
return Date.now();
}
}
function addEpochTimestamp(jsonObject: {metadata: ObjectMeta; workflow?: Workflow; status?: any}) {
if (jsonObject === undefined || jsonObject.status.startedAt === undefined) {
return;
}
jsonObject.status.startedAtEpoch = toEpoch(jsonObject.status.startedAt);
jsonObject.status.finishedAtEpoch = toEpoch(jsonObject.status.finishedAt);
}
export function processURL(urlExpression: string, jsonObject: any) {
addEpochTimestamp(jsonObject);
/* replace ${} from input url with corresponding elements from object
only return null for known variables, otherwise empty string*/
return urlExpression.replace(/\${[^}]*}/g, x => {
const parts = x.replace(/(\$%7B|%7D|\${|})/g, '').split('.');
const emptyVal = parts[0] === 'workflow' ? '' : null;
const res = parts.reduce((p: any, c: string) => (p && p[c]) || emptyVal, jsonObject);
return res;
});
}
export function openLinkWithKey(url: string) {
if ((window.event as MouseEvent).ctrlKey || (window.event as MouseEvent).metaKey) {
window.open(url, '_blank');
} else {
document.location.href = url;
}
}
export function Links({scope, object, button}: {scope: string; object: {metadata: ObjectMeta; workflow?: Workflow; status?: any}; button?: boolean}) {
const [links, setLinks] = useState<Link[]>();
const [error, setError] = useState<Error>();
useEffect(() => {
services.info
.getInfo()
.then(x => (x.links || []).filter(y => y.scope === scope))
.then(setLinks)
.catch(setError);
}, []);
return (
<>
{error && error.message}
{links &&
links.map(({url, name}) => {
if (button) {
return (
<Button onClick={() => openLinkWithKey(processURL(url, object))} key={name} icon='external-link-alt'>
{name}
</Button>
);
}
return (
<a key={name} href={processURL(url, object)}>
{name} <i className='fa fa-external-link-alt' />
</a>
);
})}
</>
);
}