diff --git a/public/app/features/plugins/admin/components/PluginDetailsPanel.test.tsx b/public/app/features/plugins/admin/components/PluginDetailsPanel.test.tsx
index 37c484caf1c..9bfec128241 100644
--- a/public/app/features/plugins/admin/components/PluginDetailsPanel.test.tsx
+++ b/public/app/features/plugins/admin/components/PluginDetailsPanel.test.tsx
@@ -71,12 +71,16 @@ const mockPlugin: CatalogPlugin = {
url: 'https://github.com/grafana/test-plugin/issues/new',
},
],
+ raiseAnIssueUrl: 'https://github.com/grafana/test-plugin/issues/new',
+ documentationUrl: 'https://test-plugin.com/docs',
+ licenseUrl: 'https://github.com/grafana/test-plugin/blob/main/LICENSE',
grafanaDependency: '>=9.0.0',
statusContext: 'stable',
},
angularDetected: false,
isFullyInstalled: true,
accessControl: {},
+ url: 'https://github.com/grafana/test-plugin',
};
const mockInfo = [
@@ -137,10 +141,11 @@ describe('PluginDetailsPanel', () => {
it('should render license, documentation, repository, raise issue links', () => {
render();
- const repositoryLink = screen.getByText('Repository');
- const licenseLink = screen.getByText('License');
- const documentationLink = screen.getByText('Documentation');
- const raiseIssueLink = screen.getByText('Raise issue');
+ const repositoryLink = screen.getByTestId('plugin-details-repository-link');
+ const licenseLink = screen.getByTestId('plugin-details-license-link');
+ const documentationLink = screen.getByTestId('plugin-details-documentation-link');
+ const raiseIssueLink = screen.getByTestId('plugin-details-raise-issue-link');
+
expect(repositoryLink).toBeInTheDocument();
expect(repositoryLink).toHaveAttribute('href', 'https://github.com/grafana/test-plugin');
expect(licenseLink).toBeInTheDocument();
@@ -150,4 +155,29 @@ describe('PluginDetailsPanel', () => {
expect(raiseIssueLink).toBeInTheDocument();
expect(raiseIssueLink).toHaveAttribute('href', 'https://github.com/grafana/test-plugin/issues/new');
});
+
+ it('should not render license, documentation, repository, raise issue links in custom links', () => {
+ render();
+ const repositoryLink = screen.getByTestId('plugin-details-repository-link');
+ const licenseLink = screen.getByTestId('plugin-details-license-link');
+ const documentationLink = screen.getByTestId('plugin-details-documentation-link');
+ const raiseIssueLink = screen.getByTestId('plugin-details-raise-issue-link');
+ const websiteLink = screen.getByText('Website');
+
+ const customLinks = screen.getByTestId('plugin-details-custom-links');
+
+ expect(customLinks).not.toContainElement(repositoryLink);
+ expect(customLinks).not.toContainElement(licenseLink);
+ expect(customLinks).not.toContainElement(documentationLink);
+ expect(customLinks).not.toContainElement(raiseIssueLink);
+ expect(customLinks).toContainElement(websiteLink);
+
+ const regularLinks = screen.getByTestId('plugin-details-regular-links');
+
+ expect(regularLinks).toContainElement(repositoryLink);
+ expect(regularLinks).toContainElement(licenseLink);
+ expect(regularLinks).toContainElement(documentationLink);
+ expect(regularLinks).toContainElement(raiseIssueLink);
+ expect(regularLinks).not.toContainElement(websiteLink);
+ });
});
diff --git a/public/app/features/plugins/admin/components/PluginDetailsPanel.tsx b/public/app/features/plugins/admin/components/PluginDetailsPanel.tsx
index 8440b37c76d..1421245d721 100644
--- a/public/app/features/plugins/admin/components/PluginDetailsPanel.tsx
+++ b/public/app/features/plugins/admin/components/PluginDetailsPanel.tsx
@@ -35,12 +35,18 @@ export function PluginDetailsPanel(props: Props): React.ReactElement | null {
const normalizeURL = (url: string | undefined) => url?.replace(/\/$/, '');
const customLinks = plugin.details?.links?.filter((link) => {
- const customLinksFiltered = ![plugin.url, plugin.details?.licenseUrl, plugin.details?.documentationUrl]
+ const customLinksFiltered = ![
+ plugin.url,
+ plugin.details?.licenseUrl,
+ plugin.details?.documentationUrl,
+ plugin.details?.raiseAnIssueUrl,
+ ]
.map(normalizeURL)
.includes(normalizeURL(link.url));
return customLinksFiltered;
});
- const shouldRenderLinks = plugin.url || plugin.details?.licenseUrl || plugin.details?.documentationUrl;
+ const shouldRenderLinks =
+ plugin.url || plugin.details?.licenseUrl || plugin.details?.documentationUrl || plugin.details?.raiseAnIssueUrl;
const styles = useStyles2(getStyles);
@@ -92,10 +98,17 @@ export function PluginDetailsPanel(props: Props): React.ReactElement | null {
{shouldRenderLinks && (
<>
-
+
{plugin.url && (
-
+
Repository
)}
@@ -106,6 +119,7 @@ export function PluginDetailsPanel(props: Props): React.ReactElement | null {
fill="solid"
icon="bug"
target="_blank"
+ data-testid="plugin-details-raise-issue-link"
>
Raise an issue
@@ -117,6 +131,7 @@ export function PluginDetailsPanel(props: Props): React.ReactElement | null {
fill="solid"
icon={'document-info'}
target="_blank"
+ data-testid="plugin-details-license-link"
>
License
@@ -128,6 +143,7 @@ export function PluginDetailsPanel(props: Props): React.ReactElement | null {
fill="solid"
icon={'list-ui-alt'}
target="_blank"
+ data-testid="plugin-details-documentation-link"
>
Documentation
@@ -137,7 +153,7 @@ export function PluginDetailsPanel(props: Props): React.ReactElement | null {
>
)}
{customLinks && customLinks?.length > 0 && (
-
+