1#@!#!123s

: / usr / share / grafana / public / app / plugins / datasource / elasticsearch / configuration /
Filename : LogsConfig.tsx
back
import React from 'react';

import { ConfigSubSection } from '@grafana/experimental';
import { Input, InlineField } from '@grafana/ui';
import { ConfigDescriptionLink } from 'app/core/components/ConfigDescriptionLink';

import { ElasticsearchOptions } from '../types';

type Props = {
  value: ElasticsearchOptions;
  onChange: (value: ElasticsearchOptions) => void;
};
export const LogsConfig = (props: Props) => {
  const { value, onChange } = props;
  const changeHandler =
    (key: keyof ElasticsearchOptions) => (event: React.SyntheticEvent<HTMLInputElement | HTMLSelectElement>) => {
      onChange({
        ...value,
        [key]: event.currentTarget.value,
      });
    };

  return (
    <ConfigSubSection
      title="Logs"
      description={
        <ConfigDescriptionLink
          description="Configure which fields the data source uses for log messages and log levels."
          suffix="elasticsearch/#logs"
          feature="Elasticsearch log fields"
        />
      }
    >
      <InlineField label="Message field name" labelWidth={22}>
        <Input
          id="es_logs-config_logMessageField"
          value={value.logMessageField}
          onChange={changeHandler('logMessageField')}
          placeholder="_source"
          width={24}
        />
      </InlineField>

      <InlineField label="Level field name" labelWidth={22}>
        <Input
          id="es_logs-config_logLevelField"
          value={value.logLevelField}
          onChange={changeHandler('logLevelField')}
          width={24}
        />
      </InlineField>
    </ConfigSubSection>
  );
};