github.com/argoproj/argo-cd@v1.8.7/ui/src/app/shared/components/badge-panel/badge-panel.tsx (about)

     1  import {DataLoader, DropDownMenu} from 'argo-ui';
     2  import * as React from 'react';
     3  
     4  import {services} from '../../../shared/services';
     5  import {Context} from '../../context';
     6  
     7  require('./badge-panel.scss');
     8  
     9  export const BadgePanel = ({app, project}: {app?: string; project?: string}) => {
    10      const [badgeType, setBadgeType] = React.useState('URL');
    11      const context = React.useContext(Context);
    12      const root = `${location.protocol}//${location.host}${context.baseHref}`;
    13  
    14      let badgeURL = '';
    15      let entityURL = '';
    16      let alt = '';
    17      if (app) {
    18          badgeURL = `${root}api/badge?name=${app}&revision=true`;
    19          entityURL = `${root}applications/${app}`;
    20          alt = 'App Status';
    21      } else if (project) {
    22          badgeURL = `${root}api/badge?project=${project}&revision=true`;
    23          entityURL = `${root}projects/${project}`;
    24          alt = 'Project Status';
    25      } else {
    26          throw new Error('Either app of project property must be specified');
    27      }
    28  
    29      return (
    30          <DataLoader load={() => services.authService.settings()}>
    31              {settings =>
    32                  (settings.statusBadgeEnabled && (
    33                      <div className='white-box'>
    34                          <div className='white-box__details'>
    35                              <p>
    36                                  Status Badge <img src={badgeURL} />{' '}
    37                              </p>
    38                              <div className='white-box__details-row'>
    39                                  <DropDownMenu
    40                                      anchor={() => (
    41                                          <p>
    42                                              {badgeType} <i className='fa fa-caret-down' />
    43                                          </p>
    44                                      )}
    45                                      items={['URL', 'Markdown', 'Textile', 'Rdoc', 'AsciiDoc'].map(type => ({title: type, action: () => setBadgeType(type)}))}
    46                                  />
    47                                  <textarea
    48                                      onClick={e => (e.target as HTMLInputElement).select()}
    49                                      className='badge-panel'
    50                                      readOnly={true}
    51                                      value={
    52                                          badgeType === 'URL'
    53                                              ? badgeURL
    54                                              : badgeType === 'Markdown'
    55                                              ? `[![${alt}](${badgeURL})](${entityURL})`
    56                                              : badgeType === 'Textile'
    57                                              ? `!${badgeURL}!:${entityURL}`
    58                                              : badgeType === 'Rdoc'
    59                                              ? `{<img src="${badgeURL}" alt="${alt}" />}[${entityURL}]`
    60                                              : badgeType === 'AsciiDoc'
    61                                              ? `image:${badgeURL}["${alt}", link="${entityURL}"]`
    62                                              : ''
    63                                      }
    64                                  />
    65                              </div>
    66                          </div>
    67                      </div>
    68                  )) ||
    69                  null
    70              }
    71          </DataLoader>
    72      );
    73  };