add tooltip prop and fix folder name (#22901)

* add tooltip prop and fix folder name

* fix folder name refs

packages/grafana-ui/src/components/DataSourceSettings/BasicAuthSettings.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { HttpSettingsProps } from './types';
 import { FormField } from '../FormField/FormField';
-import { SecretFormField } from '../SecretFormFied/SecretFormField';
+import { SecretFormField } from '../SecretFormField/SecretFormField';
 
 export const BasicAuthSettings: React.FC<HttpSettingsProps> = ({ dataSourceConfig, onChange }) => {
   const password = dataSourceConfig.secureJsonData ? dataSourceConfig.secureJsonData.basicAuthPassword : '';

packages/grafana-ui/src/components/DataSourceSettings/CustomHeadersSettings.tsx

@@ -4,7 +4,7 @@ import uniqueId from 'lodash/uniqueId';
 import { DataSourceSettings } from '@grafana/data';
 import { Button } from '../Button';
 import { FormField } from '../FormField/FormField';
-import { SecretFormField } from '../SecretFormFied/SecretFormField';
+import { SecretFormField } from '../SecretFormField/SecretFormField';
 import { stylesFactory } from '../../themes';
 
 export interface CustomHeader {

packages/grafana-ui/src/components/SecretFormField/SecretFormField.tsx

@@ -10,6 +10,7 @@ interface Props extends Omit<InputHTMLAttributes<HTMLInputElement>, 'onReset'> {
   isConfigured: boolean;
 
   label?: string;
+  tooltip?: string;
   labelWidth?: number;
   inputWidth?: number;
   // Placeholder of the input field when in non configured state.
@@ -40,6 +41,7 @@ export const SecretFormField: FunctionComponent<Props> = ({
   inputWidth = 12,
   onReset,
   isConfigured,
+  tooltip,
   placeholder = 'Password',
   ...inputProps
 }: Props) => {
@@ -47,6 +49,7 @@ export const SecretFormField: FunctionComponent<Props> = ({
   return (
     <FormField
       label={label!}
+      tooltip={tooltip!}
       labelWidth={labelWidth}
       inputEl={
         isConfigured ? (

packages/grafana-ui/src/components/index.ts

@@ -20,7 +20,7 @@ export { Cascader, CascaderOption } from './Cascader/Cascader';
 // Forms
 export { FormLabel } from './FormLabel/FormLabel';
 export { FormField } from './FormField/FormField';
-export { SecretFormField } from './SecretFormFied/SecretFormField';
+export { SecretFormField } from './SecretFormField/SecretFormField';
 
 export { LoadingPlaceholder } from './LoadingPlaceholder/LoadingPlaceholder';
 export { ColorPicker, SeriesColorPicker } from './ColorPicker/ColorPicker';