文件操作 - LiveTailButton.tsx

文件: /usr/share/grafana/public/app/features/explore/LiveTailButton.tsx

编辑文件内容

import React from 'react';
import classNames from 'classnames';
import tinycolor from 'tinycolor2';
import { css } from 'emotion';
import { CSSTransition } from 'react-transition-group';
import { useTheme, Tooltip, stylesFactory, selectThemeVariant, Icon } from '@grafana/ui';
import { GrafanaTheme } from '@grafana/data';

//Components
import { ResponsiveButton } from './ResponsiveButton';

const defaultLiveTooltip = () => {
  return <>Live</>;
};

type LiveTailButtonProps = {
  splitted: boolean;
  start: () => void;
  stop: () => void;
  pause: () => void;
  resume: () => void;
  isLive: boolean;
  isPaused: boolean;
};
export function LiveTailButton(props: LiveTailButtonProps) {
  const { start, pause, resume, isLive, isPaused, stop, splitted } = props;
  const theme = useTheme();
  const styles = getStyles(theme);

const onClickMain = isLive ? (isPaused ? resume : pause) : start;

return (
    <>
      <Tooltip content={defaultLiveTooltip} placement="bottom">
        <ResponsiveButton
          splitted={splitted}
          buttonClassName={classNames('btn navbar-button', styles.liveButton, {
            [`btn--radius-right-0 explore-active-button ${styles.noRightBorderStyle}`]: isLive,
            [styles.isLive]: isLive && !isPaused,
            [styles.isPaused]: isLive && isPaused,
          })}
          icon={!isLive ? 'play' : 'pause'}
          iconClassName={isLive && 'icon-brand-gradient'}
          onClick={onClickMain}
          title={'\xa0Live'}
        />
      </Tooltip>
      <CSSTransition
        mountOnEnter={true}
        unmountOnExit={true}
        timeout={100}
        in={isLive}
        classNames={{
          enter: styles.stopButtonEnter,
          enterActive: styles.stopButtonEnterActive,
          exit: styles.stopButtonExit,
          exitActive: styles.stopButtonExitActive,
        }}
      >
        <div>
          <button
            className={`btn navbar-button navbar-button--attached explore-active-button ${styles.isLive}`}
            onClick={stop}
          >
            <Icon className="icon-brand-gradient" name="square-shape" size="lg" type="mono" />
          </button>
        </div>
      </CSSTransition>
    </>
  );
}

文件操作 - LiveTailButton.tsx

文件: /usr/share/grafana/public/app/features/explore/LiveTailButton.tsx

编辑文件内容

修改文件时间

删除文件