E2C: Show rebuild snapshot button (#90941)

* E2C: Show rebuild snapshot button

* i18n

* Update public/app/features/migrate-to-cloud/onprem/Page.tsx

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>

---------

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>

.betterer.results

@@ -4751,9 +4751,6 @@ exports[`better eslint`] = {
       [0, 0, 0, "No untranslated strings. Wrap text with <Trans />", "0"],
       [0, 0, 0, "No untranslated strings. Wrap text with <Trans />", "1"]
     ],
-    "public/app/features/migrate-to-cloud/onprem/Page.tsx:5381": [
-      [0, 0, 0, "No untranslated strings. Wrap text with <Trans />", "0"]
-    ],
     "public/app/features/notifications/StoredNotifications.tsx:5381": [
       [0, 0, 0, "No untranslated strings. Wrap text with <Trans />", "0"]
     ],

public/app/features/migrate-to-cloud/api/index.ts

@@ -49,8 +49,9 @@ export const cloudMigrationAPI = generatedAPI.enhanceEndpoints({
     getShapshotList: {
       providesTags: ['cloud-migration-snapshot'],
     },
-    createSnapshot: {
+    createSnapshot(endpoint) {
-      invalidatesTags: ['cloud-migration-snapshot'],
+      suppressErrorsOnQuery(endpoint);
+      endpoint.invalidatesTags = ['cloud-migration-snapshot'];
     },
     uploadSnapshot: {
       invalidatesTags: ['cloud-migration-snapshot'],

public/app/features/migrate-to-cloud/onprem/MigrationSummary.tsx

@@ -20,6 +20,8 @@ interface MigrationSummaryProps {
   showUploadSnapshot: boolean;
   uploadSnapshotIsLoading: boolean;
   onUploadSnapshot: () => void;
+
+  showRebuildSnapshot: boolean;
 }
 
 export function MigrationSummary(props: MigrationSummaryProps) {
@@ -29,6 +31,7 @@ export function MigrationSummary(props: MigrationSummaryProps) {
     isBusy,
     disconnectIsLoading,
     onDisconnect,
+
     showBuildSnapshot,
     buildSnapshotIsLoading,
     onBuildSnapshot,
@@ -36,6 +39,8 @@ export function MigrationSummary(props: MigrationSummaryProps) {
     showUploadSnapshot,
     uploadSnapshotIsLoading,
     onUploadSnapshot,
+
+    showRebuildSnapshot,
   } = props;
 
   const totalCount = 0;
@@ -96,6 +101,17 @@ export function MigrationSummary(props: MigrationSummaryProps) {
         </Button>
       )}
 
+      {showRebuildSnapshot && (
+        <Button
+          disabled={isBusy}
+          onClick={onBuildSnapshot}
+          icon={buildSnapshotIsLoading ? 'spinner' : undefined}
+          variant="secondary"
+        >
+          <Trans i18nKey="migrate-to-cloud.summary.rebuild-snapshot">Rebuild snapshot</Trans>
+        </Button>
+      )}
+
       {showUploadSnapshot && (
         <Button
           disabled={isBusy || uploadSnapshotIsLoading}

public/app/features/migrate-to-cloud/onprem/Page.tsx

@@ -1,7 +1,8 @@
 import { skipToken } from '@reduxjs/toolkit/query/react';
 import { useCallback, useEffect, useState } from 'react';
 
-import { Alert, Box, Stack } from '@grafana/ui';
+import { isFetchError } from '@grafana/runtime';
+import { Alert, Box, Stack, Text } from '@grafana/ui';
 import { Trans, t } from 'app/core/internationalization';
 
 import {
@@ -56,6 +57,8 @@ const SHOULD_POLL_STATUSES: Array<SnapshotDto['status']> = [
   'PROCESSING',
 ];
 
+const SNAPSHOT_REBUILD_STATUSES: Array<SnapshotDto['status']> = ['FINISHED', 'ERROR', 'UNKNOWN'];
+
 const SNAPSHOT_BUILDING_STATUSES: Array<SnapshotDto['status']> = ['INITIALIZING', 'CREATING'];
 
 const SNAPSHOT_UPLOADING_STATUSES: Array<SnapshotDto['status']> = ['UPLOADING', 'PENDING_PROCESSING', 'PROCESSING'];
@@ -66,7 +69,7 @@ function useGetLatestSnapshot(sessionUid?: string) {
   const [shouldPoll, setShouldPoll] = useState(false);
 
   const listResult = useGetShapshotListQuery(sessionUid ? { uid: sessionUid } : skipToken);
-  const lastItem = listResult.data?.snapshots?.at(-1); // TODO: account for pagination and ensure we're truely getting the last one
+  const lastItem = listResult.data?.snapshots?.at(0);
 
   const getSnapshotQueryArgs = sessionUid && lastItem?.uid ? { uid: sessionUid, snapshotUid: lastItem.uid } : skipToken;
 
@@ -120,6 +123,7 @@ export const Page = () => {
   const showBuildSnapshot = !snapshot.isLoading && !snapshot.data;
   const showBuildingSnapshot = SNAPSHOT_BUILDING_STATUSES.includes(status);
   const showUploadSnapshot = status === 'PENDING_UPLOAD' || SNAPSHOT_UPLOADING_STATUSES.includes(status);
+  const showRebuildSnapshot = SNAPSHOT_REBUILD_STATUSES.includes(status);
 
   const handleDisconnect = useCallback(async () => {
     if (sessionUid) {
@@ -147,7 +151,11 @@ export const Page = () => {
 
   if (isInitialLoading) {
     // TODO: better loading state
-    return <div>Loading...</div>;
+    return (
+      <div>
+        <Trans i18nKey="migrate-to-cloud.summary.page-loading">Loading...</Trans>
+      </div>
+    );
   } else if (!session.data) {
     return <EmptyState />;
   }
@@ -156,17 +164,23 @@ export const Page = () => {
     <>
       <Stack direction="column" gap={4}>
         {/* TODO: show errors from all mutation's in a... modal? */}
+
         {createSnapshotResult.isError && (
           <Alert
             severity="error"
-            title={t(
+            title={t('migrate-to-cloud.summary.run-migration-error-title', 'Error creating snapshot')}
-              'migrate-to-cloud.summary.run-migration-error-title',
-              'There was an error migrating your resources'
-            )}
           >
-            <Trans i18nKey="migrate-to-cloud.summary.run-migration-error-description">
+            <Text element="p">
-              See the Grafana server logs for more details
+              <Trans i18nKey="migrate-to-cloud.summary.run-migration-error-description">
-            </Trans>
+                See the Grafana server logs for more details
+              </Trans>
+            </Text>
+
+            {maybeGetTraceID(createSnapshotResult.error) && (
+              // Deliberately don't want to translate 'Trace ID'
+              // eslint-disable-next-line @grafana/no-untranslated-strings
+              <Text element="p">Trace ID: {maybeGetTraceID(createSnapshotResult.error)}</Text>
+            )}
           </Alert>
         )}
 
@@ -194,6 +208,7 @@ export const Page = () => {
             showUploadSnapshot={showUploadSnapshot}
             uploadSnapshotIsLoading={uploadSnapshotResult.isLoading || SNAPSHOT_UPLOADING_STATUSES.includes(status)}
             onUploadSnapshot={handleUploadSnapshot}
+            showRebuildSnapshot={showRebuildSnapshot}
           />
         )}
 
@@ -232,3 +247,13 @@ export const Page = () => {
     </>
   );
 };
+
+function maybeGetTraceID(err: unknown) {
+  const data = isFetchError<unknown>(err) ? err.data : undefined;
+
+  if (typeof data === 'object' && data && 'traceID' in data && typeof data.traceID === 'string') {
+    return data.traceID;
+  }
+
+  return undefined;
+}

public/locales/en-US/grafana.json

@@ -1099,8 +1099,10 @@
       "disconnect-error-description": "See the Grafana server logs for more details",
       "disconnect-error-title": "There was an error disconnecting",
       "errored-resource-count": "Errors",
+      "page-loading": "Loading...",
+      "rebuild-snapshot": "Rebuild snapshot",
       "run-migration-error-description": "See the Grafana server logs for more details",
-      "run-migration-error-title": "There was an error migrating your resources",
+      "run-migration-error-title": "Error creating snapshot",
       "snapshot-date": "Snapshot timestamp",
       "snapshot-not-created": "Not yet created",
       "start-migration": "Build snapshot",

public/locales/pseudo-LOCALE/grafana.json

@@ -1099,8 +1099,10 @@
       "disconnect-error-description": "Ŝęę ŧĥę Ğřäƒäʼnä şęřvęř ľőģş ƒőř mőřę đęŧäįľş",
       "disconnect-error-title": "Ŧĥęřę ŵäş äʼn ęřřőř đįşčőʼnʼnęčŧįʼnģ",
       "errored-resource-count": "Ēřřőřş",
+      "page-loading": "Ŀőäđįʼnģ...",
+      "rebuild-snapshot": "Ŗęþūįľđ şʼnäpşĥőŧ",
       "run-migration-error-description": "Ŝęę ŧĥę Ğřäƒäʼnä şęřvęř ľőģş ƒőř mőřę đęŧäįľş",
-      "run-migration-error-title": "Ŧĥęřę ŵäş äʼn ęřřőř mįģřäŧįʼnģ yőūř řęşőūřčęş",
+      "run-migration-error-title": "Ēřřőř čřęäŧįʼnģ şʼnäpşĥőŧ",
       "snapshot-date": "Ŝʼnäpşĥőŧ ŧįmęşŧämp",
       "snapshot-not-created": "Ńőŧ yęŧ čřęäŧęđ",
       "start-migration": "ßūįľđ şʼnäpşĥőŧ",