Share modal: Remove deprecated Form components (#84173)

* EmailSharingConfiguration: Remove deprecated component

* CreatePublicDashboard: Remove deprecated component

* Update imports

* Update imports[2]

* Fix import
This commit is contained in:
Alex Khomenko 2024-03-14 15:26:15 +01:00 committed by GitHub
parent 9de3d75bea
commit f26344e176
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 27 additions and 42 deletions

View File

@ -1,21 +1,11 @@
import { css } from '@emotion/css'; import { css } from '@emotion/css';
import React from 'react'; import React from 'react';
import { useForm } from 'react-hook-form'; import { useForm, Controller } from 'react-hook-form';
import { useWindowSize } from 'react-use'; import { useWindowSize } from 'react-use';
import { GrafanaTheme2, SelectableValue } from '@grafana/data/src'; import { GrafanaTheme2, SelectableValue } from '@grafana/data';
import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src'; import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
import { FieldSet } from '@grafana/ui'; import { FieldSet, Button, ButtonGroup, Field, Input, RadioButtonGroup, Spinner, useStyles2 } from '@grafana/ui';
import {
Button,
ButtonGroup,
Field,
Input,
InputControl,
RadioButtonGroup,
Spinner,
useStyles2,
} from '@grafana/ui/src';
import { Trans, t } from 'app/core/internationalization'; import { Trans, t } from 'app/core/internationalization';
import { contextSrv } from 'app/core/services/context_srv'; import { contextSrv } from 'app/core/services/context_srv';
import { import {
@ -156,7 +146,7 @@ export const EmailSharingConfiguration = () => {
label={t('public-dashboard.config.can-view-dashboard-radio-button-label', 'Can view dashboard')} label={t('public-dashboard.config.can-view-dashboard-radio-button-label', 'Can view dashboard')}
className={styles.field} className={styles.field}
> >
<InputControl <Controller
name="shareType" name="shareType"
control={control} control={control}
render={({ field }) => { render={({ field }) => {

View File

@ -1,18 +1,18 @@
import { css } from '@emotion/css'; import { css } from '@emotion/css';
import React from 'react'; import React from 'react';
import { FormState, UseFormRegister } from 'react-hook-form'; import { useForm } from 'react-hook-form';
import { GrafanaTheme2 } from '@grafana/data/src'; import { GrafanaTheme2 } from '@grafana/data';
import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src'; import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
import { Button, Form, Spinner, useStyles2 } from '@grafana/ui/src'; import { Button, Spinner, useStyles2 } from '@grafana/ui';
import { Trans } from 'app/core/internationalization'; import { Trans } from 'app/core/internationalization';
import { contextSrv } from 'app/core/services/context_srv';
import { useCreatePublicDashboardMutation } from 'app/features/dashboard/api/publicDashboardApi'; import { useCreatePublicDashboardMutation } from 'app/features/dashboard/api/publicDashboardApi';
import { DashboardModel } from 'app/features/dashboard/state'; import { DashboardModel } from 'app/features/dashboard/state';
import { DashboardScene } from 'app/features/dashboard-scene/scene/DashboardScene'; import { DashboardScene } from 'app/features/dashboard-scene/scene/DashboardScene';
import { DashboardInteractions } from 'app/features/dashboard-scene/utils/interactions'; import { DashboardInteractions } from 'app/features/dashboard-scene/utils/interactions';
import { AccessControlAction, useSelector } from 'app/types';
import { contextSrv } from '../../../../../../core/services/context_srv';
import { AccessControlAction, useSelector } from '../../../../../../types';
import { NoUpsertPermissionsAlert } from '../ModalAlerts/NoUpsertPermissionsAlert'; import { NoUpsertPermissionsAlert } from '../ModalAlerts/NoUpsertPermissionsAlert';
import { UnsupportedDataSourcesAlert } from '../ModalAlerts/UnsupportedDataSourcesAlert'; import { UnsupportedDataSourcesAlert } from '../ModalAlerts/UnsupportedDataSourcesAlert';
import { UnsupportedTemplateVariablesAlert } from '../ModalAlerts/UnsupportedTemplateVariablesAlert'; import { UnsupportedTemplateVariablesAlert } from '../ModalAlerts/UnsupportedTemplateVariablesAlert';
@ -49,6 +49,11 @@ export const CreatePublicDashboardBase = ({
createPublicDashboard({ dashboard, payload: { isEnabled: true } }); createPublicDashboard({ dashboard, payload: { isEnabled: true } });
DashboardInteractions.generatePublicDashboardUrlClicked({}); DashboardInteractions.generatePublicDashboardUrlClicked({});
}; };
const {
handleSubmit,
register,
formState: { isValid },
} = useForm<SharePublicDashboardAcknowledgmentInputs>({ mode: 'onChange' });
const disableInputs = !hasWritePermissions || isLoading || isError || hasError; const disableInputs = !hasWritePermissions || isLoading || isError || hasError;
@ -73,15 +78,7 @@ export const CreatePublicDashboardBase = ({
<UnsupportedDataSourcesAlert unsupportedDataSources={unsupportedDatasources.join(', ')} /> <UnsupportedDataSourcesAlert unsupportedDataSources={unsupportedDatasources.join(', ')} />
)} )}
<Form onSubmit={onCreate} validateOn="onChange" maxWidth="none"> <form onSubmit={handleSubmit(onCreate)}>
{({
register,
formState: { isValid },
}: {
register: UseFormRegister<SharePublicDashboardAcknowledgmentInputs>;
formState: FormState<SharePublicDashboardAcknowledgmentInputs>;
}) => (
<>
<div className={styles.checkboxes}> <div className={styles.checkboxes}>
<AcknowledgeCheckboxes disabled={disableInputs} register={register} /> <AcknowledgeCheckboxes disabled={disableInputs} register={register} />
</div> </div>
@ -91,9 +88,7 @@ export const CreatePublicDashboardBase = ({
{isLoading && <Spinner className={styles.loadingSpinner} />} {isLoading && <Spinner className={styles.loadingSpinner} />}
</Button> </Button>
</div> </div>
</> </form>
)}
</Form>
</div> </div>
); );
}; };