OCPBUGS-76787: Fix 404 error when viewing CRs with 'All Projects' selected

frontend/public/components/resource-list.tsx

@@ -27,6 +27,7 @@ import {
   ResourceListPage as ResourceListPageExt,
   isResourceListPage,
 } from '@console/dynamic-plugin-sdk/src/extensions/pages';
+import { useNamespaceFromURL } from './useNamespaceFromURL';
 
 // Parameters can be in pros.params (in URL) or in props.route (attribute of Route tag)
 const allParams = (props) => Object.assign({}, _.get(props, 'params'), props);
@@ -72,7 +73,8 @@ const ResourceListPage_ = connectToPlural(
 
 export const ResourceListPage = (props) => {
   const params = useParams();
-  return <ResourceListPage_ {...props} params={params} />;
+  const ns = useNamespaceFromURL();
+  return <ResourceListPage_ {...props} params={{ ...params, ns }} />;
 };
 
 const ResourceDetailsPage_ = connectToPlural((props: ResourceDetailsPageProps) => {
@@ -125,7 +127,8 @@ const ResourceDetailsPage_ = connectToPlural((props: ResourceDetailsPageProps) =
 
 export const ResourceDetailsPage = (props) => {
   const params = useParams();
-  return <ResourceDetailsPage_ {...props} params={params} />;
+  const ns = useNamespaceFromURL();
+  return <ResourceDetailsPage_ {...props} params={{ ...params, ns }} />;
 };
 
 export type ResourceListPageProps = {

frontend/public/components/useNamespaceFromURL.ts

@@ -0,0 +1,21 @@
+import { useParams } from 'react-router';
+import { useActiveNamespace } from '@console/dynamic-plugin-sdk/src/lib-core';
+import { ALL_NAMESPACES_KEY } from '@console/shared/src/constants';
+
+/**
+ * Hook to get the namespace from URL params or active namespace selector.
+ *
+ * For routes with explicit namespace (/k8s/ns/:ns/:plural), returns the URL param.
+ * For routes without namespace (/k8s/all-namespaces/:plural), returns the active
+ * namespace from the selector, converting ALL_NAMESPACES_KEY to undefined.
+ *
+ * @returns The namespace string or undefined for all-namespaces view
+ */
+export const useNamespaceFromURL = (): string | undefined => {
+  const params = useParams<{ ns?: string }>();
+  const [activeNamespace] = useActiveNamespace();
+
+  // Use namespace from URL params if available, otherwise use active namespace
+  // Convert ALL_NAMESPACES_KEY to undefined for the all-namespaces routes
+  return params.ns || (activeNamespace === ALL_NAMESPACES_KEY ? undefined : activeNamespace);
+};