Merge pull request #27565 from jescalada/scaffolder-page-contextmenu-props-bugfix

Add contextMenu prop to Actions and ListTasks

.changeset/ten-hats-appear.md

@@ -0,0 +1,6 @@
+---
+'@backstage/plugin-scaffolder-react': minor
+'@backstage/plugin-scaffolder': minor
+---
+
+Fix `contextMenu` not being disabled bug in new scaffolder pages

plugins/scaffolder-react/src/next/components/ScaffolderPageContextMenu/ScaffolderPageContextMenu.tsx

@@ -66,7 +66,12 @@ export function ScaffolderPageContextMenu(
     permission: templateManagementPermission,
   });
 
-  if (!onEditorClicked && !onActionsClicked) {
+  if (
+    !onEditorClicked &&
+    !onActionsClicked &&
+    !onTasksClicked &&
+    !onCreateClicked
+  ) {
     return null;
   }
 

plugins/scaffolder/report.api.md

@@ -499,6 +499,7 @@ export type RouterProps = {
     editor?: boolean;
     actions?: boolean;
     tasks?: boolean;
+    create?: boolean;
   };
 };
 

plugins/scaffolder/src/components/ActionsPage/ActionsPage.tsx

@@ -407,7 +407,16 @@ export const ActionPageContent = () => {
     </>
   );
 };
-export const ActionsPage = () => {
+
+export type ActionsPageProps = {
+  contextMenu?: {
+    editor?: boolean;
+    tasks?: boolean;
+    create?: boolean;
+  };
+};
+
+export const ActionsPage = (props: ActionsPageProps) => {
   const navigate = useNavigate();
   const editorLink = useRouteRef(editRouteRef);
   const tasksLink = useRouteRef(scaffolderListTaskRouteRef);
@@ -415,10 +424,19 @@ export const ActionsPage = () => {
   const { t } = useTranslationRef(scaffolderTranslationRef);
 
   const scaffolderPageContextMenuProps = {
-    onEditorClicked: () => navigate(editorLink()),
+    onEditorClicked:
+      props?.contextMenu?.editor !== false
+        ? () => navigate(editorLink())
+        : undefined,
     onActionsClicked: undefined,
-    onTasksClicked: () => navigate(tasksLink()),
-    onCreateClicked: () => navigate(createLink()),
+    onTasksClicked:
+      props?.contextMenu?.tasks !== false
+        ? () => navigate(tasksLink())
+        : undefined,
+    onCreateClicked:
+      props?.contextMenu?.create !== false
+        ? () => navigate(createLink())
+        : undefined,
   };
 
   return (

plugins/scaffolder/src/components/ListTasksPage/ListTasksPage.tsx

@@ -46,6 +46,11 @@ import { scaffolderTranslationRef } from '../../translation';
 
 export interface MyTaskPageProps {
   initiallySelectedFilter?: 'owned' | 'all';
+  contextMenu?: {
+    editor?: boolean;
+    actions?: boolean;
+    create?: boolean;
+  };
 }
 
 const ListTaskPageContent = (props: MyTaskPageProps) => {
@@ -161,10 +166,19 @@ export const ListTasksPage = (props: MyTaskPageProps) => {
   const { t } = useTranslationRef(scaffolderTranslationRef);
 
   const scaffolderPageContextMenuProps = {
-    onEditorClicked: () => navigate(editorLink()),
-    onActionsClicked: () => navigate(actionsLink()),
+    onEditorClicked:
+      props?.contextMenu?.editor !== false
+        ? () => navigate(editorLink())
+        : undefined,
+    onActionsClicked:
+      props?.contextMenu?.actions !== false
+        ? () => navigate(actionsLink())
+        : undefined,
     onTasksClicked: undefined,
-    onCreateClicked: () => navigate(createLink()),
+    onCreateClicked:
+      props?.contextMenu?.create !== false
+        ? () => navigate(createLink())
+        : undefined,
   };
   return (
     <Page themeId="home">

plugins/scaffolder/src/components/Router/Router.tsx

@@ -97,6 +97,8 @@ export type RouterProps = {
     actions?: boolean;
     /** Whether to show a link to the tasks page */
     tasks?: boolean;
+    /** Whether to show a link to the create page (on /create subroutes) */
+    create?: boolean;
   };
 };
 
@@ -207,12 +209,15 @@ export const Router = (props: PropsWithChildren<RouterProps>) => {
         }
       />
 
-      <Route path={actionsRouteRef.path} element={<ActionsPage />} />
+      <Route
+        path={actionsRouteRef.path}
+        element={<ActionsPage contextMenu={props.contextMenu} />}
+      />
       <Route
         path={scaffolderListTaskRouteRef.path}
         element={
           <RequirePermission permission={taskReadPermission}>
-            <ListTasksPage />
+            <ListTasksPage contextMenu={props.contextMenu} />
           </RequirePermission>
         }
       />