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

Chore: Remove Form usage from SharedPreferences.tsx (#81468)

Browse Source 
* Chore: Remove Form usage from SharedPreferences.tsx

* Update betterer

* Update betterer
This commit is contained in:
Alex Khomenko 2024-01-31 18:33:17 +01:00 committed by GitHub
parent c310a20966
commit 1749ec9d5e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 83 additions and 92 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.betterer.results
View File

@ -1050,9 +1050,6 @@ exports[`better eslint`] = {
[0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "0"], [0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "0"],
[0, 0, 0, "Styles should be written using objects.", "1"] [0, 0, 0, "Styles should be written using objects.", "1"]
], ],
"public/app/core/components/SharedPreferences/SharedPreferences.tsx:5381": [
[0, 0, 0, "Styles should be written using objects.", "0"]
],
"public/app/core/components/TagFilter/TagFilter.tsx:5381": [ "public/app/core/components/TagFilter/TagFilter.tsx:5381": [
[0, 0, 0, "Unexpected any. Specify a different type.", "0"], [0, 0, 0, "Unexpected any. Specify a different type.", "0"],
[0, 0, 0, "Unexpected any. Specify a different type.", "1"], [0, 0, 0, "Unexpected any. Specify a different type.", "1"],

172
public/app/core/components/SharedPreferences/SharedPreferences.tsx
View File

@ -9,7 +9,6 @@ import {
Button, Button,
Field, Field,
FieldSet, FieldSet,
Form,
Label, Label,
Select, Select,
stylesFactory, stylesFactory,
@ -87,7 +86,8 @@ export class SharedPreferences extends PureComponent<Props, State> {
}); });
} }
onSubmitForm = async () => { onSubmitForm = async (event: React.FormEvent<HTMLFormElement>) => {
event.preventDefault();
const confirmationResult = this.props.onConfirm ? await this.props.onConfirm() : true; const confirmationResult = this.props.onConfirm ? await this.props.onConfirm() : true;
if (confirmationResult) { if (confirmationResult) {
@ -137,94 +137,84 @@ export class SharedPreferences extends PureComponent<Props, State> {
const currentThemeOption = this.themeOptions.find((x) => x.value === theme) ?? this.themeOptions[0]; const currentThemeOption = this.themeOptions.find((x) => x.value === theme) ?? this.themeOptions[0];
return ( return (
<Form onSubmit={this.onSubmitForm}> <form onSubmit={this.onSubmitForm} className={styles.form}>
{() => { <FieldSet label={<Trans i18nKey="shared-preferences.title">Preferences</Trans>} disabled={disabled}>
return ( <Field label={t('shared-preferences.fields.theme-label', 'Interface theme')}>
<> <Select
<FieldSet label={<Trans i18nKey="shared-preferences.title">Preferences</Trans>} disabled={disabled}> options={this.themeOptions}
<Field label={t('shared-preferences.fields.theme-label', 'Interface theme')}> value={currentThemeOption}
<Select onChange={this.onThemeChanged}
options={this.themeOptions} inputId="shared-preferences-theme-select"
value={currentThemeOption} />
onChange={this.onThemeChanged} </Field>
inputId="shared-preferences-theme-select"
/>
</Field>
<Field <Field
label={ label={
<Label htmlFor="home-dashboard-select"> <Label htmlFor="home-dashboard-select">
<span className={styles.labelText}> <span className={styles.labelText}>
<Trans i18nKey="shared-preferences.fields.home-dashboard-label">Home Dashboard</Trans> <Trans i18nKey="shared-preferences.fields.home-dashboard-label">Home Dashboard</Trans>
</span> </span>
</Label> </Label>
} }
data-testid="User preferences home dashboard drop down" data-testid="User preferences home dashboard drop down"
> >
<DashboardPicker <DashboardPicker
value={homeDashboardUID} value={homeDashboardUID}
onChange={(v) => this.onHomeDashboardChanged(v?.uid ?? '')} onChange={(v) => this.onHomeDashboardChanged(v?.uid ?? '')}
defaultOptions={true} defaultOptions={true}
isClearable={true} isClearable={true}
placeholder={t('shared-preferences.fields.home-dashboard-placeholder', 'Default dashboard')} placeholder={t('shared-preferences.fields.home-dashboard-placeholder', 'Default dashboard')}
inputId="home-dashboard-select" inputId="home-dashboard-select"
/> />
</Field> </Field>
<Field <Field
label={t('shared-dashboard.fields.timezone-label', 'Timezone')} label={t('shared-dashboard.fields.timezone-label', 'Timezone')}
data-testid={selectors.components.TimeZonePicker.containerV2} data-testid={selectors.components.TimeZonePicker.containerV2}
> >
<TimeZonePicker <TimeZonePicker
includeInternal={true} includeInternal={true}
value={timezone} value={timezone}
onChange={this.onTimeZoneChanged} onChange={this.onTimeZoneChanged}
inputId="shared-preferences-timezone-picker" inputId="shared-preferences-timezone-picker"
/> />
</Field> </Field>
<Field <Field
label={t('shared-preferences.fields.week-start-label', 'Week start')} label={t('shared-preferences.fields.week-start-label', 'Week start')}
data-testid={selectors.components.WeekStartPicker.containerV2} data-testid={selectors.components.WeekStartPicker.containerV2}
> >
<WeekStartPicker <WeekStartPicker
value={weekStart || ''} value={weekStart || ''}
onChange={this.onWeekStartChanged} onChange={this.onWeekStartChanged}
inputId={'shared-preferences-week-start-picker'} inputId={'shared-preferences-week-start-picker'}
/> />
</Field> </Field>
<Field <Field
label={ label={
<Label htmlFor="locale-select"> <Label htmlFor="locale-select">
<span className={styles.labelText}> <span className={styles.labelText}>
<Trans i18nKey="shared-preferences.fields.locale-label">Language</Trans> <Trans i18nKey="shared-preferences.fields.locale-label">Language</Trans>
</span> </span>
<FeatureBadge featureState={FeatureState.beta} /> <FeatureBadge featureState={FeatureState.beta} />
</Label> </Label>
} }
data-testid="User preferences language drop down" data-testid="User preferences language drop down"
> >
<Select <Select
value={languages.find((lang) => lang.value === language)} value={languages.find((lang) => lang.value === language)}
onChange={(lang: SelectableValue<string>) => this.onLanguageChanged(lang.value ?? '')} onChange={(lang: SelectableValue<string>) => this.onLanguageChanged(lang.value ?? '')}
options={languages} options={languages}
placeholder={t('shared-preferences.fields.locale-placeholder', 'Choose language')} placeholder={t('shared-preferences.fields.locale-placeholder', 'Choose language')}
inputId="locale-select" inputId="locale-select"
/> />
</Field> </Field>
</FieldSet> </FieldSet>
<Button <Button type="submit" variant="primary" data-testid={selectors.components.UserProfile.preferencesSaveButton}>
type="submit" <Trans i18nKey="common.save">Save</Trans>
variant="primary" </Button>
data-testid={selectors.components.UserProfile.preferencesSaveButton} </form>
>
<Trans i18nKey="common.save">Save</Trans>
</Button>
</>
);
}}
</Form>
); );
} }
} }
@ -233,9 +223,13 @@ export default SharedPreferences;
const getStyles = stylesFactory(() => { const getStyles = stylesFactory(() => {
return { return {
labelText: css` labelText: css({
margin-right: 6px; marginRight: '6px',
`, }),
form: css({
width: '100%',
maxWidth: '600px',
}),
}; };
}); });