Connections: Update "Your connections/Data sources" page (#58589)

* navtree.go: update Data sources title and subtitle

* DataSourceList: move add button to header

* DataSourcesList: add buttons to items

The action buttons are added inside `<Card.Tags>` so that they end up at
the right end of the card, as it was designed.

The "Build a Dashboard" button's functionality is not defined yet.

* DataSourcesListHeader: add sort picker

* fix css

* tests: look for the updated "Add new data source" text

* tests: use an async test method to verify component updates are wrapped in an act()

* update e2e selector for add data source button

* fix DataSourceList{,Page} tests

* add comment for en dash character

* simplify sorting

* add link to Build a Dashboard button

* fix test

* test build a dashboard and explore buttons

* test sorting data source elements

* DataSourceAddButton: hide button when user has no permission

* PageActionBar: remove unneeded '?'

* DataSourcesList: hide explore button if user has no permission

* DataSourcesListPage.test: make setup prop explicit

* DataSourcesList: use theme.spacing

* datasources: assure explore url includes appSubUrl

* fix tests and add test case for missing permissions

Co-authored-by: Levente Balogh <balogh.levente.hu@gmail.com>

packages/grafana-ui/src/themes/GlobalStyles/page.ts

@@ -90,7 +90,8 @@ export function getPageStyles(theme: GrafanaTheme2) {
       align-items: flex-start;
 
       > a,
-      > button {
+      > button,
+      > div:nth-child(2) {
         margin-left: ${theme.spacing(2)};
       }
     }