Playlist: Remove deprecated components (#84536)

This commit is contained in:
Alex Khomenko 2024-03-16 08:47:39 +01:00 committed by GitHub
parent 89f3b70e17
commit 5fa627e207
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -2,7 +2,8 @@ import React, { useMemo, useState } from 'react';
import { selectors } from '@grafana/e2e-selectors';
import { config } from '@grafana/runtime';
import { Button, Field, FieldSet, Form, HorizontalGroup, Input, LinkButton } from '@grafana/ui';
import { Button, Field, FieldSet, Input, LinkButton, Stack } from '@grafana/ui';
import { Form } from 'app/core/components/Form/Form';
import { DashboardPicker } from 'app/core/components/Select/DashboardPicker';
import { TagFilter } from 'app/core/components/TagFilter/TagFilter';
import { Trans, t } from 'app/core/internationalization';
@ -33,72 +34,70 @@ export const PlaylistForm = ({ onSubmit, playlist }: Props) => {
};
return (
<div>
<Form onSubmit={doSubmit} validateOn={'onBlur'}>
{({ register, errors }) => {
const isDisabled = items.length === 0 || Object.keys(errors).length > 0;
return (
<>
<Field
label={t('playlist-edit.form.name-label', 'Name')}
invalid={!!errors.name}
error={errors?.name?.message}
>
<Input
type="text"
{...register('name', { required: t('playlist-edit.form.name-required', 'Name is required') })}
placeholder={t('playlist-edit.form.name-placeholder', 'Name')}
defaultValue={name}
aria-label={selectors.pages.PlaylistForm.name}
/>
</Field>
<Field
label={t('playlist-edit.form.interval-label', 'Interval')}
invalid={!!errors.interval}
error={errors?.interval?.message}
>
<Input
type="text"
{...register('interval', {
required: t('playlist-edit.form.interval-required', 'Interval is required'),
})}
placeholder={t('playlist-edit.form.interval-placeholder', '5m')}
defaultValue={interval ?? '5m'}
aria-label={selectors.pages.PlaylistForm.interval}
/>
<Form onSubmit={doSubmit} validateOn={'onBlur'}>
{({ register, errors }) => {
const isDisabled = items.length === 0 || Object.keys(errors).length > 0;
return (
<>
<Field
label={t('playlist-edit.form.name-label', 'Name')}
invalid={!!errors.name}
error={errors?.name?.message}
>
<Input
type="text"
{...register('name', { required: t('playlist-edit.form.name-required', 'Name is required') })}
placeholder={t('playlist-edit.form.name-placeholder', 'Name')}
defaultValue={name}
aria-label={selectors.pages.PlaylistForm.name}
/>
</Field>
<Field
label={t('playlist-edit.form.interval-label', 'Interval')}
invalid={!!errors.interval}
error={errors?.interval?.message}
>
<Input
type="text"
{...register('interval', {
required: t('playlist-edit.form.interval-required', 'Interval is required'),
})}
placeholder={t('playlist-edit.form.interval-placeholder', '5m')}
defaultValue={interval ?? '5m'}
aria-label={selectors.pages.PlaylistForm.interval}
/>
</Field>
<PlaylistTable items={items} deleteItem={deleteItem} moveItem={moveItem} />
<FieldSet label={t('playlist-edit.form.heading', 'Add dashboards')}>
<Field label={t('playlist-edit.form.add-title-label', 'Add by title')}>
<DashboardPicker id="dashboard-picker" onChange={addByUID} key={items.length} />
</Field>
<PlaylistTable items={items} deleteItem={deleteItem} moveItem={moveItem} />
<Field label={t('playlist-edit.form.add-tag-label', 'Add by tag')}>
<TagFilter
isClearable
tags={[]}
hideValues
tagOptions={tagOptions}
onChange={addByTag}
placeholder={t('playlist-edit.form.add-tag-placeholder', 'Select a tag')}
/>
</Field>
</FieldSet>
<FieldSet label={t('playlist-edit.form.heading', 'Add dashboards')}>
<Field label={t('playlist-edit.form.add-title-label', 'Add by title')}>
<DashboardPicker id="dashboard-picker" onChange={addByUID} key={items.length} />
</Field>
<Field label={t('playlist-edit.form.add-tag-label', 'Add by tag')}>
<TagFilter
isClearable
tags={[]}
hideValues
tagOptions={tagOptions}
onChange={addByTag}
placeholder={t('playlist-edit.form.add-tag-placeholder', 'Select a tag')}
/>
</Field>
</FieldSet>
<HorizontalGroup>
<Button type="submit" variant="primary" disabled={isDisabled} icon={saving ? 'spinner' : undefined}>
<Trans i18nKey="playlist-edit.form.save">Save</Trans>
</Button>
<LinkButton variant="secondary" href={`${config.appSubUrl}/playlists`}>
<Trans i18nKey="playlist-edit.form.cancel">Cancel</Trans>
</LinkButton>
</HorizontalGroup>
</>
);
}}
</Form>
</div>
<Stack>
<Button type="submit" variant="primary" disabled={isDisabled} icon={saving ? 'spinner' : undefined}>
<Trans i18nKey="playlist-edit.form.save">Save</Trans>
</Button>
<LinkButton variant="secondary" href={`${config.appSubUrl}/playlists`}>
<Trans i18nKey="playlist-edit.form.cancel">Cancel</Trans>
</LinkButton>
</Stack>
</>
);
}}
</Form>
);
};