From 4f362b527169176136606f78c21e60eaa2984fbc Mon Sep 17 00:00:00 2001
From: Ravi Jadhav <jadravi@amazon.com>
Date: Wed, 10 May 2023 12:02:52 -0700
Subject: [PATCH] fix: automatically naviagte to asset page once asset upload
 completes

---
 web/src/pages/AssetUpload.tsx         | 8 +++++++-
 web/src/pages/AssetUpload/onSubmit.ts | 4 +++-
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/web/src/pages/AssetUpload.tsx b/web/src/pages/AssetUpload.tsx
index cf23588f..f924668a 100644
--- a/web/src/pages/AssetUpload.tsx
+++ b/web/src/pages/AssetUpload.tsx
@@ -12,7 +12,7 @@ import {
     Textarea,
     TextContent,
 } from "@cloudscape-design/components";
-import { useParams } from "react-router";
+import { useNavigate, useParams } from "react-router";
 import Container from "@cloudscape-design/components/container";
 import Header from "@cloudscape-design/components/header";
 import SpaceBetween from "@cloudscape-design/components/space-between";
@@ -93,6 +93,7 @@ const isDistributableOptions: OptionDefinition[] = [
 ];
 
 const UploadForm = () => {
+    const navigate = useNavigate();
     const urlParams = useParams();
     const [databaseId, setDatabaseId] = useState({
         label: urlParams.databaseId,
@@ -123,6 +124,7 @@ const UploadForm = () => {
     });
 
     const [execStatus, setExecStatus] = useState<Record<string, StatusIndicatorProps.Type>>({});
+    const [canNavigateToAssetPage, setCanNavigateToAssetPage] = useState(false);
 
     useEffect(() => {
         if (!assetDetail?.databaseId) {
@@ -137,6 +139,9 @@ const UploadForm = () => {
 
     return (
         <Box padding={{ left: "l", right: "l" }}>
+            {canNavigateToAssetPage && (
+                navigate(`/databases/${assetDetail.databaseId}/assets/${assetDetail.assetId}`)
+            )}
             {showUploadAndExecProgress && (
                 <ProgressScreen
                     execStatus={execStatus}
@@ -174,6 +179,7 @@ const UploadForm = () => {
                         setShowUploadAndExecProgress,
                         setAssetUploadProgress,
                         setPreviewUploadProgress,
+                        setCanNavigateToAssetPage,
                     })}
                     allowSkipTo
                     steps={[
diff --git a/web/src/pages/AssetUpload/onSubmit.ts b/web/src/pages/AssetUpload/onSubmit.ts
index c1967aa8..7ac08b61 100644
--- a/web/src/pages/AssetUpload/onSubmit.ts
+++ b/web/src/pages/AssetUpload/onSubmit.ts
@@ -44,6 +44,7 @@ class OnSubmitProps {
     setExecStatus!: (x: ExecStatusType | ((x: ExecStatusType) => ExecStatusType)) => void;
     setAssetUploadProgress!: (x: ProgressBarProps) => void;
     setPreviewUploadProgress!: (x: ProgressBarProps) => void;
+    setCanNavigateToAssetPage!: (x: boolean) => void;
 }
 
 class ProgresCallbackArgs {
@@ -71,6 +72,7 @@ export default function onSubmit({
     setShowUploadAndExecProgress,
     setAssetUploadProgress,
     setPreviewUploadProgress,
+    setCanNavigateToAssetPage
 }: OnSubmitProps) {
     return async (detail: NonCancelableCustomEvent<{}>) => {
         setFreezeWizardButtons(true);
@@ -228,7 +230,7 @@ export default function onSubmit({
                         return Promise.reject(err);
                     });
             });
-
+            setCanNavigateToAssetPage(true);
             window.onbeforeunload = null;
         }
     };