github.com/argoproj/argo-cd/v2@v2.10.9/ui/src/app/applications/components/pod-logs-viewer/container-selector.tsx (about)

     1  import * as React from 'react';
     2  import {Tooltip} from 'argo-ui';
     3  
     4  export type ContainerGroup = {offset: number; containers: {name: string}[]};
     5  
     6  // ContainerSelector is a component that renders a dropdown menu of containers
     7  export const ContainerSelector = ({
     8      containerGroups,
     9      containerName,
    10      onClickContainer
    11  }: {
    12      containerGroups?: ContainerGroup[];
    13      containerName: string;
    14      onClickContainer: (group: ContainerGroup, index: number, logs: string) => void;
    15  }) => {
    16      if (!containerGroups) {
    17          return <></>;
    18      }
    19  
    20      const containers = containerGroups?.reduce((acc, group) => acc.concat(group.containers), []);
    21      const containerNames = containers?.map(container => container.name);
    22      const containerGroup = (n: string) => {
    23          return containerGroups?.find(group => group.containers?.find(container => container.name === n));
    24      };
    25      const containerIndex = (n: string) => {
    26          return containerGroup(n)?.containers.findIndex(container => container.name === n);
    27      };
    28      if (containerNames.length <= 1) return <></>;
    29      return (
    30          <Tooltip content='Select a container to view logs'>
    31              <select className='argo-field' value={containerName} onChange={e => onClickContainer(containerGroup(e.target.value), containerIndex(e.target.value), 'logs')}>
    32                  {containerNames.map(n => (
    33                      <option key={n} value={n}>
    34                          {n}
    35                      </option>
    36                  ))}
    37              </select>
    38          </Tooltip>
    39      );
    40  };