import React from 'react' ; import { useData } from '@spinnaker/core' ; import { VpcReader } from './VpcReader' ; export interface IVpcTagProps { vpcId : string ; } const defaultLabel = 'None (EC2 Classic)' ; export function VpcTag ( props ) { const { vpcId } = props ; const fetchVpcLabel = useData ( async ( ) => { const name = await VpcReader . getVpcName ( props . vpcId ) ; return name ? `${ name } (${ props . vpcId })` : `(${ props . vpcId })` ; } , defaultLabel , [ vpcId ] ) ; const label = vpcId ? fetchVpcLabel . result : defaultLabel ; return < span className = "vpc-tag" > { label } < /span>; }