frontend permission integration changed

Signed-off-by: Deepankumar Loganathan <deepan0433@gmail.com>

.changeset/ten-dryers-compete.md

@@ -4,10 +4,4 @@
 '@backstage/plugin-azure-devops-common': patch
 ---
 
-Azure DevOps plugin is now integrated with permission framework for the below features
-
-1. PullRequest
-2. Dashboard Pull Request
-3. Pipeline
-4. GitTag
-5. Readme
+Azure DevOps plugin is now integrated with permission framework for its core features, see the https://github.com/backstage/backstage/blob/master/plugins/azure-devops/README.md for more details.

plugins/azure-devops-common/api-report.md

@@ -25,36 +25,24 @@ export const AZURE_DEVOPS_README_ANNOTATION = 'dev.azure.com/readme-path';
 // @public (undocumented)
 export const AZURE_DEVOPS_REPO_ANNOTATION = 'dev.azure.com/project-repo';
 
-// Warning: (ae-missing-release-tag) "azureDevOpsGitTagReadPermission" is part of the package's API, but it is missing a release tag (@alpha, @beta, @public, or @internal)
-//
 // @public (undocumented)
 export const azureDevOpsGitTagReadPermission: ResourcePermission<'catalog-entity'>;
 
-// Warning: (ae-missing-release-tag) "azureDevOpsPermissions" is part of the package's API, but it is missing a release tag (@alpha, @beta, @public, or @internal)
-//
 // @public (undocumented)
 export const azureDevOpsPermissions: (
   | BasicPermission
   | ResourcePermission<'catalog-entity'>
 )[];
 
-// Warning: (ae-missing-release-tag) "azureDevOpsPipelineReadPermission" is part of the package's API, but it is missing a release tag (@alpha, @beta, @public, or @internal)
-//
 // @public (undocumented)
 export const azureDevOpsPipelineReadPermission: ResourcePermission<'catalog-entity'>;
 
-// Warning: (ae-missing-release-tag) "azureDevOpsPullRequestDashboardReadPermission" is part of the package's API, but it is missing a release tag (@alpha, @beta, @public, or @internal)
-//
 // @public (undocumented)
 export const azureDevOpsPullRequestDashboardReadPermission: BasicPermission;
 
-// Warning: (ae-missing-release-tag) "azureDevOpsPullRequestReadPermission" is part of the package's API, but it is missing a release tag (@alpha, @beta, @public, or @internal)
-//
 // @public (undocumented)
 export const azureDevOpsPullRequestReadPermission: ResourcePermission<'catalog-entity'>;
 
-// Warning: (ae-missing-release-tag) "azureDevOpsReadmeReadPermission" is part of the package's API, but it is missing a release tag (@alpha, @beta, @public, or @internal)
-//
 // @public (undocumented)
 export const azureDevOpsReadmeReadPermission: ResourcePermission<'catalog-entity'>;
 

plugins/azure-devops-common/src/permissions.ts

@@ -14,36 +14,55 @@
  * limitations under the License.
  */
 import { createPermission } from '@backstage/plugin-permission-common';
-
 import { RESOURCE_TYPE_CATALOG_ENTITY } from '@backstage/plugin-catalog-common/alpha';
 
+/**
+ * @public
+ */
 export const azureDevOpsPullRequestReadPermission = createPermission({
   name: 'azure.devops.pullrequest.read',
   attributes: { action: 'read' },
   resourceType: RESOURCE_TYPE_CATALOG_ENTITY,
 });
 
+/**
+ * @public
+ */
 export const azureDevOpsPullRequestDashboardReadPermission = createPermission({
   name: 'azure.devops.pullrequest.dashboard.read',
   attributes: { action: 'read' },
 });
 
+/**
+ * @public
+ */
 export const azureDevOpsPipelineReadPermission = createPermission({
   name: 'azure.devops.pipeline.read',
   attributes: { action: 'read' },
   resourceType: RESOURCE_TYPE_CATALOG_ENTITY,
 });
