Files
grafana/public/app/features/datasources/components/useDataSourceInfo.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 681ac51f11.

* 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 fb33ff9028.

* 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

29 lines
691 B
TypeScript

import React from 'react';
import { Badge } from '@grafana/ui';
import { PageInfoItem } from 'app/core/components/Page/types';
type DataSourceInfo = {
dataSourcePluginName: string;
alertingSupported: boolean;
};
export const useDataSourceInfo = (dataSourceInfo: DataSourceInfo): PageInfoItem[] => {
const info: PageInfoItem[] = [];
const alertingEnabled = dataSourceInfo.alertingSupported;
info.push({
label: 'Type',
value: dataSourceInfo.dataSourcePluginName,
});
info.push({
label: 'Alerting',
value: (
<Badge color={alertingEnabled ? 'green' : 'red'} text={alertingEnabled ? 'Supported' : 'Not supported'}></Badge>
),
});
return info;
};