From 1d65bd490d3c84fd694a71eeb7dfe76e5e9e8283 Mon Sep 17 00:00:00 2001 From: Adrian Ke Date: Tue, 3 Aug 2021 13:11:38 +0800 Subject: [PATCH] fix Techdocs feedback link breaking with Git subgroups in path Signed-off-by: Adrian Ke --- .changeset/techdocs-good-zoos-press.md | 5 +++ plugins/techdocs/package.json | 3 +- .../transformers/addGitFeedbackLink.test.ts | 37 ++++++++++++++++--- .../reader/transformers/addGitFeedbackLink.ts | 4 +- 4 files changed, 41 insertions(+), 8 deletions(-) create mode 100644 .changeset/techdocs-good-zoos-press.md diff --git a/.changeset/techdocs-good-zoos-press.md b/.changeset/techdocs-good-zoos-press.md new file mode 100644 index 0000000000..9a2b0cd9a5 --- /dev/null +++ b/.changeset/techdocs-good-zoos-press.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-techdocs': patch +--- + +Fix Techdocs feedback icon link for Gitlab URLs with subgroup(s) in path diff --git a/plugins/techdocs/package.json b/plugins/techdocs/package.json index be6cd4c344..9f063a0300 100644 --- a/plugins/techdocs/package.json +++ b/plugins/techdocs/package.json @@ -52,7 +52,8 @@ "react-router": "6.0.0-beta.0", "react-router-dom": "6.0.0-beta.0", "react-use": "^17.2.4", - "react-text-truncate": "^0.16.0" + "react-text-truncate": "^0.16.0", + "git-url-parse": "~11.4.4" }, "devDependencies": { "@backstage/cli": "^0.7.6", diff --git a/plugins/techdocs/src/reader/transformers/addGitFeedbackLink.test.ts b/plugins/techdocs/src/reader/transformers/addGitFeedbackLink.test.ts index 0b8e431781..6d82f585a4 100644 --- a/plugins/techdocs/src/reader/transformers/addGitFeedbackLink.test.ts +++ b/plugins/techdocs/src/reader/transformers/addGitFeedbackLink.test.ts @@ -35,7 +35,7 @@ describe('addGitFeedbackLink', () => { `, @@ -49,7 +49,32 @@ describe('addGitFeedbackLink', () => { expect( (shadowDom.querySelector('#git-feedback-link') as HTMLLinkElement)!.href, ).toEqual( - 'https://gitlab.com/reponame/username/issues/new?issue[title]=Documentation%20Feedback%3A%20HeaderText&issue[description]=Page%20source%3A%0Ahttps%3A%2F%2Fgitlab.com%2Freponame%2Fusername%2Fdocs%2FTestDoc.md%0A%0AFeedback%3A', + 'https://gitlab.com/groupname/reponame/issues/new?issue[title]=Documentation%20Feedback%3A%20HeaderText&issue[description]=Page%20source%3A%0Ahttps%3A%2F%2Fgitlab.com%2Fgroupname%2Freponame%2F-%2Fblob%2Fmaster%2Fdocs%2Fdocname.md%0A%0AFeedback%3A', + ); + }); + + it('adds a feedback link correctly when a Gitlab source edit link is available and contains a subgroup', async () => { + const shadowDom = await createTestShadowDom( + ` + + + + + `, + { + preTransformers: [addGitFeedbackLink(integrations)], + postTransformers: [], + }, + ); + + expect(shadowDom.querySelector('#git-feedback-link')).toBeTruthy(); + expect( + (shadowDom.querySelector('#git-feedback-link') as HTMLLinkElement)!.href, + ).toEqual( + 'https://gitlab.com/groupname/subgroupname/reponame/issues/new?issue[title]=Documentation%20Feedback%3A%20HeaderText&issue[description]=Page%20source%3A%0Ahttps%3A%2F%2Fgitlab.com%2Fgroupname%2Fsubgroupname%2Freponame%2F-%2Fblob%2Fmaster%2Fdocs%2Fdocname.md%0A%0AFeedback%3A', ); }); @@ -60,7 +85,7 @@ describe('addGitFeedbackLink', () => { `, @@ -74,7 +99,7 @@ describe('addGitFeedbackLink', () => { expect( (shadowDom.querySelector('#git-feedback-link') as HTMLLinkElement)!.href, ).toEqual( - 'https://github.com/reponame/username/issues/new?title=Documentation%20Feedback%3A%20HeaderText&body=Page%20source%3A%0Ahttps%3A%2F%2Fgithub.com%2Freponame%2Fusername%2Fdocs%2FTestDoc.md%0A%0AFeedback%3A', + 'https://github.com/groupname/reponame/issues/new?title=Documentation%20Feedback%3A%20HeaderText&body=Page%20source%3A%0Ahttps%3A%2F%2Fgithub.com%2Fgroupname%2Freponame%2Fblob%2Fmaster%2Fdocs%2Fdocname.md%0A%0AFeedback%3A', ); }); @@ -124,7 +149,7 @@ describe('addGitFeedbackLink', () => { `, @@ -138,7 +163,7 @@ describe('addGitFeedbackLink', () => { expect( (shadowDom.querySelector('#git-feedback-link') as HTMLLinkElement)!.href, ).toEqual( - 'https://self-hosted-git-hub-provider.com/reponame/username/issues/new?title=Documentation%20Feedback%3A%20HeaderText&body=Page%20source%3A%0Ahttps%3A%2F%2Fself-hosted-git-hub-provider.com%2Freponame%2Fusername%2Fdocs%2FTestDoc.md%0A%0AFeedback%3A', + 'https://self-hosted-git-hub-provider.com/groupname/reponame/issues/new?title=Documentation%20Feedback%3A%20HeaderText&body=Page%20source%3A%0Ahttps%3A%2F%2Fself-hosted-git-hub-provider.com%2Fgroupname%2Freponame%2Fblob%2Fmaster%2Fdocs%2Fdocname.md%0A%0AFeedback%3A', ); }); }); diff --git a/plugins/techdocs/src/reader/transformers/addGitFeedbackLink.ts b/plugins/techdocs/src/reader/transformers/addGitFeedbackLink.ts index f91ef5b78d..d998f6f8b1 100644 --- a/plugins/techdocs/src/reader/transformers/addGitFeedbackLink.ts +++ b/plugins/techdocs/src/reader/transformers/addGitFeedbackLink.ts @@ -19,6 +19,7 @@ import { ScmIntegrationRegistry } from '@backstage/integration'; import FeedbackOutlinedIcon from '@material-ui/icons/FeedbackOutlined'; import React from 'react'; import ReactDOM from 'react-dom'; +import parseGitUrl from 'git-url-parse'; // requires repo export const addGitFeedbackLink = ( @@ -50,7 +51,8 @@ export const addGitFeedbackLink = ( const issueDesc = encodeURIComponent( `Page source:\n${sourceAnchor.href}\n\nFeedback:`, ); - const repoPath = sourceURL.pathname.split('/').slice(0, 3).join('/'); + const gitInfo = parseGitUrl(sourceURL.pathname); + const repoPath = `/${gitInfo.organization}/${gitInfo.name}`; const feedbackLink = sourceAnchor.cloneNode() as HTMLAnchorElement; switch (integration?.type) {