fix unauthorized access to pages

pages/metadata/productblocks.tsx

@@ -1,7 +1,17 @@
-import React from 'react';
-
-import { WfoProductBlocksPage } from '@orchestrator-ui/orchestrator-ui-components';
-
-export const ProductBlocksPage = () => <WfoProductBlocksPage />;
-
-export default ProductBlocksPage;
+import {
+    PolicyResource,
+    WfoPolicyRenderPageFallback,
+    WfoProductBlocksPage,
+  } from '@orchestrator-ui/orchestrator-ui-components';
+  import React from 'react';
+
+  export const ProductBlocksPage = () => {
+    return (
+      <WfoPolicyRenderPageFallback resource={PolicyResource.NAVIGATION_METADATA}>
+        <WfoProductBlocksPage />
+      </WfoPolicyRenderPageFallback>
+    );
+  };
+
+  export default ProductBlocksPage;
+

pages/metadata/products.tsx

@@ -1,7 +1,15 @@
-import React from 'react';
-
-import { WfoProductsPage } from '@orchestrator-ui/orchestrator-ui-components';
-
-export const ProductsPage = () => <WfoProductsPage />;
-
-export default ProductsPage;
+import {
+    PolicyResource,
+    WfoPolicyRenderPageFallback,
+    WfoProductsPage,
+  } from '@orchestrator-ui/orchestrator-ui-components';
+  import React from 'react';
+
+  export const ProductsPage = () => (
+    <WfoPolicyRenderPageFallback resource={PolicyResource.NAVIGATION_METADATA}>
+      <WfoProductsPage />
+    </WfoPolicyRenderPageFallback>
+  );
+
+  export default ProductsPage;
+

pages/metadata/resource-types.tsx

@@ -1,7 +1,15 @@
-import React from 'react';
-
-import { WfoResourceTypesPage } from '@orchestrator-ui/orchestrator-ui-components';
-
-export const ResourceTypesPage = () => <WfoResourceTypesPage />;
-
-export default ResourceTypesPage;
+import {
+    PolicyResource,
+    WfoPolicyRenderPageFallback,
+    WfoResourceTypesPage,
+  } from '@orchestrator-ui/orchestrator-ui-components';
+  import React from 'react';
+
+  export const ResourceTypesPage = () => (
+    <WfoPolicyRenderPageFallback resource={PolicyResource.NAVIGATION_METADATA}>
+      <WfoResourceTypesPage />
+    </WfoPolicyRenderPageFallback>
+  );
+
+  export default ResourceTypesPage;
+

pages/metadata/tasks.tsx

@@ -1,7 +1,15 @@
-import React from 'react';
-
-import { WfoTasksPage } from '@orchestrator-ui/orchestrator-ui-components';
-
-export const TasksPage = () => <WfoTasksPage />;
-
-export default TasksPage;
+import {
+    PolicyResource,
+    WfoPolicyRenderPageFallback,
+    WfoTasksPage,
+  } from '@orchestrator-ui/orchestrator-ui-components';
+  import React from 'react';
+
+  export const TasksPage = () => (
+    <WfoPolicyRenderPageFallback resource={PolicyResource.NAVIGATION_METADATA}>
+      <WfoTasksPage />
+    </WfoPolicyRenderPageFallback>
+  );
+
+  export default TasksPage;
+

pages/metadata/workflows.tsx

@@ -1,7 +1,15 @@
-import React from 'react';
-
-import { WfoWorkflowsPage } from '@orchestrator-ui/orchestrator-ui-components';
-
-export const WorkflowsPage = () => <WfoWorkflowsPage />;
-
-export default WorkflowsPage;
+import {
+    PolicyResource,
+    WfoPolicyRenderPageFallback,
+    WfoWorkflowsPage,
+  } from '@orchestrator-ui/orchestrator-ui-components';
+  import React from 'react';
+
+  export const WorkflowsPage = () => (
+    <WfoPolicyRenderPageFallback resource={PolicyResource.NAVIGATION_METADATA}>
+      <WfoWorkflowsPage />
+    </WfoPolicyRenderPageFallback>
+  );
+
+  export default WorkflowsPage;
+

pages/settings.tsx

@@ -1,9 +1,15 @@
-import React from 'react';
-
-import { WfoSettingsPage } from '@orchestrator-ui/orchestrator-ui-components';
-
-export function SettingsPage() {
-    return <WfoSettingsPage />;
-}
-
-export default SettingsPage;
+import {
+    PolicyResource,
+    WfoPolicyRenderPageFallback,
+    WfoSettingsPage,
+  } from '@orchestrator-ui/orchestrator-ui-components';
+  import React from 'react';
+
+  export const SettingsPage = () => (
+    <WfoPolicyRenderPageFallback resource={PolicyResource.NAVIGATION_SETTINGS}>
+      <WfoSettingsPage />
+    </WfoPolicyRenderPageFallback>
+  );
+
+  export default SettingsPage;
+

pages/subscriptions/[subscriptionId].tsx

@@ -1,7 +1,17 @@
-import React from 'react';
-
-import { WfoSubscriptionDetailPage } from '@orchestrator-ui/orchestrator-ui-components';
-
-const SubscriptionDetailPage = () => <WfoSubscriptionDetailPage />;
-
-export default SubscriptionDetailPage;
+import {
+    PolicyResource,
+    WfoPolicyRenderPageFallback,
+    WfoSubscriptionDetailPage,
+  } from '@orchestrator-ui/orchestrator-ui-components';
+  import React from 'react';
+
+  const SubscriptionDetailPage = () => (
+    <WfoPolicyRenderPageFallback
+      resource={PolicyResource.NAVIGATION_SUBSCRIPTIONS}
+    >
+      <WfoSubscriptionDetailPage />
+    </WfoPolicyRenderPageFallback>
+  );
+
+  export default SubscriptionDetailPage;
+

pages/tasks/[taskId].tsx

@@ -1,20 +1,29 @@
-import React from 'react';
-
-import { useRouter } from 'next/router';
-
-import { WfoProcessDetailPage } from '@orchestrator-ui/orchestrator-ui-components';
-
-const TaskDetailPage = () => {
+import {
+    PolicyResource,
+    usePolicy,
+    WfoPageUnauthorized,
+    WfoProcessDetailPage,
+  } from '@orchestrator-ui/orchestrator-ui-components';
+  import { useRouter } from 'next/router';
+  import React from 'react';
+
+  const TaskDetailPage = () => {
     const router = useRouter();
     const { taskId } = router.query;
-
+
+    const { isAllowed } = usePolicy();
+    if (!isAllowed(PolicyResource.NAVIGATION_TASKS)) {
+      return <WfoPageUnauthorized />;
+    }
+
     return (
-        <>
-            {(taskId && typeof taskId === 'string' && (
-                <WfoProcessDetailPage processId={taskId} />
-            )) || <div>Invalid taskId</div>}
-        </>
+      <>
+        {(taskId && typeof taskId === 'string' && (
+          <WfoProcessDetailPage processId={taskId} />
+        )) || <div>Invalid taskId</div>}
+      </>
     );
-};
-
-export default TaskDetailPage;
+  };
+
+  export default TaskDetailPage;
+