Files
grafana/public/app/features/connections/pages/DataSourceDashboardsPage.tsx
Taewoo K 7f84e83ffe Datasource: datasource config page header redesign (#66999)
* Wip

* remove name input from page body

* render title & subTitle in datasource page in connections and remove unused prop - uid

* styling on actions button group

* remove unused props in edit datasource page

* set gap as 8px between buttons

* move editable datasourcename to the header

* add subTitle component

* remove useRef and use autoFocus prop

* pass false to isDefault  when dataSource is undefined

* change button text

* remove suffix icon

* remove unused import - Icon

* consolidate duplicate useDataSourceSettingsNav into datasrouces hook

* move dataSource context to useDataSourceSettingsNav

* remove Explore button in the footer

* remove unused props

* fix failing test on button group

* fix typo on file naming

* remove disabled prop

* fix param

* add test

* add test files

* disable editing title in readOnly provision datasource

* update name should save dataSource

* prevent swith toggle change from label clicking and change margin

* update tooltip message

* use datasource update on header instead of state update

* remvoe subTitle component and move subTitle component next to page Info component

* Added title

* remove subTitle in buildNavModel

* replace Button with Badge

* make datasourceheader as a component

* horizontal gap of 24px between pageInfo and actions components

* align page Info value items

* accept react node as page info label and add tooltip to Default item

* update navId for edit datasource page in connections

* update unit testing for Title

* fix gen_que

* betterer

* prettier fix

* fix e2e test

* add data-testid to nameEditIcon selector

* fix tooltip text

* fix navId for connections datasources edit page

* fix e2e selector: change autoSizeInput to Input

* adding ellipsis to EditDataSourceTitle

* override grafana-ui titleContainer h1 styles

* UI cleanup and apply readOnly to default datasource switch

* add period

* datasource name validation

* title and page info alignment

* add feature toggle - dataSourcePageHeader

* restore basicSettings component and apply feature toggle

* go lint

* Revert "title and page info alignment"

This reverts commit 681ac51f11cdd2d564408a087c3a07cd58a4f3e1.

* remove editable fields from page Header - name, default datasource switch

* fix go test: toggle generator

* remove test id

* remove alerting badge in BasicSettings component

* Revert "remove alerting badge in BasicSettings component"

This reverts commit fb33ff9028819406d9339bce53a29d1f6a05a88a.

* feature toggle on alerting badge

* rename component & filename

* move DataSourceInfo type

* change button to link in test

---------

Co-authored-by: Levente Balogh <balogh.levente.hu@gmail.com>
Co-authored-by: Torkel Ödegaard <torkel@grafana.com>
Co-authored-by: Miguel Palau Zarza <mpalauzarza@gmail.com>
2023-05-23 09:18:00 -04:00

22 lines
742 B
TypeScript

import * as React from 'react';
import { useParams } from 'react-router-dom';
import { Page } from 'app/core/components/Page/Page';
import { DataSourceDashboards } from 'app/features/datasources/components/DataSourceDashboards';
import { useDataSourceSettingsNav } from 'app/features/datasources/state';
export function DataSourceDashboardsPage() {
const { uid } = useParams<{ uid: string }>();
const params = new URLSearchParams(location.search);
const pageId = params.get('page');
const nav = useDataSourceSettingsNav(uid, pageId);
return (
<Page navId="connections-your-connections-datasources" pageNav={nav.main}>
<Page.Contents>
<DataSourceDashboards uid={uid} />
</Page.Contents>
</Page>
);
}