github.com/argoproj/argo-cd/v3@v3.2.1/ui/src/app/applications/components/application-pod-view/pod-tooltip.tsx (about)

     1  import * as React from 'react';
     2  import Moment from 'react-moment';
     3  import {Pod, ResourceName} from '../../../shared/models';
     4  import {isYoungerThanXMinutes, formatResourceInfo} from '../utils';
     5  
     6  export const PodTooltip = (props: {pod: Pod}) => {
     7      const pod = props.pod;
     8  
     9      return (
    10          <div>
    11              <div className='row'>
    12                  <div className='columns small-12'>{pod.metadata.name}</div>
    13              </div>
    14              <div className='row'>
    15                  <div className='columns small-6'>Health:</div>
    16                  <div className='columns small-6'>{pod.health}</div>
    17              </div>
    18              {(pod.info || [])
    19                  .filter(i => {
    20                      //filter out 0 values for CPU and mem on pod info
    21                      return i.name !== 'Node' && !((i.name === ResourceName.ResourceCPU || i.name === ResourceName.ResourceMemory) && parseInt(i.value, 10) === 0);
    22                  })
    23                  .map(i => {
    24                      const isPodRequests = i.name === ResourceName.ResourceCPU || i.name === ResourceName.ResourceMemory;
    25                      let formattedValue = i.value;
    26                      let label = `${i.name}:`;
    27  
    28                      if (isPodRequests) {
    29                          if (i.name === ResourceName.ResourceCPU) {
    30                              const {displayValue} = formatResourceInfo('cpu', i.value);
    31                              formattedValue = displayValue;
    32                              label = 'Requests CPU:';
    33                          } else if (i.name === ResourceName.ResourceMemory) {
    34                              const {displayValue} = formatResourceInfo('memory', i.value);
    35                              formattedValue = displayValue;
    36                              label = 'Requests MEM:';
    37                          }
    38                      }
    39  
    40                      return (
    41                          <div className='row' key={i.name}>
    42                              <div className='columns small-6' style={{whiteSpace: 'nowrap'}}>
    43                                  {label}
    44                              </div>
    45                              <div className='columns small-6'>{formattedValue}</div>
    46                          </div>
    47                      );
    48                  })}
    49              {pod.createdAt && (
    50                  <div className='row'>
    51                      <div className='columns small-6'>
    52                          <span>Created: </span>
    53                      </div>
    54                      <div className='columns small-6'>
    55                          <Moment fromNow={true} ago={true}>
    56                              {pod.createdAt}
    57                          </Moment>
    58                          <span> ago</span>
    59                      </div>
    60                      {isYoungerThanXMinutes(pod, 30) && (
    61                          <div className='columns small-12'>
    62                              <span>
    63                                  <i className='fas fa-circle circle-icon' /> &nbsp;
    64                                  <span>pod age less than 30min</span>
    65                              </span>
    66                          </div>
    67                      )}
    68                  </div>
    69              )}
    70          </div>
    71      );
    72  };