Merge pull request #4154 from Agenta-AI/feat/open-playground-from-application-table

enhance: open `playground` from `prompt` table

Author: ashrafchowdury

web/oss/src/components/pages/app-management/components/ApplicationManagementSection.tsx

@@ -7,6 +7,7 @@ import {useSetAtom, useAtomValue} from "jotai"
 import {useRouter} from "next/router"
 
 import {openDeleteAppModalAtom} from "@/oss/components/pages/app-management/modals/DeleteAppModal/store/deleteAppModalStore"
+import {usePlaygroundNavigation} from "@/oss/hooks/usePlaygroundNavigation"
 import useURL from "@/oss/hooks/useURL"
 
 import {
@@ -35,6 +36,7 @@ const ApplicationManagementSection = ({
 }: ApplicationManagementSectionProps) => {
     const router = useRouter()
     const {baseAppURL} = useURL()
+    const {goToPlayground} = usePlaygroundNavigation()
     const openDeleteAppModal = useSetAtom(openDeleteAppModalAtom)
     const filteredAppCount = useAtomValue(appWorkflowCountAtom)
     const totalAppCount = useAtomValue(appWorkflowTotalCountAtom)
@@ -51,14 +53,17 @@ const ApplicationManagementSection = ({
             onOpen: (record) => {
                 router.push(`${baseAppURL}/${record.workflowId}/overview`)
             },
+            onOpenPlayground: (record) => {
+                goToPlayground(undefined, {appId: record.workflowId})
+            },
             onDelete: (record) => {
                 openDeleteAppModal({
                     id: record.workflowId,
                     name: record.name,
                 })
             },
         }),
-        [router, baseAppURL, openDeleteAppModal],
+        [router, baseAppURL, goToPlayground, openDeleteAppModal],
     )
 
     const table = useTableManager<AppWorkflowRow>({

web/oss/src/components/pages/app-management/components/appWorkflowColumns.tsx

@@ -1,6 +1,6 @@
 import {workflowAppTypeAtomFamily} from "@agenta/entities/workflow"
 import {createStandardColumns} from "@agenta/ui/table"
-import {Note, Trash} from "@phosphor-icons/react"
+import {Note, Rocket, Trash} from "@phosphor-icons/react"
 import {Tag} from "antd"
 import {useAtomValue} from "jotai"
 import {getDefaultStore} from "jotai/vanilla"
@@ -42,6 +42,7 @@ export const AppNameCell = ({workflowId, name}: {workflowId: string; name: strin
 
 export interface AppWorkflowColumnActions {
     onOpen: (record: AppWorkflowRow) => void
+    onOpenPlayground: (record: AppWorkflowRow) => void
     onDelete: (record: AppWorkflowRow) => void
 }
 
@@ -75,14 +76,20 @@ export function createAppWorkflowColumns(actions: AppWorkflowColumnActions) {
             items: [
                 {
                     key: "open_app",
-                    label: "Open",
+                    label: "Open overview",
                     icon: <Note size={16} />,
                     onClick: (record) => actions.onOpen(record),
                 },
+                {
+                    key: "open_playground",
+                    label: "Open in playground",
+                    icon: <Rocket size={16} />,
+                    onClick: (record) => actions.onOpenPlayground(record),
+                },
                 {type: "divider"},
                 {
                     key: "delete_app",
-                    label: "Delete",
+                    label: "Archive",
                     icon: <Trash size={16} />,
                     danger: true,
                     onClick: (record) => actions.onDelete(record),

web/oss/src/components/pages/app-management/modals/DeleteAppModal/index.tsx

@@ -60,7 +60,7 @@ const DeleteAppModal = (props = {}) => {
             {...props}
             open={open}
         >
-            <p>Are you sure you want to delete {appDetails?.name}?</p>
+            <p>Are you sure you want to archive {appDetails?.name}?</p>
         </Modal>
     )
 }