+
+/**
+ * @public
+ */
 export const azureDevOpsGitTagReadPermission = createPermission({
   name: 'azure.devops.gittag.read',
   attributes: { action: 'read' },
   resourceType: RESOURCE_TYPE_CATALOG_ENTITY,
 });
+
+/**
+ * @public
+ */
 export const azureDevOpsReadmeReadPermission = createPermission({
   name: 'azure.devops.readme.read',
   attributes: { action: 'read' },
   resourceType: RESOURCE_TYPE_CATALOG_ENTITY,
 });
 
+/**
+ * @public
+ */
 export const azureDevOpsPermissions = [
   azureDevOpsPullRequestReadPermission,
   azureDevOpsPipelineReadPermission,

plugins/azure-devops/package.json

@@ -50,6 +50,7 @@
     "@backstage/frontend-plugin-api": "workspace:^",
     "@backstage/plugin-azure-devops-common": "workspace:^",
     "@backstage/plugin-catalog-react": "workspace:^",
+    "@backstage/plugin-permission-react": "workspace:^",
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
     "@types/react": "^16.13.1 || ^17.0.0 || ^18.0.0",

plugins/azure-devops/src/components/BuildTable/BuildTable.tsx

@@ -32,14 +32,12 @@ import {
   StatusWarning,
   Table,
   TableColumn,
-  EmptyState,
 } from '@backstage/core-components';
 
 import { AzurePipelinesIcon } from '../AzurePipelinesIcon';
 import { DateTime } from 'luxon';
 import React from 'react';
 import { getDurationFromDates } from '../../utils/getDurationFromDates';
-import { isAuthorizationError } from '../../utils';
 
 export const getBuildResultComponent = (result: number | undefined) => {
   switch (result) {
@@ -181,15 +179,6 @@ type BuildTableProps = {
 
 export const BuildTable = ({ items, loading, error }: BuildTableProps) => {
   if (error) {
-    if (isAuthorizationError(error)) {
-      return (
-        <EmptyState
-          missing="data"
-          title="No Buils to show"
-          description="You are not authorized!"
-        />
-      );
-    }
     return (
       <div>
         <ResponseErrorPanel error={error} />

plugins/azure-devops/src/components/EntityPageAzureGitTags/EntityPageAzureGitTags.tsx

@@ -14,7 +14,29 @@
  * limitations under the License.
  */
 
+import { azureDevOpsGitTagReadPermission } from '@backstage/plugin-azure-devops-common';
 import { GitTagTable } from '../GitTagTable/GitTagTable';
 import React from 'react';
+import { stringifyEntityRef } from '@backstage/catalog-model';
+import { useEntity } from '@backstage/plugin-catalog-react';
+import { RequirePermission } from '@backstage/plugin-permission-react';
+import { EmptyState } from '@backstage/core-components';
 
-export const EntityPageAzureGitTags = () => <GitTagTable />;
+export const EntityPageAzureGitTags = () => {
+  const { entity } = useEntity();
+  return (
+    <RequirePermission
+      permission={azureDevOpsGitTagReadPermission}
+      resourceRef={stringifyEntityRef(entity)}
+      errorPage={
+        <EmptyState
+          missing="data"
+          title="No Tags to show"
+          description="You are not authorized!"
+        />
+      }
+    >
+      <GitTagTable />
+    </RequirePermission>
+  );
+};

plugins/azure-devops/src/components/EntityPageAzurePipelines/EntityPageAzurePipelines.tsx

@@ -18,11 +18,29 @@ import { BuildTable } from '../BuildTable/BuildTable';
 import React from 'react';
 import { useBuildRuns } from '../../hooks';
 import { useEntity } from '@backstage/plugin-catalog-react';
+import { azureDevOpsPipelineReadPermission } from '@backstage/plugin-azure-devops-common';
+import { stringifyEntityRef } from '@backstage/catalog-model';
+import { RequirePermission } from '@backstage/plugin-permission-react';
+import { EmptyState } from '@backstage/core-components';
 
 export const EntityPageAzurePipelines = (props: { defaultLimit?: number }) => {
   const { entity } = useEntity();
 
   const { items, loading, error } = useBuildRuns(entity, props.defaultLimit);
 
-  return <BuildTable items={items} loading={loading} error={error} />;
+  return (
+    <RequirePermission
+      permission={azureDevOpsPipelineReadPermission}
+      resourceRef={stringifyEntityRef(entity)}
+      errorPage={
+        <EmptyState
+          missing="data"
+          title="No Buils to show"
+          description="You are not authorized!"
+        />
+      }
+    >
+      <BuildTable items={items} loading={loading} error={error} />
+    </RequirePermission>
+  );
 };

plugins/azure-devops/src/components/EntityPageAzurePullRequests/EntityPageAzurePullRequests.tsx

@@ -14,11 +14,31 @@
  * limitations under the License.
  */
 
+import { azureDevOpsPullRequestReadPermission } from '@backstage/plugin-azure-devops-common';
 import { PullRequestTable } from '../PullRequestTable/PullRequestTable';
 import React from 'react';
+import { RequirePermission } from '@backstage/plugin-permission-react';
+import { useEntity } from '@backstage/plugin-catalog-react';
+import { stringifyEntityRef } from '@backstage/catalog-model';
+import { EmptyState } from '@backstage/core-components';
 
 export const EntityPageAzurePullRequests = (props: {
   defaultLimit?: number;
 }) => {
-  return <PullRequestTable defaultLimit={props.defaultLimit} />;
+  const { entity } = useEntity();
+  return (
+    <RequirePermission
+      permission={azureDevOpsPullRequestReadPermission}
+      resourceRef={stringifyEntityRef(entity)}
+      errorPage={
+        <EmptyState
+          missing="data"
+          title="No Pull Requests to show"
+          description="You are not authorized!"
+        />
+      }
+    >
+      <PullRequestTable defaultLimit={props.defaultLimit} />
+    </RequirePermission>
+  );
 };

plugins/azure-devops/src/components/GitTagTable/GitTagTable.tsx

@@ -20,7 +20,6 @@ import {
   ResponseErrorPanel,
   Table,
   TableColumn,
-  EmptyState,
 } from '@backstage/core-components';
 import { GitTag } from '@backstage/plugin-azure-devops-common';
 import React from 'react';
@@ -28,7 +27,6 @@ import React from 'react';
 import { AzureGitTagsIcon } from '../AzureGitTagsIcon';
 import { useEntity } from '@backstage/plugin-catalog-react';
 import { useGitTags } from '../../hooks/useGitTags';
-import { isAuthorizationError } from '../../utils';
 
 const columns: TableColumn[] = [
   {
@@ -66,15 +64,6 @@ export const GitTagTable = () => {
   const { items, loading, error } = useGitTags(entity);
 
   if (error) {
-    if (isAuthorizationError(error)) {
-      return (
-        <EmptyState
-          missing="data"
-          title="No Tags to show"
-          description="You are not authorized!"
-        />
-      );
-    }
     return <ResponseErrorPanel error={error} />;
   }
 

plugins/azure-devops/src/components/PullRequestTable/PullRequestTable.tsx

@@ -21,7 +21,6 @@ import {
   ResponseErrorPanel,
   Table,
   TableColumn,
-  EmptyState,
 } from '@backstage/core-components';
 import {
   PullRequest,
@@ -34,7 +33,6 @@ import { DateTime } from 'luxon';
 import { PullRequestStatusButtonGroup } from '../PullRequestStatusButtonGroup';
 import { useEntity } from '@backstage/plugin-catalog-react';
 import { usePullRequests } from '../../hooks/usePullRequests';
-import { isAuthorizationError } from '../../utils';
 
 const columns: TableColumn[] = [
   {
@@ -106,15 +104,6 @@ export const PullRequestTable = ({ defaultLimit }: PullRequestTableProps) => {
   );
 
   if (error) {
-    if (isAuthorizationError(error)) {
-      return (
-        <EmptyState
-          missing="data"
-          title="No Pull Requests to show"
-          description="You are not authorized!"
-        />
-      );
-    }
     return <ResponseErrorPanel error={error} />;
   }
 

plugins/azure-devops/src/components/PullRequestsPage/PullRequestsPage.tsx

@@ -16,7 +16,6 @@
 
 import {
   Content,
-  EmptyState,
   Header,
   Page,
   Progress,
@@ -29,7 +28,6 @@ import { FilterType } from './lib/filters';
 import { PullRequestGrid } from './lib/PullRequestGrid';
 import { useDashboardPullRequests } from '../../hooks';
 import { useFilterProcessor } from './lib/hooks';
-import { isAuthorizationError } from '../../utils';
 
 type PullRequestsPageContentProps = {
   pullRequestGroups: PullRequestGroup[] | undefined;
@@ -47,15 +45,6 @@ const PullRequestsPageContent = ({
   }
 
   if (error) {
-    if (isAuthorizationError(error)) {
-      return (
-        <EmptyState
-          missing="data"
-          title="No Pull Requests to show"
-          description="You are not authorized!"
-        />
-      );
-    }
     return <ResponseErrorPanel error={error} />;
   }
 

plugins/azure-devops/src/components/ReadmeCard/ReadmeCard.tsx

@@ -28,7 +28,9 @@ import { useEntity } from '@backstage/plugin-catalog-react';
 import React from 'react';
 
 import { useReadme } from '../../hooks';
-import { isAuthorizationError } from '../../utils';
+import { RequirePermission } from '@backstage/plugin-permission-react';
+import { azureDevOpsReadmeReadPermission } from '@backstage/plugin-azure-devops-common';
+import { stringifyEntityRef } from '@backstage/catalog-model';
 
 const useStyles = makeStyles(theme => ({
   readMe: {
@@ -64,15 +66,7 @@ function isNotFoundError(error: any): boolean {
 }
 
 const ReadmeCardError = ({ error }: ErrorProps) => {
-  if (isAuthorizationError(error)) {
-    return (
-      <EmptyState
-        title="No README available for this entity"
-        missing="field"
-        description="You are not authorized!"
-      />
-    );
-  } else if (isNotFoundError(error)) {
+  if (isNotFoundError(error)) {
     return (
       <EmptyState
         title="No README available for this entity"
@@ -106,16 +100,28 @@ export const ReadmeCard = (props: Props) => {
   }
 
   return (
-    <InfoCard
-      title="Readme"
-      deepLink={{
-        link: value!.url,
-        title: 'Readme',
-      }}
+    <RequirePermission
+      permission={azureDevOpsReadmeReadPermission}
+      resourceRef={stringifyEntityRef(entity)}
+      errorPage={
+        <EmptyState
+          title="No README available for this entity"
+          missing="field"
+          description="You are not authorized!"
+        />
+      }
     >
-      <Box className={classes.readMe} sx={{ maxHeight: props.maxHeight }}>
-        <MarkdownContent content={value?.content ?? ''} />
-      </Box>
-    </InfoCard>
+      <InfoCard
+        title="Readme"
+        deepLink={{
+          link: value!.url,
+          title: 'Readme',
+        }}
+      >
+        <Box className={classes.readMe} sx={{ maxHeight: props.maxHeight }}>
+          <MarkdownContent content={value?.content ?? ''} />
+        </Box>
+      </InfoCard>
+    </RequirePermission>
   );
 };

plugins/azure-devops/src/utils/index.ts

@@ -18,4 +18,3 @@ export * from './arrayHas';
 export * from './equalsIgnoreCase';
 export * from './getDurationFromDates';
 export * from './getAnnotationValuesFromEntity';
-export * from './validateError';

plugins/azure-devops/src/utils/validateError.ts

@@ -1,18 +0,0 @@
-/*
- * Copyright 2024 The Backstage Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-export function isAuthorizationError(error: any): boolean {
-  return error?.response?.status === 403;
-}

yarn.lock

@@ -5164,6 +5164,7 @@ __metadata:
     "@backstage/frontend-plugin-api": "workspace:^"
     "@backstage/plugin-azure-devops-common": "workspace:^"
     "@backstage/plugin-catalog-react": "workspace:^"
+    "@backstage/plugin-permission-react": "workspace:^"
     "@backstage/test-utils": "workspace:^"
     "@material-ui/core": ^4.12.2
     "@material-ui/icons": ^4.9.1