From 46968fb013e0e83f7594652821f8abbd55fa6be5 Mon Sep 17 00:00:00 2001
From: Sean Teramae <steramae@nvidia.com>
Date: Thu, 4 Jun 2026 11:51:29 -0700
Subject: [PATCH 1/2] feat(studio): Edit description on fileset detail route

Signed-off-by: Sean Teramae <steramae@nvidia.com>
---
 .../components/FilesetActionMenu/index.tsx    | 108 ++++++++++++++++++
 .../FilesetDetailRoute/FilesetCard/index.tsx  |  11 +-
 .../src/routes/FilesetDetailRoute/index.tsx   |  34 +++++-
 3 files changed, 139 insertions(+), 14 deletions(-)
 create mode 100644 web/packages/studio/src/components/FilesetActionMenu/index.tsx

diff --git a/web/packages/studio/src/components/FilesetActionMenu/index.tsx b/web/packages/studio/src/components/FilesetActionMenu/index.tsx
new file mode 100644
index 0000000000..6d70620825
--- /dev/null
+++ b/web/packages/studio/src/components/FilesetActionMenu/index.tsx
@@ -0,0 +1,108 @@
+// SPDX-FileCopyrightText: Copyright (c) 2025-2026 NVIDIA CORPORATION & AFFILIATES. All rights reserved.
+// SPDX-License-Identifier: Apache-2.0
+
+import { getEntityReference } from '@nemo/common/src/namedEntity';
+import { useFilesDeleteFileset } from '@nemo/sdk/generated/platform/api';
+import type { FilesetOutput } from '@nemo/sdk/generated/platform/schema';
+import {
+  Button,
+  DropdownContent,
+  DropdownItem,
+  DropdownRoot,
+  DropdownTrigger,
+} from '@nvidia/foundations-react-core';
+import { invalidateDatasetCaches } from '@studio/api/datasets/invalidateDatasetCaches';
+import { DatasetCreateModal } from '@studio/components/DatasetCreateModal';
+import { DatasetCreateModalMode } from '@studio/components/DatasetCreateModal/constants';
+import { DeleteConfirmationModal } from '@studio/components/DeleteConfirmationModal';
+import { EllipsisVertical } from 'lucide-react';
+import { type FC, useState } from 'react';
+
+export interface FilesetActionMenuProps {
+  dataset: FilesetOutput;
+  onNavigateToDetails?: (dataset: FilesetOutput) => void;
+  onDatasetUpdated?: (dataset: FilesetOutput) => void;
+  onDatasetDeleted?: (dataset: FilesetOutput) => void;
+}
+
+export const FilesetActionMenu: FC<FilesetActionMenuProps> = ({
+  dataset,
+  onNavigateToDetails,
+  onDatasetUpdated,
+  onDatasetDeleted,
+}) => {
+  const [modalOpen, setModalOpen] = useState<'edit' | 'delete' | undefined>(undefined);
+  const { mutateAsync: deleteDataset } = useFilesDeleteFileset({
+    mutation: {
+      onSuccess: (_data, variables) => {
+        invalidateDatasetCaches(variables.workspace, variables.name, ['list']);
+      },
+    },
+  });
+
+  const handleDeleteDataset = async (): Promise<boolean> => {
+    try {
+      if (!dataset?.workspace || !dataset?.name) {
+        throw new Error('Dataset workspace or name is undefined');
+      }
+      await deleteDataset({ workspace: dataset.workspace, name: dataset.name });
+      onDatasetDeleted?.(dataset);
+      return true;
+    } catch (error) {
+      console.error('Failed to delete dataset:', error);
+      return false;
+    }
+  };
+
+  const handleModalClose = () => {
+    setModalOpen(undefined);
+  };
+
+  const handleDatasetUpdated = (updatedDataset: FilesetOutput) => {
+    onDatasetUpdated?.(updatedDataset);
+    handleModalClose();
+  };
+
+  return (
+    <>
+      <DropdownRoot>
+        <DropdownTrigger asChild showChevron={false} data-testid="quick-actions-menu-trigger">
+          <Button kind="tertiary" aria-label="Open dataset actions menu">
+            <EllipsisVertical />
+          </Button>
+        </DropdownTrigger>
+        <DropdownContent align="end" className="w-[180px]">
+          {onNavigateToDetails && (
+            <DropdownItem onClick={() => onNavigateToDetails(dataset)}>View</DropdownItem>
+          )}
+          <DropdownItem onClick={() => setModalOpen('edit')}>Edit</DropdownItem>
+          <DropdownItem onClick={() => setModalOpen('delete')} danger>
+            Delete
+          </DropdownItem>
+        </DropdownContent>
+      </DropdownRoot>
+
+      {modalOpen === 'edit' && (
+        <DatasetCreateModal
+          dataset={dataset}
+          mode={DatasetCreateModalMode.Edit}
+          onClose={handleModalClose}
+          onDatasetUpdated={handleDatasetUpdated}
+          open={modalOpen === 'edit'}
+        />
+      )}
+
+      {modalOpen === 'delete' && (
+        <DeleteConfirmationModal
+          open={modalOpen === 'delete'}
+          onClose={handleModalClose}
+          onDelete={handleDeleteDataset}
+          title={`Delete Dataset: ${dataset.name}`}
+          confirmationText={dataset.name ?? getEntityReference(dataset)}
+          simpleConfirm
+          successText="Dataset deleted successfully"
+        />
+      )}
+    </>
+  );
+};
diff --git a/web/packages/studio/src/routes/FilesetDetailRoute/FilesetCard/index.tsx b/web/packages/studio/src/routes/FilesetDetailRoute/FilesetCard/index.tsx
index 98d2406eeb..f99792c080 100644
--- a/web/packages/studio/src/routes/FilesetDetailRoute/FilesetCard/index.tsx
+++ b/web/packages/studio/src/routes/FilesetDetailRoute/FilesetCard/index.tsx
@@ -2,7 +2,7 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import type { FilesetFileOutput, FilesetOutput } from '@nemo/sdk/generated/platform/schema';
-import { Grid, GridItem, Stack, Text } from '@nvidia/foundations-react-core';
+import { Grid, GridItem, Stack } from '@nvidia/foundations-react-core';
 import { useDatasetFileContent } from '@studio/api/datasets/useDatasetFileContent';
 import { ReadmeBody } from '@studio/routes/FilesetDetailRoute/FilesetCard/ReadmeBody';
 import { FilesetMetadataPanel } from '@studio/routes/FilesetDetailRoute/FilesetMetadataPanel';
