Prometheus: Add off switch for metric/label name lookup (#24034)

* Prometheus: Add off switch for metric/label name lookup

This will help users with amounts of metric name
data that is too much for a browser to handle.

Autocomplete will be disabled and metrics chooser hidden,
since obviously both rely on this data.

Fixes #22702

* Use onUpdateDatasourceJsonDataOptionChecked

... from `@grafana/data`. Refactor naming to faciliate its
use and stick with prop names as passed down from
`ConfigEditor`.

PLUS:
- Rephrase switch label, add a tooltip and reduce the
size of the to what "Custom query parameters" originally
was.
- Change `languageProvider` type in `PromQueryField`.

* Put language provider back in

Functions and history still work, even when metrics
lookup gets disabled.
Also: Rewording of setting.

* Display a message when lookup got disabled manually

* Call property for setting disableMetricsLookup

* Show disabled metrics chooser instead of warning

public/app/plugins/datasource/prometheus/components/PromQueryField.test.tsx

@@ -4,6 +4,9 @@ import RCCascader from 'rc-cascader';
 import React from 'react';
 import PromQlLanguageProvider, { DEFAULT_LOOKUP_METRICS_THRESHOLD } from '../language_provider';
 import PromQueryField, { groupMetricsByPrefix, RECORDING_RULES_GROUP } from './PromQueryField';
+import { ButtonCascader } from '@grafana/ui';
+import { DataSourceInstanceSettings } from '@grafana/data';
+import { PromOptions } from '../types';
 
 describe('PromQueryField', () => {
   beforeAll(() => {
@@ -11,6 +14,47 @@ describe('PromQueryField', () => {
     window.getSelection = () => {};
   });
 
+  it('renders metrics chooser regularly if lookups are not disabled in the datasource settings', () => {
+    const datasource = ({
+      languageProvider: {
+        start: () => Promise.resolve([]),
+      },
+    } as unknown) as DataSourceInstanceSettings<PromOptions>;
+
+    const queryField = mount(
+      <PromQueryField
+        // @ts-ignore
+        datasource={datasource}
+        query={{ expr: '', refId: '' }}
+        onRunQuery={() => {}}
+        onChange={() => {}}
+        history={[]}
+      />
+    );
+
+    expect(queryField.find(ButtonCascader).length).toBe(1);
+  });
+
+  it('renders a disabled metrics chooser if lookups are disabled in datasource settings', () => {
+    const queryField = mount(
+      <PromQueryField
+        // @ts-ignore
+        datasource={{ lookupsDisabled: true }}
+        query={{ expr: '', refId: '' }}
+        onRunQuery={() => {}}
+        onChange={() => {}}
+        history={[]}
+      />
+    );
+
+    expect(
+      queryField
+        .find(ButtonCascader)
+        .find('button')
+        .props().disabled
+    ).toBe(true);
+  });
+
   it('refreshes metrics when the data source changes', async () => {
     const metrics = ['foo', 'bar'];
     const languageProvider = ({