mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
E2C: Remove ModalController from MigrationTokenPage (#86709)
* Remove ModalController from MigrationTokenPage * Dont show modal or toast for error response * better
This commit is contained in:
parent
c849b6beaa
commit
467d4231f1
@ -6,6 +6,9 @@ import { generatedAPI } from './endpoints.gen';
|
||||
export const cloudMigrationAPI = generatedAPI.enhanceEndpoints({
|
||||
addTagTypes: ['cloud-migration-config', 'cloud-migration-run', 'cloud-migration-run-list'],
|
||||
endpoints: {
|
||||
// Cloud-side - create token
|
||||
createCloudMigrationToken: suppressErrorsOnQuery,
|
||||
|
||||
// List Cloud Configs
|
||||
getMigrationList: {
|
||||
providesTags: ['cloud-migration-config'] /* should this be a -list? */,
|
||||
@ -39,9 +42,7 @@ export const cloudMigrationAPI = generatedAPI.enhanceEndpoints({
|
||||
invalidatesTags: ['cloud-migration-run-list'],
|
||||
},
|
||||
|
||||
getDashboardByUid(endpoint) {
|
||||
suppressErrorsOnQuery(endpoint);
|
||||
},
|
||||
getDashboardByUid: suppressErrorsOnQuery,
|
||||
},
|
||||
});
|
||||
|
||||
|
@ -6,14 +6,15 @@ import { Trans, t } from 'app/core/internationalization';
|
||||
import { TokenErrorAlert } from '../TokenErrorAlert';
|
||||
|
||||
interface Props {
|
||||
isOpen: boolean;
|
||||
hideModal: () => void;
|
||||
migrationToken?: string;
|
||||
}
|
||||
|
||||
export const MigrationTokenModal = ({ hideModal, migrationToken }: Props) => {
|
||||
export const MigrationTokenModal = ({ isOpen, hideModal, migrationToken }: Props) => {
|
||||
return (
|
||||
<Modal
|
||||
isOpen
|
||||
isOpen={isOpen}
|
||||
title={t('migrate-to-cloud.migration-token.modal-title', 'Migration token created')}
|
||||
onDismiss={hideModal}
|
||||
>
|
||||
|
@ -1,6 +1,6 @@
|
||||
import React from 'react';
|
||||
import React, { useCallback, useState } from 'react';
|
||||
|
||||
import { Box, Button, ModalsController, Text } from '@grafana/ui';
|
||||
import { Box, Button, Text } from '@grafana/ui';
|
||||
import { t, Trans } from 'app/core/internationalization';
|
||||
|
||||
import { useCreateCloudMigrationTokenMutation } from '../../api';
|
||||
@ -11,52 +11,53 @@ import { MigrationTokenModal } from './MigrationTokenModal';
|
||||
import { TokenStatus } from './TokenStatus';
|
||||
|
||||
export const MigrationTokenPane = () => {
|
||||
const [showModal, setShowModal] = useState(false);
|
||||
const isFetchingStatus = false; // TODO: No API for this yet
|
||||
|
||||
const [createToken, createTokenResponse] = useCreateCloudMigrationTokenMutation();
|
||||
const [createTokenMutation, createTokenResponse] = useCreateCloudMigrationTokenMutation();
|
||||
const hasToken = Boolean(createTokenResponse.data?.token);
|
||||
|
||||
const isLoading = isFetchingStatus || createTokenResponse.isLoading; /* || deleteTokenResponse.isLoading */
|
||||
|
||||
const handleGenerateToken = useCallback(async () => {
|
||||
const resp = await createTokenMutation();
|
||||
if (!('error' in resp)) {
|
||||
setShowModal(true);
|
||||
}
|
||||
}, [createTokenMutation]);
|
||||
|
||||
return (
|
||||
<ModalsController>
|
||||
{({ showModal, hideModal }) => (
|
||||
<Box display="flex" alignItems="flex-start" padding={2} gap={2} direction="column" backgroundColor="secondary">
|
||||
<InfoItem title={t('migrate-to-cloud.migration-token.title', 'Migration token')}>
|
||||
<Trans i18nKey="migrate-to-cloud.migration-token.body">
|
||||
Your self-managed Grafana instance will require a special authentication token to securely connect to this
|
||||
cloud stack.
|
||||
<>
|
||||
<Box display="flex" alignItems="flex-start" padding={2} gap={2} direction="column" backgroundColor="secondary">
|
||||
<InfoItem title={t('migrate-to-cloud.migration-token.title', 'Migration token')}>
|
||||
<Trans i18nKey="migrate-to-cloud.migration-token.body">
|
||||
Your self-managed Grafana instance will require a special authentication token to securely connect to this
|
||||
cloud stack.
|
||||
</Trans>
|
||||
</InfoItem>
|
||||
|
||||
{createTokenResponse?.isError ? (
|
||||
<TokenErrorAlert />
|
||||
) : (
|
||||
<Text color="secondary">
|
||||
<Trans i18nKey="migrate-to-cloud.migration-token.status">
|
||||
Current status: <TokenStatus hasToken={hasToken} isFetching={isLoading} />
|
||||
</Trans>
|
||||
</InfoItem>
|
||||
</Text>
|
||||
)}
|
||||
|
||||
{createTokenResponse?.isError ? (
|
||||
<TokenErrorAlert />
|
||||
) : (
|
||||
<Text color="secondary">
|
||||
<Trans i18nKey="migrate-to-cloud.migration-token.status">
|
||||
Current status: <TokenStatus hasToken={hasToken} isFetching={isLoading} />
|
||||
</Trans>
|
||||
</Text>
|
||||
)}
|
||||
<Button disabled={isLoading || hasToken} onClick={handleGenerateToken}>
|
||||
{createTokenResponse.isLoading
|
||||
? t('migrate-to-cloud.migration-token.generate-button-loading', 'Generating a migration token...')
|
||||
: t('migrate-to-cloud.migration-token.generate-button', 'Generate a migration token')}
|
||||
</Button>
|
||||
</Box>
|
||||
|
||||
<Button
|
||||
disabled={isLoading || hasToken}
|
||||
onClick={async () => {
|
||||
const response = await createToken();
|
||||
if ('data' in response) {
|
||||
showModal(MigrationTokenModal, {
|
||||
hideModal,
|
||||
migrationToken: response.data.token,
|
||||
});
|
||||
}
|
||||
}}
|
||||
>
|
||||
{createTokenResponse.isLoading
|
||||
? t('migrate-to-cloud.migration-token.generate-button-loading', 'Generating a migration token...')
|
||||
: t('migrate-to-cloud.migration-token.generate-button', 'Generate a migration token')}
|
||||
</Button>
|
||||
</Box>
|
||||
)}
|
||||
</ModalsController>
|
||||
<MigrationTokenModal
|
||||
isOpen={showModal}
|
||||
hideModal={() => setShowModal(false)}
|
||||
migrationToken={createTokenResponse.data?.token}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
Loading…
Reference in New Issue
Block a user