@@ -52,19 +52,14 @@ export const FilesetCard: FC<FilesetCardProps> = ({
     <Grid
       cols={{ base: 1, xl: 12 }}
       gap="density-xl"
-      className="w-full items-start"
+      className="max-h-full w-full items-start"
       data-testid="fileset-card"
     >
       <GridItem
         cols={{ lg: 8 }}
-        className="min-w-0 overflow-hidden rounded-lg border border-base bg-surface-raised p-density-xl"
+        className="min-w-0 max-h-full overflow-auto rounded-lg border border-base bg-surface-raised p-density-xl"
       >
         <Stack gap="density-md">
-          {fileset.description && (
-            <Text kind="body/regular/md" data-testid="fileset-card-description">
-              {fileset.description}
-            </Text>
-          )}
           <ReadmeBody
             isFilesError={isFilesError}
             readmePath={readmePath}
diff --git a/web/packages/studio/src/routes/FilesetDetailRoute/index.tsx b/web/packages/studio/src/routes/FilesetDetailRoute/index.tsx
index 3027c56ec3..3a8b969453 100644
--- a/web/packages/studio/src/routes/FilesetDetailRoute/index.tsx
+++ b/web/packages/studio/src/routes/FilesetDetailRoute/index.tsx
@@ -20,6 +20,7 @@ import {
   Text,
 } from '@nvidia/foundations-react-core';
 import { AccessibleTitle } from '@studio/components/AccessibleTitle';
+import { FilesetActionMenu } from '@studio/components/FilesetActionMenu';
 import { Loading } from '@studio/components/Layouts/Loading';
 import { ROUTE_PARAMS } from '@studio/constants/routes';
 import { useWorkspaceFromPath } from '@studio/hooks/useWorkspaceFromPath';
@@ -32,9 +33,11 @@ import { getModelSource, isRootReadme } from '@studio/routes/FilesetDetailRoute/
 import { getWorkspaceFilesetsRoute } from '@studio/routes/utils';
 import { useRequiredPathParams } from '@studio/util/hooks/useRequiredPathParams';
 import type { FC } from 'react';
+import { useNavigate } from 'react-router-dom';
 
 export const FilesetDetailRoute: FC = () => {
   const workspace = useWorkspaceFromPath();
+  const navigate = useNavigate();
   const { filesetName } = useRequiredPathParams([ROUTE_PARAMS.filesetName]);
   const filesetId = getEntityReference({ namespace: workspace, name: filesetName });
 
@@ -105,17 +108,36 @@ export const FilesetDetailRoute: FC = () => {
   // The source line (HF/NGC origin) is meaningful for model/generic filesets;
   // datasets don't surface it.
   const source = isDataset ? undefined : getModelSource(fileset);
-  const description = source ? (
-    <Flex gap="density-sm" align="center">
-      {creatorToIcon(source.creatorSlug, { className: 'w-4 h-4 flex-shrink-0' })}
-      <span>{source.path}</span>
-    </Flex>
+  const descriptionText = <Text kind="body/regular/md">{fileset.description}</Text>;
+  const description = isDataset ? (
+    descriptionText
+  ) : source ? (
+    <Stack gap="1">
+      <Flex gap="1" align="center">
+        {creatorToIcon(source.creatorSlug, { className: 'w-4 h-4 flex-shrink-0' })}
+        <span>{source.path}</span>
+      </Flex>
+      {descriptionText}
+    </Stack>
   ) : undefined;
 
   return (
     <AccessibleTitle title={`${typeLabel} ${filesetName}`}>
       <Stack className="w-full h-full min-h-0 p-density-2xl" gap="density-xl">
-        <PageHeader slotHeading={filesetName} slotDescription={description} />
+        <PageHeader
+          slotHeading={
+            <Stack gap="density-sm">
+              <Flex gap="density-sm" align="center" justify="between">
+                <span>{filesetName}</span>
+                <FilesetActionMenu
+                  dataset={fileset}
+                  onDatasetDeleted={() => navigate(getWorkspaceFilesetsRoute(workspace))}
+                />
+              </Flex>
+            </Stack>
+          }
+          slotDescription={description}
+        />
         <TabsRoot
           className="flex-1 min-h-0 flex flex-col"
           value={currentTab}

From 565432b50ccdd3bf027e4551139f3bace332ddc3 Mon Sep 17 00:00:00 2001
From: Sean Teramae <steramae@nvidia.com>
Date: Thu, 4 Jun 2026 15:37:34 -0700
Subject: [PATCH 2/2] fix terminology

Signed-off-by: Sean Teramae <steramae@nvidia.com>
---
 .../components/FilesetActionMenu/index.tsx    | 48 +++++++++----------
 .../src/routes/FilesetDetailRoute/index.tsx   |  4 +-
 2 files changed, 26 insertions(+), 26 deletions(-)

diff --git a/web/packages/studio/src/components/FilesetActionMenu/index.tsx b/web/packages/studio/src/components/FilesetActionMenu/index.tsx
index 6d70620825..b82b60bea9 100644
--- a/web/packages/studio/src/components/FilesetActionMenu/index.tsx
+++ b/web/packages/studio/src/components/FilesetActionMenu/index.tsx
@@ -19,20 +19,20 @@ import { EllipsisVertical } from 'lucide-react';
 import { type FC, useState } from 'react';
 
 export interface FilesetActionMenuProps {
-  dataset: FilesetOutput;
-  onNavigateToDetails?: (dataset: FilesetOutput) => void;
-  onDatasetUpdated?: (dataset: FilesetOutput) => void;
-  onDatasetDeleted?: (dataset: FilesetOutput) => void;
+  fileset: FilesetOutput;
+  onNavigateToDetails?: (fileset: FilesetOutput) => void;
+  onFilesetUpdated?: (fileset: FilesetOutput) => void;
+  onFilesetDeleted?: (fileset: FilesetOutput) => void;
 }
 
 export const FilesetActionMenu: FC<FilesetActionMenuProps> = ({
-  dataset,
+  fileset,
   onNavigateToDetails,
-  onDatasetUpdated,
-  onDatasetDeleted,
+  onFilesetUpdated,
+  onFilesetDeleted,
 }) => {
   const [modalOpen, setModalOpen] = useState<'edit' | 'delete' | undefined>(undefined);
-  const { mutateAsync: deleteDataset } = useFilesDeleteFileset({
+  const { mutateAsync: deleteFileset } = useFilesDeleteFileset({
     mutation: {
       onSuccess: (_data, variables) => {
         invalidateDatasetCaches(variables.workspace, variables.name, ['list']);
@@ -40,16 +40,16 @@ export const FilesetActionMenu: FC<FilesetActionMenuProps> = ({
     },
   });
 
-  const handleDeleteDataset = async (): Promise<boolean> => {
+  const handleDeleteFileset = async (): Promise<boolean> => {
     try {
-      if (!dataset?.workspace || !dataset?.name) {
-        throw new Error('Dataset workspace or name is undefined');
+      if (!fileset?.workspace || !fileset?.name) {
+        throw new Error('Fileset workspace or name is undefined');
       }
-      await deleteDataset({ workspace: dataset.workspace, name: dataset.name });
-      onDatasetDeleted?.(dataset);
+      await deleteFileset({ workspace: fileset.workspace, name: fileset.name });
+      onFilesetDeleted?.(fileset);
       return true;
     } catch (error) {
-      console.error('Failed to delete dataset:', error);
+      console.error('Failed to delete fileset:', error);
       return false;
     }
   };
@@ -58,8 +58,8 @@ export const FilesetActionMenu: FC<FilesetActionMenuProps> = ({
     setModalOpen(undefined);
   };
 
-  const handleDatasetUpdated = (updatedDataset: FilesetOutput) => {
-    onDatasetUpdated?.(updatedDataset);
+  const handleFilesetUpdated = (updatedFileset: FilesetOutput) => {
+    onFilesetUpdated?.(updatedFileset);
     handleModalClose();
   };
 
@@ -67,13 +67,13 @@ export const FilesetActionMenu: FC<FilesetActionMenuProps> = ({
     <>
       <DropdownRoot>
         <DropdownTrigger asChild showChevron={false} data-testid="quick-actions-menu-trigger">
-          <Button kind="tertiary" aria-label="Open dataset actions menu">
+          <Button kind="tertiary" aria-label="Open fileset actions menu">
             <EllipsisVertical />
           </Button>
         </DropdownTrigger>
         <DropdownContent align="end" className="w-[180px]">
           {onNavigateToDetails && (
-            <DropdownItem onClick={() => onNavigateToDetails(dataset)}>View</DropdownItem>
+            <DropdownItem onClick={() => onNavigateToDetails(fileset)}>View</DropdownItem>
           )}
           <DropdownItem onClick={() => setModalOpen('edit')}>Edit</DropdownItem>
           <DropdownItem onClick={() => setModalOpen('delete')} danger>
@@ -84,10 +84,10 @@ export const FilesetActionMenu: FC<FilesetActionMenuProps> = ({
 
       {modalOpen === 'edit' && (
         <DatasetCreateModal
-          dataset={dataset}
+          dataset={fileset}
           mode={DatasetCreateModalMode.Edit}
           onClose={handleModalClose}
-          onDatasetUpdated={handleDatasetUpdated}
+          onDatasetUpdated={handleFilesetUpdated}
           open={modalOpen === 'edit'}
         />
       )}
@@ -96,11 +96,11 @@ export const FilesetActionMenu: FC<FilesetActionMenuProps> = ({
         <DeleteConfirmationModal
           open={modalOpen === 'delete'}
           onClose={handleModalClose}
-          onDelete={handleDeleteDataset}
-          title={`Delete Dataset: ${dataset.name}`}
-          confirmationText={dataset.name ?? getEntityReference(dataset)}
+          onDelete={handleDeleteFileset}
+          title={`Delete Fileset: ${fileset.name}`}
+          confirmationText={fileset.name ?? getEntityReference(fileset)}
           simpleConfirm
-          successText="Dataset deleted successfully"
+          successText="Fileset deleted successfully"
         />
       )}
     </>
diff --git a/web/packages/studio/src/routes/FilesetDetailRoute/index.tsx b/web/packages/studio/src/routes/FilesetDetailRoute/index.tsx
index 3a8b969453..711c3685e8 100644
--- a/web/packages/studio/src/routes/FilesetDetailRoute/index.tsx
+++ b/web/packages/studio/src/routes/FilesetDetailRoute/index.tsx
@@ -130,8 +130,8 @@ export const FilesetDetailRoute: FC = () => {
               <Flex gap="density-sm" align="center" justify="between">
                 <span>{filesetName}</span>
                 <FilesetActionMenu
-                  dataset={fileset}
-                  onDatasetDeleted={() => navigate(getWorkspaceFilesetsRoute(workspace))}
+                  fileset={fileset}
+                  onFilesetDeleted={() => navigate(getWorkspaceFilesetsRoute(workspace))}
                 />
               </Flex>
             </Stack>