ESlint: React fixes part 1 (#29062)

* Eslint: allign with latest grafana-eslint-config

* fix ts

* Fix react/jsx-key

* Fix react/no-children-prop

* Fix react/jsx-no-target-blank

public/app/core/components/AppNotifications/AppNotificationItem.tsx

@@ -26,9 +26,10 @@ export default class AppNotificationItem extends Component<Props> {
       <Alert
         severity={appNotification.severity}
         title={appNotification.title}
-        children={appNotification.component || appNotification.text}
         onRemove={() => onClearNotification(appNotification.id)}
-      />
+      >
+        {appNotification.component || appNotification.text}
+      </Alert>
     );
   }
 }

public/app/core/components/ErrorPage/ErrorPage.tsx

@@ -64,7 +64,7 @@ export class ErrorPage extends PureComponent<Props> {
                       </p>
                       <p>
                         If the error persists, seek help on the{' '}
-                        <a href="https://community.grafana.com" target="_blank" className="error-link">
+                        <a href="https://community.grafana.com" target="_blank" rel="noreferrer" className="error-link">
                           community site
                         </a>
                         .

public/app/core/components/PageHeader/PageHeader.tsx

@@ -51,7 +51,7 @@ const Navigation = ({ children }: { children: NavModelItem[] }) => {
 
   return (
     <nav>
-      <SelectNav customCss="page-header__select-nav" children={children} />
+      <SelectNav customCss="page-header__select-nav">{children}</SelectNav>
       <TabsBar className="page-header__tabs" hideBorder={true}>
         {children.map((child, index) => {
           return (
@@ -147,7 +147,7 @@ export default class PageHeader extends React.Component<Props, any> {
         <div className="page-container">
           <div className="page-header">
             {this.renderHeaderTitle(main)}
-            {children && children.length && <Navigation children={children} />}
+            {children && children.length && <Navigation>{children}</Navigation>}
           </div>
         </div>
       </div>