Connections: Fix route-guards (#62771)

* fix: use case-sensitive routes for Connections

The reason to do this is to have the backend route-guards work properly.
(The backend route guards are case-sensitive, thus if the FE would serve
the case-insensitive version, then the backend route guards could be bypassed.)

* tests: update the tests

public/app/features/connections/Connections.test.tsx

@@ -103,9 +103,7 @@ describe('Connections', () => {
     renderPage(ROUTES.ConnectData, store);
 
     // We expect not to see the text that would be rendered by the core "Connect data" page
-    // (Instead we expect to see the default route "Datasources")
-    expect(await screen.findByText('Datasources')).toBeVisible();
-    expect(await screen.findByText('Manage your existing datasource connections')).toBeVisible();
+    expect(screen.queryByText('Data sources')).not.toBeInTheDocument();
     expect(screen.queryByText('No results matching your query were found.')).not.toBeInTheDocument();
   });
 });

public/app/features/connections/Connections.tsx

@@ -29,21 +29,25 @@ export default function Connections() {
       }}
     >
       <Switch>
-        <Route exact path={ROUTES.Base} component={() => <Redirect to={ROUTES.ConnectData} />} />
+        {/* Redirect to "Connect data" by default */}
+        <Route exact sensitive path={ROUTES.Base} component={() => <Redirect to={ROUTES.ConnectData} />} />
         <Route
           exact
+          sensitive
           path={ROUTES.YourConnections}
           component={() => <NavLandingPage navId="connections-your-connections" />}
         />
-        <Route exact path={ROUTES.DataSources} component={DataSourcesListPage} />
-        <Route exact path={ROUTES.DataSourcesDetails} component={DataSourceDetailsPage} />
-        <Route exact path={ROUTES.DataSourcesNew} component={NewDataSourcePage} />
-        <Route exact path={ROUTES.DataSourcesEdit} component={EditDataSourcePage} />
-        <Route exact path={ROUTES.DataSourcesDashboards} component={DataSourceDashboardsPage} />
-        {!isConnectDataPageOverriden && <Route path={ROUTES.ConnectData} component={ConnectDataPage} />}
+        <Route exact sensitive path={ROUTES.DataSources} component={DataSourcesListPage} />
+        <Route exact sensitive path={ROUTES.DataSourcesDetails} component={DataSourceDetailsPage} />
+        <Route exact sensitive path={ROUTES.DataSourcesNew} component={NewDataSourcePage} />
+        <Route exact sensitive path={ROUTES.DataSourcesEdit} component={EditDataSourcePage} />
+        <Route exact sensitive path={ROUTES.DataSourcesDashboards} component={DataSourceDashboardsPage} />
 
-        {/* Default page */}
-        <Route component={DataSourcesListPage} />
+        {/* "Connect data" page - we don't register a route in case a plugin already registers a standalone page for it */}
+        {!isConnectDataPageOverriden && <Route exact sensitive path={ROUTES.ConnectData} component={ConnectDataPage} />}
+
+        {/* Not found */}
+        <Route component={() => <Redirect to="/notfound" />} />
       </Switch>
     </DataSourcesRoutesContext.Provider>
   );