Na}{

File Content: `FunctionEditorControls.tsx`

import React, { Suspense } from 'react';

import { Icon, Tooltip } from '@grafana/ui';

import { FuncInstance } from '../gfunc';

export interface FunctionEditorControlsProps {
  onMoveLeft: (func: FuncInstance) => void;
  onMoveRight: (func: FuncInstance) => void;
  onRemove: (func: FuncInstance) => void;
}

const FunctionDescription = React.lazy(async () => {
  return {
    default(props: { description?: string }) {
      return <div>{props.description}</div>;
    },
  };
});

const FunctionHelpButton = (props: { description?: string; name: string }) => {
  if (props.description) {
    let tooltip = (
      <Suspense fallback={<span>Loading description...</span>}>
        <FunctionDescription description={props.description} />
      </Suspense>
    );
    return (
      <Tooltip content={tooltip} placement={'bottom-end'}>
        <Icon className={props.description ? undefined : 'pointer'} name="question-circle" />
      </Tooltip>
    );
  }

  return (
    <Icon
      className="pointer"
      name="question-circle"
      onClick={() => {
        window.open(
          'http://graphite.readthedocs.org/en/latest/functions.html#graphite.render.functions.' + props.name,
          '_blank'
        );
      }}
    />
  );
};

export const FunctionEditorControls = (
  props: FunctionEditorControlsProps & {
    func: FuncInstance;
  }
) => {
  const { func, onMoveLeft, onMoveRight, onRemove } = props;
  return (
    <div
      style={{
        display: 'flex',
        width: '60px',
        justifyContent: 'space-between',
      }}
    >
      <Icon name="arrow-left" onClick={() => onMoveLeft(func)} />
      <FunctionHelpButton name={func.def.name} description={func.def.description} />
      <Icon name="times" onClick={() => onRemove(func)} />
      <Icon name="arrow-right" onClick={() => onMoveRight(func)} />
    </div>
  );
};

Name	Size	Permission
AddGraphiteFunction.tsx	1817 bytes	0644
AnnotationsEditor.tsx	1774 bytes	0644
FunctionEditor.test.tsx	1267 bytes	0644
FunctionEditor.tsx	2212 bytes	0644
FunctionEditorControls.tsx	1857 bytes	0644
FunctionParamEditor.tsx	2051 bytes	0644
FunctionsSection.tsx	694 bytes	0644
GraphiteFunctionEditor.tsx	3546 bytes	0644
GraphiteQueryEditor.tsx	1963 bytes	0644
GraphiteTextEditor.tsx	784 bytes	0644
GraphiteVariableEditor.tsx	1885 bytes	0644
MetricSegment.tsx	2443 bytes	0644
MetricTankMetaInspector.tsx	6465 bytes	0644
MetricsSection.tsx	516 bytes	0644
PlayButton.tsx	445 bytes	0644
SeriesSection.tsx	651 bytes	0644
TagEditor.tsx	3071 bytes	0644
TagsSection.tsx	2406 bytes	0644
helpers.test.ts	8973 bytes	0644
helpers.ts	2927 bytes	0644

File Content: FunctionEditorControls.tsx

File Content: `FunctionEditorControls.tsx`