import {DataLoader, SlidingPanel, Tooltip} from 'argo-ui'; import * as React from 'react'; import {useState} from 'react'; import {VersionMessage} from '../../models'; import {services} from '../../services'; import {ThemeWrapper} from '../layout/layout'; interface VersionPanelProps { isShown: boolean; onClose: () => void; version: Promise; } type CopyState = 'success' | 'failed' | undefined; export function VersionPanel({isShown, onClose, version}: VersionPanelProps) { const [copyState, setCopyState] = useState(undefined); const header = 'Argo CD Server Version'; const buildVersionTable = (version: VersionMessage): React.ReactElement => { const formattedVersion = { 'Argo CD': version.Version, 'Build Date': version.BuildDate, 'Go Version': version.GoVersion, 'Go Compiler': version.Compiler, 'Platform': version.Platform, 'jsonnet': version.JsonnetVersion, 'kustomize': version.KustomizeVersion, 'Helm': version.HelmVersion, 'kubectl': version.KubectlVersion }; return ( <> {Object.entries(formattedVersion).map(([key, value]) => (

{key}

{value && ( {value} )}

))} ); }; const getCopyButton = (version: VersionMessage): React.ReactElement => { let img: string; let text: string; if (copyState === 'success') { img = 'fa-check'; text = 'Copied'; } else if (copyState === 'failed') { img = 'fa-times'; text = 'Copy Failed'; } else { img = 'fa-copy'; text = 'Copy JSON'; } return ( ); }; const onCopy = async (version: VersionMessage): Promise => { const stringifiedVersion = JSON.stringify(version, undefined, 4) + '\n'; try { await navigator.clipboard.writeText(stringifiedVersion); setCopyState('success'); } catch { setCopyState('failed'); } setTimeout(() => { setCopyState(undefined); }, 750); }; return ( services.viewPreferences.getPreferences()}> {pref => ( version}> {version => (
{buildVersionTable(version)}

{getCopyButton(version)}
)} )} ); }