From 2a62cfa589a430d60ce211a7126691898cfb0fd4 Mon Sep 17 00:00:00 2001
From: Austen Money <austen.money@gmail.com>
Date: Wed, 21 Aug 2024 13:05:00 -0400
Subject: [PATCH 1/7] update toast

---
 .../workspaces/{hooks.ts => hooks.tsx}        | 20 +++++++++++++++++--
 1 file changed, 18 insertions(+), 2 deletions(-)
 rename context/app/static/js/components/workspaces/{hooks.ts => hooks.tsx} (94%)

diff --git a/context/app/static/js/components/workspaces/hooks.ts b/context/app/static/js/components/workspaces/hooks.tsx
similarity index 94%
rename from context/app/static/js/components/workspaces/hooks.ts
rename to context/app/static/js/components/workspaces/hooks.tsx
index d41d909957..9536f9e1d8 100644
--- a/context/app/static/js/components/workspaces/hooks.ts
+++ b/context/app/static/js/components/workspaces/hooks.tsx
@@ -1,5 +1,10 @@
-import { useCallback, useMemo } from 'react';
+import React, { useCallback, useMemo } from 'react';
 import { KeyedMutator, useSWRConfig } from 'swr';
+
+import Stack from '@mui/system/Stack';
+import Button from '@mui/material/Button';
+import Typography from '@mui/material/Typography';
+
 import { useSnackbarActions } from 'js/shared-styles/snackbars';
 import { useLaunchWorkspaceStore } from 'js/stores/useWorkspaceModalStore';
 import { useAppContext } from 'js/components/Contexts';
@@ -271,7 +276,18 @@ export function useCreateAndLaunchWorkspace() {
         toastError('Failed to create workspace.');
         return;
       }
