Skip to content

Commit e981e56

Browse files
Link-redirect-fix (#1187)
* Link-redirect-fix * linting-not-working * resolved-the-conflicts * changed-the-sponsors-and-code_of_conduct-redirect * test-added-for-the-changes * made-the-component-flexible * fixed-the-test-issue * added-showEditOption-functionality
1 parent 82fb9c7 commit e981e56

File tree

33 files changed

+167
-113
lines changed

33 files changed

+167
-113
lines changed

components/DocsHelp.tsx

Lines changed: 44 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,34 @@ import React, { FormEvent, useRef, useState } from 'react';
33
import extractPathWithoutFragment from '~/lib/extractPathWithoutFragment';
44

55
interface DocsHelpProps {
6-
markdownFile?: string;
6+
fileRenderType?: '_indexmd' | 'indexmd' | 'tsx' | '_md' | string;
7+
showEditOption?: boolean;
78
}
8-
9-
export function DocsHelp({ markdownFile }: DocsHelpProps) {
9+
export function DocsHelp({
10+
fileRenderType,
11+
showEditOption = true,
12+
}: DocsHelpProps) {
1013
const router = useRouter();
11-
const path = encodeURIComponent(router.pathname);
1214
const [isFormOpen, setIsFormOpen] = useState(false);
1315
const [feedbackStatus, setFeedbackStatus] = useState('');
1416
const [isSubmitting, setIsSubmitting] = useState(false);
1517
const [error, setError] = useState('');
1618
const feedbackFormRef = useRef<HTMLFormElement>(null);
17-
19+
let gitredirect = '';
20+
if (
21+
typeof fileRenderType === 'string' &&
22+
fileRenderType.startsWith('https://')
23+
) {
24+
gitredirect = fileRenderType;
25+
} else if (fileRenderType === 'tsx') {
26+
gitredirect = `https://github.com/json-schema-org/website/blob/main/pages${extractPathWithoutFragment(router.asPath) + '/index.page.tsx'}`;
27+
} else if (fileRenderType === '_indexmd') {
28+
gitredirect = `https://github.com/json-schema-org/website/blob/main/pages${extractPathWithoutFragment(router.asPath) + '/_index.md'}`;
29+
} else if (fileRenderType === 'indexmd') {
30+
gitredirect = `https://github.com/json-schema-org/website/blob/main/pages${extractPathWithoutFragment(router.asPath) + '/index.md'}`;
31+
} else {
32+
gitredirect = `https://github.com/json-schema-org/website/blob/main/pages${extractPathWithoutFragment(router.asPath) + '.md'}`;
33+
}
1834
async function createFeedbackHandler(event: FormEvent) {
1935
event.preventDefault();
2036
const formData = new FormData(feedbackFormRef.current!);
@@ -296,28 +312,30 @@ export function DocsHelp({ markdownFile }: DocsHelpProps) {
296312
type of contribution!
297313
</p>
298314
</div>
299-
<div className='my-4 text-[14px]'>
300-
<a
301-
target='_blank'
302-
rel='noreferrer'
303-
className='px-[16px] py-[8px] cursor-pointer border-solid border-[#aaaaaa] border rounded-md hover:bg-gray-200 dark:hover:bg-gray-600'
304-
href={`https://github.com/json-schema-org/website/blob/main/pages${markdownFile ? (markdownFile === '_indexPage' ? extractPathWithoutFragment(router.asPath) + '/_index.md' : extractPathWithoutFragment(router.asPath) + '.md') : `/${path}/index.page.tsx`}`}
305-
data-test='edit-on-github-link'
306-
>
307-
<svg
308-
className='inline-block select-none align-text-bottom mr-1'
309-
aria-hidden='true'
310-
role='img'
311-
viewBox='0 0 16 16'
312-
width='16'
313-
height='16'
314-
fill='currentColor'
315+
{showEditOption && (
316+
<div className='my-4 text-[14px]'>
317+
<a
318+
target='_blank'
319+
rel='noreferrer'
320+
className='px-[16px] py-[8px] cursor-pointer border-solid border-[#aaaaaa] border rounded-md hover:bg-gray-200 dark:hover:bg-gray-600'
321+
href={gitredirect} // Ensure gitredirect is defined
322+
data-test='edit-on-github-link'
315323
>
316-
<path d='M1.5 3.25a2.25 2.25 0 1 1 3 2.122v5.256a2.251 2.251 0 1 1-1.5 0V5.372A2.25 2.25 0 0 1 1.5 3.25Zm5.677-.177L9.573.677A.25.25 0 0 1 10 .854V2.5h1A2.5 2.5 0 0 1 13.5 5v5.628a2.251 2.251 0 1 1-1.5 0V5a1 1 0 0 0-1-1h-1v1.646a.25.25 0 0 1-.427.177L7.177 3.427a.25.25 0 0 1 0-.354ZM3.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm0 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm8.25.75a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Z' />
317-
</svg>
318-
Edit this page on Github
319-
</a>
320-
</div>
324+
<svg
325+
className='inline-block select-none align-text-bottom mr-1'
326+
aria-hidden='true'
327+
role='img'
328+
viewBox='0 0 16 16'
329+
width='16'
330+
height='16'
331+
fill='currentColor'
332+
>
333+
<path d='M1.5 3.25a2.25 2.25 0 1 1 3 2.122v5.256a2.251 2.251 0 1 1-1.5 0V5.372A2.25 2.25 0 0 1 1.5 3.25Zm5.677-.177L9.573.677A.25.25 0 0 1 10 .854V2.5h1A2.5 2.5 0 0 1 13.5 5v5.628a2.251 2.251 0 1 1-1.5 0V5a1 1 0 0 0-1-1h-1v1.646a.25.25 0 0 1-.427.177L7.177 3.427a.25.25 0 0 1 0-.354ZM3.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm0 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm8.25.75a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Z' />
334+
</svg>
335+
Edit this page on Github
336+
</a>
337+
</div>
338+
)}
321339
<div className='my-2 text-[14px]'>
322340
<a
323341
target='_blank'

cypress/components/DocsHelp.cy.tsx

Lines changed: 59 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -20,50 +20,49 @@ const FEEDBACK_FORM_GITHUB_SUCCESS_MESSAGE =
2020
describe('DocsHelp Component', () => {
2121
// eslint-disable-next-line @typescript-eslint/no-unused-vars
2222
let mockRouter: MockRouter;
23+
const extractPathWithoutFragment = (path: any) => path.split('#')[0];
2324
// Note: we are not using the mockRouter in this test file, but it is required to mock the router in the component file
2425

2526
beforeEach(() => {
26-
const markdownFile = '_index';
27+
const fileRenderType = 'indexmd';
2728
mockRouter = mockNextRouter();
2829
cy.viewport(1200, 800);
29-
cy.mount(<DocsHelp markdownFile={markdownFile} />);
30+
cy.mount(<DocsHelp fileRenderType={fileRenderType} />);
3031
});
3132

3233
// should render the component correctly
3334
it('should render the component correctly', () => {
3435
// Check if the main component wrapper is present
36+
cy.mount(<DocsHelp />);
3537
cy.get(DOCS_HELP).should('exist');
3638

3739
// "Need Help?" header
3840
cy.get('[data-test="need-help-heading"]')
3941
.should('have.prop', 'tagName', 'H2')
40-
.and('contains', /Need Help?/i);
42+
.and('contain.text', 'Need Help?');
4143

4244
// Main feedback question
4345
cy.get('[data-test="feedback-main-heading"]')
4446
.should('have.prop', 'tagName', 'H3')
45-
.and('contains', /Did you find these docs helpful?/i);
47+
.and('contain.text', 'Did you find these docs helpful?');
4648

4749
// Feedback form element
4850
cy.get(FEEDBACK_FORM).should('have.prop', 'tagName', 'FORM');
4951

5052
// "Help us improve" section header
5153
cy.get('[data-test="contribute-docs-heading"]')
5254
.should('have.prop', 'tagName', 'H3')
53-
.and('contains', /Help us make our docs great!/i);
55+
.and('contain.text', 'Help us make our docs great!');
5456

5557
// Contribution encouragement text
5658
cy.get('[data-test="contribute-docs-description"]')
5759
.should('have.prop', 'tagName', 'P')
58-
.and(
59-
'contains',
60-
/At JSON Schema, we value docs contributions as much as every other type of contribution!/i,
61-
);
60+
.and('contain.text', 'At JSON Schema, we value docs contributions');
6261

6362
// "Edit on GitHub" link
6463
cy.get('[data-test="edit-on-github-link"]')
6564
.should('have.prop', 'tagName', 'A')
66-
.and('contains', /Edit this page on Github/i);
65+
.and('contain.text', 'Edit this page on Github');
6766

6867
// "Learn to contribute" link
6968
cy.get('[data-test="learn-to-contribute-link"]')
@@ -73,20 +72,17 @@ describe('DocsHelp Component', () => {
7372
'href',
7473
'https://github.com/json-schema-org/website/blob/main/CONTRIBUTING.md',
7574
)
76-
.and('contains', /Learn how to contribute/i);
75+
.and('contain.text', 'Learn how to contribute');
7776

7877
// "Still Need Help?" section header
7978
cy.get('[data-test="additional-help-heading"]')
8079
.should('have.prop', 'tagName', 'H3')
81-
.and('contains', /Still Need Help?/i);
80+
.and('contain.text', 'Still Need Help?');
8281

8382
// Additional help description
8483
cy.get('[data-test="additional-help-description"]')
8584
.should('have.prop', 'tagName', 'P')
86-
.should(
87-
'contains',
88-
/Learning JSON Schema is often confusing, but don't worry, we are here to help!./i,
89-
);
85+
.and('contain.text', 'Learning JSON Schema is often confusing');
9086

9187
// GitHub community link
9288
cy.get('[ data-test="ask-on-github-link"]')
@@ -96,7 +92,7 @@ describe('DocsHelp Component', () => {
9692
'href',
9793
'https://github.com/orgs/json-schema-org/discussions/new?category=q-a',
9894
)
99-
.and('contains', /Ask the community on GitHub/i);
95+
.and('contain.text', 'Ask the community on GitHub');
10096

10197
// Slack community link
10298
cy.get('[data-test="ask-on-slack-link"]')
@@ -237,15 +233,51 @@ describe('DocsHelp Component', () => {
237233
});
238234

239235
// This test is to check component render correctly with different markdown files
240-
it('should render component with different markdown files', () => {
241-
/* Note: Already checking with _index markdown file in the first test case */
242-
243-
// render with _indexPage markdown file
244-
const markdownFile = '_indexPage';
245-
cy.mount(<DocsHelp markdownFile={markdownFile} />);
246-
cy.get(DOCS_HELP).should('exist');
247-
248-
// render without any markdown file
249-
cy.mount(<DocsHelp />);
236+
it('should render component with different markdown files and validate gitredirect', () => {
237+
const fileRenderTypes: ('tsx' | 'indexmd' | '_indexmd' | '_md')[] = [
238+
'tsx',
239+
'_indexmd',
240+
'indexmd',
241+
'_md',
242+
];
243+
244+
fileRenderTypes.forEach((type) => {
245+
let expectedGitRedirect = '';
246+
if (typeof type === 'string' && type.startsWith('https://')) {
247+
expectedGitRedirect = type;
248+
} else if (type === 'tsx') {
249+
expectedGitRedirect = `https://github.com/json-schema-org/website/blob/main/pages${extractPathWithoutFragment(mockRouter.asPath) + '/index.page.tsx'}`;
250+
} else if (type === '_indexmd') {
251+
expectedGitRedirect = `https://github.com/json-schema-org/website/blob/main/pages${extractPathWithoutFragment(mockRouter.asPath) + '/_index.md'}`;
252+
} else if (type === 'indexmd') {
253+
expectedGitRedirect = `https://github.com/json-schema-org/website/blob/main/pages${extractPathWithoutFragment(mockRouter.asPath) + '/index.md'}`;
254+
} else {
255+
expectedGitRedirect = `https://github.com/json-schema-org/website/blob/main/pages${extractPathWithoutFragment(mockRouter.asPath) + '.md'}`;
256+
}
257+
cy.mount(<DocsHelp fileRenderType={type} />);
258+
259+
cy.get('[data-test="edit-on-github-link"]').should(
260+
'have.attr',
261+
'href',
262+
expectedGitRedirect,
263+
);
264+
});
265+
const customLink = 'https://example.com/custom-docs';
266+
cy.mount(<DocsHelp fileRenderType={customLink} />);
267+
cy.get('[data-test="edit-on-github-link"]').should(
268+
'have.attr',
269+
'href',
270+
customLink,
271+
);
272+
});
273+
// Check if the "Edit on GitHub" link is present when showEditOption is true
274+
it('should render the "Edit on GitHub" link when showEditOption is true', () => {
275+
cy.mount(<DocsHelp fileRenderType='indexmd' showEditOption={true} />);
276+
cy.get('[data-test="edit-on-github-link"]').should('exist');
277+
});
278+
// Check if the "Edit on GitHub" link is not present when showEditOption is false
279+
it('should not render the "Edit on GitHub" link when showEditOption is false', () => {
280+
cy.mount(<DocsHelp fileRenderType='indexmd' showEditOption={false} />);
281+
cy.get('[data-test="edit-on-github-link"]').should('not.exist');
250282
});
251283
});

pages/[slug].page.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ export default function StaticMarkdownPage({
2323
frontmatter: any;
2424
content: any;
2525
}) {
26-
const markdownFile = '_index';
26+
const fileRenderType = '_md';
2727
const newTitle = 'JSON Schema - ' + frontmatter.title;
2828
return (
2929
<SectionContext.Provider value={frontmatter.section || null}>
@@ -38,7 +38,7 @@ export default function StaticMarkdownPage({
3838
nextLabel={frontmatter?.next?.label}
3939
nextURL={frontmatter?.next?.url}
4040
/>
41-
<DocsHelp markdownFile={markdownFile} />
41+
<DocsHelp fileRenderType={fileRenderType} />
4242
</SectionContext.Provider>
4343
);
4444
}

pages/docs/index.page.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import { DocsHelp } from '~/components/DocsHelp';
88

99
export default function Welcome() {
1010
const newTitle = 'Welcome';
11+
const fileRenderType = 'tsx';
1112
return (
1213
<SectionContext.Provider value='docs'>
1314
<Head>
@@ -56,7 +57,7 @@ export default function Welcome() {
5657
link='/specification'
5758
/>
5859
</div>
59-
<DocsHelp />
60+
<DocsHelp fileRenderType={fileRenderType} />
6061
</SectionContext.Provider>
6162
);
6263
}

pages/draft-05/index.page.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,13 +33,14 @@ export default function ImplementationsPages({
3333
blocks: any;
3434
frontmatter: any;
3535
}) {
36+
const fileRenderType = 'indexmd';
3637
return (
3738
<SectionContext.Provider value={null}>
3839
<Headline1>{frontmatter.title}</Headline1>
3940
<DocTable frontmatter={frontmatter} />
4041
<StyledMarkdown markdown={blocks.index} />
4142
<StyledMarkdown markdown={blocks.body} />
42-
<DocsHelp />
43+
<DocsHelp fileRenderType={fileRenderType} />
4344
</SectionContext.Provider>
4445
);
4546
}

pages/draft-06/[slug].page.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ export default function StaticMarkdownPage({
2222
frontmatter: any;
2323
content: any;
2424
}) {
25-
const markdownFile = '_index';
25+
const fileRenderType = '_md';
2626
const newTitle = 'JSON Schema - ' + frontmatter.title;
2727

2828
return (
@@ -32,7 +32,7 @@ export default function StaticMarkdownPage({
3232
</Head>
3333
<Headline1>{frontmatter.title}</Headline1>
3434
<StyledMarkdown markdown={content} />
35-
<DocsHelp markdownFile={markdownFile} />
35+
<DocsHelp fileRenderType={fileRenderType} />
3636
</SectionContext.Provider>
3737
);
3838
}

pages/draft-06/index.page.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,12 +31,13 @@ export default function ImplementationsPages({
3131
blocks: any;
3232
frontmatter: any;
3333
}) {
34+
const fileRenderType = 'indexmd';
3435
return (
3536
<SectionContext.Provider value={null}>
3637
<Headline1>{frontmatter.title}</Headline1>
3738
<DocTable frontmatter={frontmatter} />
3839
<StyledMarkdown markdown={blocks.index} />
39-
<DocsHelp />
40+
<DocsHelp fileRenderType={fileRenderType} />
4041
</SectionContext.Provider>
4142
);
4243
}

pages/draft-07/[slug].page.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ export default function StaticMarkdownPage({
2222
frontmatter: any;
2323
content: any;
2424
}) {
25-
const markdownFile = '_index';
25+
const fileRenderType = '_md';
2626
const newTitle = 'JSON Schema - ' + frontmatter.title;
2727

2828
return (
@@ -32,7 +32,7 @@ export default function StaticMarkdownPage({
3232
</Head>
3333
<Headline1>{frontmatter.title}</Headline1>
3434
<StyledMarkdown markdown={content} />
35-
<DocsHelp markdownFile={markdownFile} />
35+
<DocsHelp fileRenderType={fileRenderType} />
3636
</SectionContext.Provider>
3737
);
3838
}

pages/draft-07/index.page.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,12 +31,13 @@ export default function ImplementationsPages({
3131
blocks: any;
3232
frontmatter: any;
3333
}) {
34+
const fileRenderType = 'indexmd';
3435
return (
3536
<SectionContext.Provider value={null}>
3637
<Headline1>{frontmatter.title}</Headline1>
3738
<DocTable frontmatter={frontmatter} />
3839
<StyledMarkdown markdown={blocks.index} />
39-
<DocsHelp />
40+
<DocsHelp fileRenderType={fileRenderType} />
4041
</SectionContext.Provider>
4142
);
4243
}

pages/draft/2019-09/[slug].page.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ export default function StaticMarkdownPage({
2222
frontmatter: any;
2323
content: any;
2424
}) {
25-
const markdownFile = '_index';
25+
const fileRenderType = '_md';
2626
const newTitle = 'JSON Schema - ' + frontmatter.title;
2727

2828
return (
@@ -32,7 +32,7 @@ export default function StaticMarkdownPage({
3232
</Head>
3333
<Headline1>{frontmatter.title}</Headline1>
3434
<StyledMarkdown markdown={content} />
35-
<DocsHelp markdownFile={markdownFile} />
35+
<DocsHelp fileRenderType={fileRenderType} />
3636
</SectionContext.Provider>
3737
);
3838
}

0 commit comments

Comments
 (0)