Chore: Enable eslint-plugin-react partial rules (#29428)

* Chore: Enable eslint react/display-name

Enable react/display-name and fixed the corresponding linting issue

part of: #29201

* Chore: Enable eslint react/no-deprecated

Enable react/no-deprecated and add the UNSAFE_ prefix for deprected methods

part of: #29201

* Chore: Enable eslint react/no-find-dom-node

Enable react/no-find-dom-node rule and use ref instead

part of: #29201

* Test: Update TeamGroupSync test snapshot

Since we added the displayName for ToolTip compontent and tag name is changed.

* Fix: Fixed ClickOutsideWrapper render

The props.children might contains numbers of nodes which make cloneElement failed. Change to simply use a div to wrapper
the children and assign the ref to div for this feature

* Style: Use shorthand method definition style for inline component

* Fix: Rebase master and fix linting

Rebase from master branch and fix new displayName linting warning

public/app/core/components/Footer/Footer.tsx

@@ -84,3 +84,5 @@ export const Footer: FC = React.memo(() => {
     </footer>
   );
 });
+
+Footer.displayName = 'Footer';

public/app/core/components/PermissionList/PermissionsInfo.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-export default () => (
+const PermissionsInfo = () => (
   <div>
     <h5>What are Permissions?</h5>
     <p>
@@ -9,3 +9,5 @@ export default () => (
     </p>
   </div>
 );
+
+export default PermissionsInfo;

public/app/core/components/TagFilter/TagFilter.tsx

@@ -79,7 +79,7 @@ export const TagFilter: FC<Props> = ({
       MultiValueLabel: (): any => {
         return null; // We want the whole tag to be clickable so we use MultiValueRemove instead
       },
-      MultiValueRemove: (props: any) => {
+      MultiValueRemove(props: any) {
         const { data } = props;
 
         return (

public/app/core/components/TransformersUI/FilterByValueTransformer/ValueMatchers/BasicMatcherEditor.tsx

@@ -7,7 +7,7 @@ import { convertToType } from './utils';
 export function basicMatcherEditor<T = any>(
   config: ValueMatcherEditorConfig
 ): React.FC<ValueMatcherUIProps<BasicValueMatcherOptions<T>>> {
-  return ({ options, onChange, field }) => {
+  return function render({ options, onChange, field }) {
     const { validator, converter = convertToType } = config;
     const { value } = options;
     const [isInvalid, setInvalid] = useState(!validator(value));