DataSources: fix DataSourceAddButton component (#60176)

* fix DataSourceAddButton component

This component implicitly returned `false` when `canCreateDataSource`
was false, and that way it didn't qualify as a function component.
We fixed it to explicitly return null in this case.

* DataSourceAddButton: update function signature

This is more consistent with other code in this codebase.

public/app/features/connections/pages/DataSourcesListPage.tsx

@@ -6,7 +6,7 @@ import { DataSourceAddButton } from 'app/features/datasources/components/DataSou
 import { DataSourcesList } from 'app/features/datasources/components/DataSourcesList';
 
 export function DataSourcesListPage() {
-  const actions = config.featureToggles.topnav ? DataSourceAddButton() : undefined;
+  const actions = config.featureToggles.topnav ? <DataSourceAddButton /> : undefined;
   return (
     <Page navId={'connections-your-connections-datasources'} actions={actions}>
       <Page.Contents>

public/app/features/datasources/components/DataSourceAddButton.tsx

@@ -6,15 +6,13 @@ import { AccessControlAction } from 'app/types';
 
 import { useDataSourcesRoutes } from '../state';
 
-export function DataSourceAddButton() {
+export function DataSourceAddButton(): JSX.Element | null {
   const canCreateDataSource = contextSrv.hasPermission(AccessControlAction.DataSourcesCreate);
   const dataSourcesRoutes = useDataSourcesRoutes();
 
-  return (
-    canCreateDataSource && (
-      <LinkButton icon="plus" href={dataSourcesRoutes.New}>
-        Add new data source
-      </LinkButton>
-    )
-  );
+  return canCreateDataSource ? (
+    <LinkButton icon="plus" href={dataSourcesRoutes.New}>
+      Add new data source
+    </LinkButton>
+  ) : null;
 }

public/app/features/datasources/pages/DataSourcesListPage.tsx

@@ -7,7 +7,7 @@ import { DataSourceAddButton } from '../components/DataSourceAddButton';
 import { DataSourcesList } from '../components/DataSourcesList';
 
 export function DataSourcesListPage() {
-  const actions = config.featureToggles.topnav ? DataSourceAddButton() : undefined;
+  const actions = config.featureToggles.topnav ? <DataSourceAddButton /> : undefined;
   return (
     <Page navId="datasources" actions={actions}>
       <Page.Contents>