-      toastSuccess('Workspace successfully created.');
+
+      toastSuccess(
+        <Stack sx={{ maxWidth: '20rem', justifyContent: 'flex-end', alignItems: 'flex-end' }}>
+          <Typography>
+            Workspace successfully launched in a new tab. If the tab didn&apos;t open, please check your pop-up blocker
+            settings and relaunch your workspace.
+          </Typography>
+          <Button href={`/workspaces/${workspace.id}`} variant="contained" sx={{ backgroundColor: 'transparent' }}>
+            <Typography sx={{ color: 'white' }}>View Workspace Detail Page</Typography>
+          </Button>
+        </Stack>,
+      );
 
       try {
         await startNewWorkspace({ workspace, jobTypeId: body.default_job_type, templatePath });

From 533f49a8736b58960634096e6339f336d01e323a Mon Sep 17 00:00:00 2001
From: Austen Money <austen.money@gmail.com>
Date: Wed, 21 Aug 2024 15:09:34 -0400
Subject: [PATCH 2/7] fix styling

---
 .../app/static/js/components/workspaces/hooks.tsx  | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/context/app/static/js/components/workspaces/hooks.tsx b/context/app/static/js/components/workspaces/hooks.tsx
index 9536f9e1d8..e951d86686 100644
--- a/context/app/static/js/components/workspaces/hooks.tsx
+++ b/context/app/static/js/components/workspaces/hooks.tsx
@@ -278,14 +278,20 @@ export function useCreateAndLaunchWorkspace() {
       }
 
       toastSuccess(
-        <Stack sx={{ maxWidth: '20rem', justifyContent: 'flex-end', alignItems: 'flex-end' }}>
+        <Stack sx={{ maxWidth: '22rem' }}>
           <Typography>
             Workspace successfully launched in a new tab. If the tab didn&apos;t open, please check your pop-up blocker
             settings and relaunch your workspace.
           </Typography>
-          <Button href={`/workspaces/${workspace.id}`} variant="contained" sx={{ backgroundColor: 'transparent' }}>
-            <Typography sx={{ color: 'white' }}>View Workspace Detail Page</Typography>
-          </Button>
+          <Stack direction="row" justifyContent="flex-end" marginTop={1}>
+            <Button
+              href={`/workspaces/${workspace.id}`}
+              variant="contained"
+              sx={{ backgroundColor: 'transparent', boxShadow: 'none' }}
+            >
+              <Typography variant="button">View Workspace Detail Page</Typography>
+            </Button>
+          </Stack>
         </Stack>,
       );
 

From bc59781fbc2349416505639b13fd386db560e433 Mon Sep 17 00:00:00 2001
From: Austen Money <austen.money@gmail.com>
Date: Wed, 21 Aug 2024 15:13:38 -0400
Subject: [PATCH 3/7] add changelog

---
 CHANGELOG-update-workspace-toast.md | 1 +
 1 file changed, 1 insertion(+)
 create mode 100644 CHANGELOG-update-workspace-toast.md

diff --git a/CHANGELOG-update-workspace-toast.md b/CHANGELOG-update-workspace-toast.md
new file mode 100644
index 0000000000..e2ca2c99f2
--- /dev/null
+++ b/CHANGELOG-update-workspace-toast.md
@@ -0,0 +1 @@
+- Update language and add an action button to toasts for successful workspace creation.
\ No newline at end of file

From 2e63220898b12c3dc537b122710c422d084ad46b Mon Sep 17 00:00:00 2001
From: Austen Money <austen.money@gmail.com>
Date: Wed, 21 Aug 2024 15:28:12 -0400
Subject: [PATCH 4/7] move to new file

---
 .../WorkspaceToastSuccessMessage.tsx          | 30 +++++++++++++++++++
 .../workspaces/{hooks.tsx => hooks.ts}        | 25 ++--------------
 2 files changed, 33 insertions(+), 22 deletions(-)
 create mode 100644 context/app/static/js/components/workspaces/WorkspaceToastSuccessMessage.tsx
 rename context/app/static/js/components/workspaces/{hooks.tsx => hooks.ts} (93%)

diff --git a/context/app/static/js/components/workspaces/WorkspaceToastSuccessMessage.tsx b/context/app/static/js/components/workspaces/WorkspaceToastSuccessMessage.tsx
new file mode 100644
index 0000000000..e66f405425
--- /dev/null
+++ b/context/app/static/js/components/workspaces/WorkspaceToastSuccessMessage.tsx
@@ -0,0 +1,30 @@
+import React from 'react';
+import Stack from '@mui/material/Stack';
+import Typography from '@mui/material/Typography';
+import Button from '@mui/material/Button';
+
+function WorkspaceToastSuccessMessage(id: number) {
+  return (
+    <Stack sx={{ maxWidth: '22rem' }}>
+      <Typography>
+        Workspace successfully launched in a new tab. If the tab didn&apos;t open, please check your pop-up blocker
+        settings and relaunch your workspace.
+      </Typography>
+      <Stack direction="row" justifyContent="flex-end" marginTop={1}>
+        <Button
+          href={`/workspaces/${id}`}
+          variant="contained"
+          sx={{
+            backgroundColor: 'transparent',
+            boxShadow: 'none',
+            ':hover': { backgroundColor: 'transparent', boxShadow: 'none' },
+          }}
+        >
+          <Typography variant="button">View Workspace Detail Page</Typography>
+        </Button>
+      </Stack>
+    </Stack>
+  );
+}
+
+export default WorkspaceToastSuccessMessage;
diff --git a/context/app/static/js/components/workspaces/hooks.tsx b/context/app/static/js/components/workspaces/hooks.ts
similarity index 93%
rename from context/app/static/js/components/workspaces/hooks.tsx
rename to context/app/static/js/components/workspaces/hooks.ts
index e951d86686..aa81cc30da 100644
--- a/context/app/static/js/components/workspaces/hooks.tsx
+++ b/context/app/static/js/components/workspaces/hooks.ts
@@ -1,10 +1,6 @@
-import React, { useCallback, useMemo } from 'react';
+import { useCallback, useMemo } from 'react';
 import { KeyedMutator, useSWRConfig } from 'swr';
 
-import Stack from '@mui/system/Stack';
-import Button from '@mui/material/Button';
-import Typography from '@mui/material/Typography';
-
 import { useSnackbarActions } from 'js/shared-styles/snackbars';
 import { useLaunchWorkspaceStore } from 'js/stores/useWorkspaceModalStore';
 import { useAppContext } from 'js/components/Contexts';
@@ -33,6 +29,7 @@ import {
 } from './api';
 import { MergedWorkspace, Workspace, CreateTemplatesResponse } from './types';
 import { useWorkspaceTemplates } from './NewWorkspaceDialog/hooks';
+import WorkspaceToastSuccessMessage from './WorkspaceToastSuccessMessage';
 
 interface UseWorkspacesListTypes<T> {
   workspaces: Workspace[];
@@ -277,23 +274,7 @@ export function useCreateAndLaunchWorkspace() {
         return;
       }
 
-      toastSuccess(
-        <Stack sx={{ maxWidth: '22rem' }}>
-          <Typography>
-            Workspace successfully launched in a new tab. If the tab didn&apos;t open, please check your pop-up blocker
-            settings and relaunch your workspace.
-          </Typography>
-          <Stack direction="row" justifyContent="flex-end" marginTop={1}>
-            <Button
-              href={`/workspaces/${workspace.id}`}
-              variant="contained"
-              sx={{ backgroundColor: 'transparent', boxShadow: 'none' }}
-            >
-              <Typography variant="button">View Workspace Detail Page</Typography>
-            </Button>
-          </Stack>
-        </Stack>,
-      );
+      toastSuccess(WorkspaceToastSuccessMessage(workspace.id));
 
       try {
         await startNewWorkspace({ workspace, jobTypeId: body.default_job_type, templatePath });

From e62dd5b50bb8d0ba87337ddef0f63233e4a1ee45 Mon Sep 17 00:00:00 2001
From: Austen Money <austen.money@gmail.com>
Date: Fri, 23 Aug 2024 13:47:22 -0400
Subject: [PATCH 5/7] implement review changes

---
 ...ssage.tsx => WorkspaceLaunchSuccessToast.tsx} | 16 ++++------------
 .../app/static/js/components/workspaces/hooks.ts |  4 ++--
 2 files changed, 6 insertions(+), 14 deletions(-)
 rename context/app/static/js/components/workspaces/{WorkspaceToastSuccessMessage.tsx => WorkspaceLaunchSuccessToast.tsx} (54%)

diff --git a/context/app/static/js/components/workspaces/WorkspaceToastSuccessMessage.tsx b/context/app/static/js/components/workspaces/WorkspaceLaunchSuccessToast.tsx
similarity index 54%
rename from context/app/static/js/components/workspaces/WorkspaceToastSuccessMessage.tsx
rename to context/app/static/js/components/workspaces/WorkspaceLaunchSuccessToast.tsx
index e66f405425..296da1bb92 100644
--- a/context/app/static/js/components/workspaces/WorkspaceToastSuccessMessage.tsx
+++ b/context/app/static/js/components/workspaces/WorkspaceLaunchSuccessToast.tsx
@@ -3,7 +3,7 @@ import Stack from '@mui/material/Stack';
 import Typography from '@mui/material/Typography';
 import Button from '@mui/material/Button';
 
-function WorkspaceToastSuccessMessage(id: number) {
+function WorkspaceLaunchSuccessToast(id: number) {
   return (
     <Stack sx={{ maxWidth: '22rem' }}>
       <Typography>
@@ -11,20 +11,12 @@ function WorkspaceToastSuccessMessage(id: number) {
         settings and relaunch your workspace.
       </Typography>
       <Stack direction="row" justifyContent="flex-end" marginTop={1}>
-        <Button
-          href={`/workspaces/${id}`}
-          variant="contained"
-          sx={{
-            backgroundColor: 'transparent',
-            boxShadow: 'none',
-            ':hover': { backgroundColor: 'transparent', boxShadow: 'none' },
-          }}
-        >
-          <Typography variant="button">View Workspace Detail Page</Typography>
+        <Button href={`/workspaces/${id}`} variant="text" color="inherit">
+          View Workspace Detail Page
         </Button>
       </Stack>
     </Stack>
   );
 }
 
-export default WorkspaceToastSuccessMessage;
+export default WorkspaceLaunchSuccessToast;
diff --git a/context/app/static/js/components/workspaces/hooks.ts b/context/app/static/js/components/workspaces/hooks.ts
index aa81cc30da..33d3d37e7f 100644
--- a/context/app/static/js/components/workspaces/hooks.ts
+++ b/context/app/static/js/components/workspaces/hooks.ts
@@ -29,7 +29,7 @@ import {
 } from './api';
 import { MergedWorkspace, Workspace, CreateTemplatesResponse } from './types';
 import { useWorkspaceTemplates } from './NewWorkspaceDialog/hooks';
-import WorkspaceToastSuccessMessage from './WorkspaceToastSuccessMessage';
+import WorkspaceLaunchSuccessToast from './WorkspaceLaunchSuccessToast';
 
 interface UseWorkspacesListTypes<T> {
   workspaces: Workspace[];
@@ -274,7 +274,7 @@ export function useCreateAndLaunchWorkspace() {
         return;
       }
 
-      toastSuccess(WorkspaceToastSuccessMessage(workspace.id));
+      toastSuccess(WorkspaceLaunchSuccessToast(workspace.id));
 
       try {
         await startNewWorkspace({ workspace, jobTypeId: body.default_job_type, templatePath });

From 21c76f9815193cf6d57ff2f75b9e55b7afc31b08 Mon Sep 17 00:00:00 2001
From: Austen Money <austen.money@gmail.com>
Date: Fri, 23 Aug 2024 14:13:58 -0400
Subject: [PATCH 6/7] update alignment

---
 .../workspaces/WorkspaceLaunchSuccessToast.tsx         | 10 ++++------
 1 file changed, 4 insertions(+), 6 deletions(-)

diff --git a/context/app/static/js/components/workspaces/WorkspaceLaunchSuccessToast.tsx b/context/app/static/js/components/workspaces/WorkspaceLaunchSuccessToast.tsx
index 296da1bb92..08bd2821cd 100644
--- a/context/app/static/js/components/workspaces/WorkspaceLaunchSuccessToast.tsx
+++ b/context/app/static/js/components/workspaces/WorkspaceLaunchSuccessToast.tsx
@@ -5,16 +5,14 @@ import Button from '@mui/material/Button';
 
 function WorkspaceLaunchSuccessToast(id: number) {
   return (
-    <Stack sx={{ maxWidth: '22rem' }}>
+    <Stack spacing={1} sx={{ maxWidth: '22rem' }}>
       <Typography>
         Workspace successfully launched in a new tab. If the tab didn&apos;t open, please check your pop-up blocker
         settings and relaunch your workspace.
       </Typography>
-      <Stack direction="row" justifyContent="flex-end" marginTop={1}>
-        <Button href={`/workspaces/${id}`} variant="text" color="inherit">
-          View Workspace Detail Page
-        </Button>
-      </Stack>
+      <Button href={`/workspaces/${id}`} variant="text" color="inherit" sx={{ alignSelf: 'flex-end' }}>
+        View Workspace Detail Page
+      </Button>
     </Stack>
   );
 }

From 6de65eaa523c2c0be5f6e3e8461ce9605e44e9c2 Mon Sep 17 00:00:00 2001
From: Austen Money <austen.money@gmail.com>
Date: Mon, 26 Aug 2024 10:52:30 -0400
Subject: [PATCH 7/7] Update
 context/app/static/js/components/workspaces/WorkspaceLaunchSuccessToast.tsx

Co-authored-by: Nikolay Akhmetov <nick.akhmetov@gmail.com>
---
 .../js/components/workspaces/WorkspaceLaunchSuccessToast.tsx    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/context/app/static/js/components/workspaces/WorkspaceLaunchSuccessToast.tsx b/context/app/static/js/components/workspaces/WorkspaceLaunchSuccessToast.tsx
index 08bd2821cd..3efc448a37 100644
--- a/context/app/static/js/components/workspaces/WorkspaceLaunchSuccessToast.tsx
+++ b/context/app/static/js/components/workspaces/WorkspaceLaunchSuccessToast.tsx
@@ -5,7 +5,7 @@ import Button from '@mui/material/Button';
 
 function WorkspaceLaunchSuccessToast(id: number) {
   return (
-    <Stack spacing={1} sx={{ maxWidth: '22rem' }}>
+    <Stack spacing={1} maxWidth="22rem">
       <Typography>
         Workspace successfully launched in a new tab. If the tab didn&apos;t open, please check your pop-up blocker
         settings and relaunch your workspace.