IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Grafana-UI: Fix use of Fragments as children of InlineField (#46326)

Browse Source
This commit is contained in:
Joao Silva 2022-03-15 17:50:29 +00:00 committed by GitHub
parent b8fba41d74
commit 00c93fff8c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 29 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
packages/grafana-ui/src/components/DataSourceSettings/CertificationKey.tsx
View File

@ -3,6 +3,7 @@ import { Input } from '../Input/Input';
import { Button } from '../Button';
import { TextArea } from '../TextArea/TextArea';
import { InlineField } from '../Forms/InlineField';
import { InlineFieldRow } from '../Forms/InlineFieldRow';
interface Props {
label: string;
@ -15,17 +16,19 @@ interface Props {
export const CertificationKey: FC<Props> = ({ hasCert, label, onChange, onClick, placeholder }) => {
return (
<InlineField label={label} labelWidth={14}>
{hasCert ? (
<>
<Input type="text" disabled value="configured" width={24} />
<Button variant="secondary" onClick={onClick} style={{ marginLeft: 4 }}>
Reset
</Button>
</>
) : (
<TextArea rows={7} onChange={onChange} placeholder={placeholder} required />
<InlineFieldRow>
<InlineField label={label} labelWidth={14} disabled={hasCert}>
{hasCert ? (
<Input type="text" value="configured" width={24} />
) : (
<TextArea rows={7} onChange={onChange} placeholder={placeholder} required />
)}
</InlineField>
{hasCert && (
<Button variant="secondary" onClick={onClick} style={{ marginLeft: 4 }}>
Reset
</Button>
)}
</InlineField>
</InlineFieldRow>
);
};

16
public/app/features/dashboard/components/SubMenu/AnnotationPicker.tsx
View File

@ -2,7 +2,7 @@ import { AnnotationQuery, EventBus, GrafanaTheme2 } from '@grafana/data';
import React, { useEffect, useState } from 'react';
import { getDashboardQueryRunner } from '../../../query/state/DashboardQueryRunner/DashboardQueryRunner';
import { AnnotationQueryFinished, AnnotationQueryStarted } from '../../../../types/events';
import { InlineField, InlineSwitch, useStyles2 } from '@grafana/ui';
import { InlineField, InlineFieldRow, InlineSwitch, useStyles2 } from '@grafana/ui';
import { LoadingIndicator } from '@grafana/ui/src/components/PanelChrome/LoadingIndicator';
import { css } from '@emotion/css';
@ -41,14 +41,14 @@ export const AnnotationPicker = ({ annotation, events, onEnabledChanged }: Annot
return (
<div key={annotation.name} className={styles.annotation}>
<InlineField label={annotation.name} disabled={loading}>
<>
<InlineFieldRow>
<InlineField label={annotation.name} disabled={loading}>
<InlineSwitch value={annotation.enable} onChange={() => onEnabledChanged(annotation)} disabled={loading} />
<div className={styles.indicator}>
<LoadingIndicator loading={loading} onCancel={onCancel} />
</div>
</>
</InlineField>
</InlineField>
<div className={styles.indicator}>
<LoadingIndicator loading={true} onCancel={onCancel} />
</div>
</InlineFieldRow>
</div>
);
};

9
public/app/plugins/panel/geomap/editor/StyleRuleEditor.tsx
View File

@ -156,7 +156,7 @@ export const StyleRuleEditor: FC<StandardEditorProps<FeatureStyleConfig, any, an
/>
</InlineField>
<InlineField className={styles.inline} grow={true}>
<>
<div className={styles.flexRow}>
{(check.operation === ComparisonOperation.EQ || check.operation === ComparisonOperation.NEQ) && (
<Select
menuShouldPortal
@ -177,7 +177,7 @@ export const StyleRuleEditor: FC<StandardEditorProps<FeatureStyleConfig, any, an
onChange={onChangeNumericValue}
/>
)}
</>
</div>
</InlineField>
<Button
size="md"
@ -222,4 +222,9 @@ const getStyles = (theme: GrafanaTheme2) => ({
button: css`
margin-left: 4px;
`,
flexRow: css`
display: flex;
flex-direction: row;
align-items: flex-start;
`,
});