fix(extensions): make configuration and authorization api calls only if plugin name is passed (#1916)

* make plugin configuration and authorization api calls only when a plugin name is passed

* add types for pluginPermissions

Author: karthikjeeyar

workspaces/marketplace/.changeset/wild-poets-pump.md

@@ -0,0 +1,5 @@
+---
+'@red-hat-developer-hub/backstage-plugin-marketplace': patch
+---
+
+add checks to plugin authorization and configuration API calls

workspaces/marketplace/plugins/marketplace/src/components/MarketplacePluginContent.tsx

@@ -70,6 +70,7 @@ import { useExtensionsConfiguration } from '../hooks/useExtensionsConfiguration'
 import { usePluginConfigurationPermissions } from '../hooks/usePluginConfigurationPermissions';
 import { useNodeEnvironment } from '../hooks/useNodeEnvironment';
 import { getPluginActionTooltipMessage } from '../utils';
+import { Permission } from '../types';
 
 import { BadgeChip } from './Badges';
 import { PluginIcon } from './PluginIcon';
@@ -437,8 +438,8 @@ export const MarketplacePluginContent = ({
     const tooltipMessage = getPluginActionTooltipMessage(
       isProductionEnvironment,
       {
-        read: pluginConfigPerm.data?.read ?? 'DENY',
-        write: pluginConfigPerm.data?.write ?? 'DENY',
+        read: pluginConfigPerm.data?.read ?? Permission.DENY,
+        write: pluginConfigPerm.data?.write ?? Permission.DENY,
       },
       t,
       !extensionsConfig.data?.enabled,

workspaces/marketplace/plugins/marketplace/src/components/MarketplacePluginInstallContent.tsx

@@ -62,6 +62,7 @@ import {
   getPluginActionTooltipMessage,
   isPluginInstalled,
 } from '../utils';
+import { Permission } from '../types';
 
 import { CodeEditorContextProvider, useCodeEditor } from './CodeEditor';
 import {
@@ -301,7 +302,7 @@ export const MarketplacePluginInstallContent = ({
   const isInstallDisabled =
     isProductionEnvironment ||
     installationError ||
-    pluginConfigPermissions.data?.write !== 'ALLOW' ||
+    pluginConfigPermissions.data?.write !== Permission.ALLOW ||
     (pluginConfig.data as any)?.error ||
     !extensionsConfig?.data?.enabled ||
     isSubmitting ||
@@ -311,8 +312,8 @@ export const MarketplacePluginInstallContent = ({
   const installTooltip = getPluginActionTooltipMessage(
     isProductionEnvironment,
     {
-      read: pluginConfigPermissions.data?.read ?? 'DENY',
-      write: pluginConfigPermissions.data?.write ?? 'DENY',
+      read: pluginConfigPermissions.data?.read ?? Permission.DENY,
+      write: pluginConfigPermissions.data?.write ?? Permission.DENY,
     },
     t,
     !extensionsConfig?.data?.enabled,
@@ -544,8 +545,8 @@ export const MarketplacePluginInstallContent = ({
           >
             {isInstallDisabled ? t('install.back') : t('install.cancel')}
           </Button>
-          {(pluginConfigPermissions.data?.write === 'ALLOW' ||
-            pluginConfigPermissions.data?.read === 'ALLOW') && (
+          {(pluginConfigPermissions.data?.write === Permission.ALLOW ||
+            pluginConfigPermissions.data?.read === Permission.ALLOW) && (
             <Button
               variant="text"
               color="primary"

workspaces/marketplace/plugins/marketplace/src/hooks/usePackageConfig.test.tsx

@@ -0,0 +1,151 @@
+/*
+ * Copyright 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.
+ */
+
+import { renderHook, waitFor } from '@testing-library/react';
+import { useQuery } from '@tanstack/react-query';
+
+import { usePackageConfig } from './usePackageConfig';
+
+jest.mock('@backstage/core-plugin-api', () => ({
+  ...jest.requireActual('@backstage/core-plugin-api'),
+  useApi: jest.fn(),
+}));
+
+jest.mock('@tanstack/react-query', () => ({
+  ...jest.requireActual('@tanstack/react-query'),
+  useQuery: jest.fn(),
+}));
+
+describe('usePackageConfig', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('returns package config when namespace and name are provided', async () => {
+    const mockConfig = { configYaml: 'key: value\nother: config' };
+    (useQuery as jest.Mock).mockReturnValue({
+      data: mockConfig,
+      isLoading: false,
+      error: undefined,
+    });
+
+    const { result } = renderHook(() =>
+      usePackageConfig('default', 'my-package'),
+    );
+
+    await waitFor(() => expect(result.current.isLoading).toBe(false));
+    expect(result.current.data).toEqual(mockConfig);
+    expect(result.current.error).toBeUndefined();
+  });
+
+  it('returns null when namespace is empty', async () => {
+    (useQuery as jest.Mock).mockReturnValue({
+      data: null,
+      isLoading: false,
+      error: undefined,
+    });
+
+    const { result } = renderHook(() => usePackageConfig('', 'my-package'));
+
+    await waitFor(() => expect(result.current.isLoading).toBe(false));
+    expect(result.current.data).toBeNull();
+  });
+
+  it('returns null when name is empty', async () => {
+    (useQuery as jest.Mock).mockReturnValue({
+      data: null,
+      isLoading: false,
+      error: undefined,
+    });
+
+    const { result } = renderHook(() => usePackageConfig('default', ''));
+
+    await waitFor(() => expect(result.current.isLoading).toBe(false));
+    expect(result.current.data).toBeNull();
+  });
+
+  it('handles loading state', async () => {
+    (useQuery as jest.Mock).mockReturnValue({
+      data: undefined,
+      isLoading: true,
+      error: undefined,
+    });
+
+    const { result } = renderHook(() =>
+      usePackageConfig('default', 'my-package'),
+    );
+
+    expect(result.current.isLoading).toBe(true);
+    expect(result.current.data).toBeUndefined();
+  });
+
+  it('handles error state', async () => {
+    const error = new Error('Failed to fetch package config');
+    (useQuery as jest.Mock).mockReturnValue({
+      data: undefined,
+      isLoading: false,
+      error,
+    });
+
+    const { result } = renderHook(() =>
+      usePackageConfig('default', 'my-package'),
+    );
+
+    await waitFor(() => expect(result.current.isLoading).toBe(false));
+    expect(result.current.error).toBeInstanceOf(Error);
+    expect(result.current.error?.message).toBe(
+      'Failed to fetch package config',
+    );
+  });
+
+  it('uses correct query key with namespace and name', () => {
+    (useQuery as jest.Mock).mockReturnValue({
+      data: { configYaml: '' },
+      isLoading: false,
+      error: undefined,
+    });
+
+    renderHook(() => usePackageConfig('my-namespace', 'my-package'));
+
+    expect(useQuery).toHaveBeenCalledWith(
+      expect.objectContaining({
+        queryKey: [
+          'marketplaceApi',
+          'getPackageConfigByName',
+          'my-namespace',
+          'my-package',
+        ],
+        refetchOnWindowFocus: false,
+      }),
+    );
+  });
+
+  it('disables refetch on window focus', () => {
+    (useQuery as jest.Mock).mockReturnValue({
+      data: { configYaml: '' },
+      isLoading: false,
+      error: undefined,
+    });
+
+    renderHook(() => usePackageConfig('default', 'my-package'));
+
+    expect(useQuery).toHaveBeenCalledWith(
+      expect.objectContaining({
+        refetchOnWindowFocus: false,
+      }),
+    );
+  });
+});

workspaces/marketplace/plugins/marketplace/src/hooks/usePackageConfig.ts

@@ -21,7 +21,12 @@ export const usePackageConfig = (namespace: string, name: string) => {
   const marketplaceApi = useMarketplaceApi();
   return useQuery({
     queryKey: ['marketplaceApi', 'getPackageConfigByName', namespace, name],
-    queryFn: () => marketplaceApi.getPackageConfigByName?.(namespace, name),
+    queryFn: () => {
+      if (namespace && name) {
+        return marketplaceApi.getPackageConfigByName?.(namespace, name);
+      }
+      return null;
+    },
     refetchOnWindowFocus: false,
   });
 };

workspaces/marketplace/plugins/marketplace/src/hooks/usePluginConfigurationPermissions.test.tsx

@@ -0,0 +1,152 @@
+/*
+ * Copyright 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.
+ */
+
+import { renderHook, waitFor } from '@testing-library/react';
+import { useQuery } from '@tanstack/react-query';
+
+import { usePluginConfigurationPermissions } from './usePluginConfigurationPermissions';
+
+jest.mock('@backstage/core-plugin-api', () => ({
+  ...jest.requireActual('@backstage/core-plugin-api'),
+  useApi: jest.fn(),
+}));
+
+jest.mock('@tanstack/react-query', () => ({
+  ...jest.requireActual('@tanstack/react-query'),
+  useQuery: jest.fn(),
+}));
+
+describe('usePluginConfigurationPermissions', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('returns read and write permissions when namespace and name are provided', async () => {
+    (useQuery as jest.Mock).mockReturnValue({
+      data: { read: 'ALLOW', write: 'ALLOW' },
+      isLoading: false,
+      error: undefined,
+    });
+
+    const { result } = renderHook(() =>
+      usePluginConfigurationPermissions('default', 'my-plugin'),
+    );
+
+    await waitFor(() => expect(result.current.isLoading).toBe(false));
+    expect(result.current.data).toEqual({ read: 'ALLOW', write: 'ALLOW' });
+    expect(result.current.error).toBeUndefined();
+  });
+
+  it('returns DENY permissions when namespace is empty', async () => {
+    (useQuery as jest.Mock).mockReturnValue({
+      data: { read: 'DENY', write: 'DENY' },
+      isLoading: false,
+      error: undefined,
+    });
+
+    const { result } = renderHook(() =>
+      usePluginConfigurationPermissions('', 'my-plugin'),
+    );
+
+    await waitFor(() => expect(result.current.isLoading).toBe(false));
+    expect(result.current.data).toEqual({ read: 'DENY', write: 'DENY' });
+  });
+
+  it('returns DENY permissions when name is empty', async () => {
+    (useQuery as jest.Mock).mockReturnValue({
+      data: { read: 'DENY', write: 'DENY' },
+      isLoading: false,
+      error: undefined,
+    });
+
+    const { result } = renderHook(() =>
+      usePluginConfigurationPermissions('default', ''),
+    );
+
+    await waitFor(() => expect(result.current.isLoading).toBe(false));
+    expect(result.current.data).toEqual({ read: 'DENY', write: 'DENY' });
+  });
+
+  it('returns read-only permissions', async () => {
+    (useQuery as jest.Mock).mockReturnValue({
+      data: { read: 'ALLOW', write: 'DENY' },
+      isLoading: false,
+      error: undefined,
+    });
+
+    const { result } = renderHook(() =>
+      usePluginConfigurationPermissions('default', 'my-plugin'),
+    );
+
+    await waitFor(() => expect(result.current.isLoading).toBe(false));
+    expect(result.current.data).toEqual({ read: 'ALLOW', write: 'DENY' });
+  });
+
+  it('handles loading state', async () => {
+    (useQuery as jest.Mock).mockReturnValue({
+      data: undefined,
+      isLoading: true,
+      error: undefined,
+    });
+
+    const { result } = renderHook(() =>
+      usePluginConfigurationPermissions('default', 'my-plugin'),
+    );
+
+    expect(result.current.isLoading).toBe(true);
+    expect(result.current.data).toBeUndefined();
+  });
+
+  it('handles error state', async () => {
+    const error = new Error('Failed to fetch permissions');
+    (useQuery as jest.Mock).mockReturnValue({
+      data: undefined,
+      isLoading: false,
+      error,
+    });
+
+    const { result } = renderHook(() =>
+      usePluginConfigurationPermissions('default', 'my-plugin'),
+    );
+
+    await waitFor(() => expect(result.current.isLoading).toBe(false));
+    expect(result.current.error).toBeInstanceOf(Error);
+    expect(result.current.error?.message).toBe('Failed to fetch permissions');
+  });
+
+  it('uses correct query key with namespace and name', () => {
+    (useQuery as jest.Mock).mockReturnValue({
+      data: { read: 'ALLOW', write: 'ALLOW' },
+      isLoading: false,
+      error: undefined,
+    });
+
+    renderHook(() =>
+      usePluginConfigurationPermissions('my-namespace', 'my-plugin'),
+    );
+
+    expect(useQuery).toHaveBeenCalledWith(
+      expect.objectContaining({
+        queryKey: [
+          'marketplaceApi',
+          'getPluginConfigAuthorization',
+          'my-namespace',
+          'my-plugin',
+        ],
+      }),
+    );
+  });
+});