argo-cd

1
import * as React from 'react';
2
import {Tooltip} from 'argo-ui';
3
import {Application} from '../../../shared/models';
4
import {getAppDefaultSource} from '../utils';
5

6
import './applications-labels.scss';
7

8
export const ApplicationsLabels = ({app}: {app: Application}) => {
9
    const labels = (
10
        <>
11
            <span className='application-labels__item'>{getAppDefaultSource(app).targetRevision || 'HEAD'}</span>
12
            {Object.keys(app.metadata.labels || {}).map(label => (
13
                <span className='application-labels__item' key={label}>{`${label}=${app.metadata.labels[label]}`}</span>
14
            ))}
15
        </>
16
    );
17

18
    return (
19
        <Tooltip
20
            popperOptions={{
21
                modifiers: {
22
                    preventOverflow: {
23
                        enabled: true
24
                    },
25
                    hide: {
26
                        enabled: false
27
                    }
28
                }
29
            }}
30
            placement='auto-start'
31
            content={<div className='application-labels-tooltip'>{labels}</div>}>
32
            <div className='application-labels'>{labels}</div>
33
        </Tooltip>
34
    );
35
};
36