Na}{

File Content: `LogsQueryEditor.tsx`

import { css } from '@emotion/css';
import React, { memo } from 'react';

import { AbsoluteTimeRange, QueryEditorProps } from '@grafana/data';
import { config } from '@grafana/runtime';
import { InlineFormLabel } from '@grafana/ui';

import { CloudWatchDatasource } from '../../../datasource';
import { CloudWatchJsonData, CloudWatchLogsQuery, CloudWatchQuery } from '../../../types';

import { CloudWatchLink } from './CloudWatchLink';
import CloudWatchLogsQueryFieldMonaco from './LogsQueryField';
import CloudWatchLogsQueryField from './LogsQueryFieldOld';

type Props = QueryEditorProps<CloudWatchDatasource, CloudWatchQuery, CloudWatchJsonData> & {
  query: CloudWatchLogsQuery;
};

const labelClass = css`
  margin-left: 3px;
  flex-grow: 0;
`;

export const CloudWatchLogsQueryEditor = memo(function CloudWatchLogsQueryEditor(props: Props) {
  const { query, data, datasource } = props;

  let absolute: AbsoluteTimeRange;
  if (data?.request?.range?.from) {
    const { range } = data.request;
    absolute = {
      from: range.from.valueOf(),
      to: range.to.valueOf(),
    };
  } else {
    absolute = {
      from: Date.now() - 10000,
      to: Date.now(),
    };
  }

  return config.featureToggles.cloudWatchLogsMonacoEditor ? (
    <CloudWatchLogsQueryFieldMonaco
      {...props}
      ExtraFieldElement={
        <InlineFormLabel className={`gf-form-label--btn ${labelClass}`} width="auto" tooltip="Link to Graph in AWS">
          <CloudWatchLink query={query} panelData={data} datasource={datasource} />
        </InlineFormLabel>
      }
    />
  ) : (
    <CloudWatchLogsQueryField
      {...props}
      history={[]}
      absoluteRange={absolute}
      ExtraFieldElement={
        <InlineFormLabel className={`gf-form-label--btn ${labelClass}`} width="auto" tooltip="Link to Graph in AWS">
          <CloudWatchLink query={query} panelData={data} datasource={datasource} />
        </InlineFormLabel>
      }
    />
  );
});

export default CloudWatchLogsQueryEditor;

Name	Size	Permission
CloudWatchLink.test.tsx	3428 bytes	0644
CloudWatchLink.tsx	1667 bytes	0644
LogsQueryEditor.tsx	1994 bytes	0644
LogsQueryField.tsx	4937 bytes	0644
LogsQueryFieldOld.tsx	3880 bytes	0644

File Content: LogsQueryEditor.tsx

File Content: `LogsQueryEditor.tsx`