Skip to content

Commit 49a552c

Browse files
author
Strek
authored
Fix prettier CI and add it to pre commit (#4100)
* Add prettier before commit and during CI * Add workflow * Reverse merge main to branch * dry run prettier * dry run prettier * [warn] jsxBracketSameLine is deprecated so replaced it to bracketSameLine * Revert "[warn] jsxBracketSameLine is deprecated so replaced it to bracketSameLine" This reverts commit 43dbe9ed3fba10b03a90d989cf90b4af4efd2212. * Revert "dry run prettier" This reverts commit b62948042cd8f8addf8ee23110de4096a8630926. * Revert "dry run prettier" This reverts commit 382f9a4691dee04673e461b3eda0d52c1aefda3b. * Revert "Reverse merge main to branch" This reverts commit 43667eaf29b9ab4266397251c8d781f611dcdcf8. * [warn] jsxBracketSameLine is deprecated so replaced it to bracketSameLine
1 parent ea086bd commit 49a552c

File tree

13 files changed

+142
-107
lines changed

13 files changed

+142
-107
lines changed

‎.github/workflows/beta_site_lint.yml

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
name: Beta Site Lint
2+
3+
on:
4+
pull_request:
5+
types: [opened, synchronize, reopened]
6+
7+
jobs:
8+
lint:
9+
runs-on: ubuntu-latest
10+
11+
name: Lint on node 12.x and ubuntu-latest
12+
13+
steps:
14+
- uses: actions/checkout@v1
15+
- name: Use Node.js 12.x
16+
uses: actions/setup-node@v1
17+
with:
18+
node-version: 12.x
19+
20+
- name: Install deps and build (with cache)
21+
uses: bahmutov/[email protected]
22+
with:
23+
working-directory: 'beta'
24+
25+
26+
- name: Lint codebase
27+
run: cd beta && yarn ci-check

‎beta/.husky/pre-commit

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,4 +4,5 @@
44
cd beta
55
yarn generate-ids
66
git add -u src/pages/**/*.md
7-
yarn lint:fix
7+
yarn prettier
8+
yarn lint:fix

‎beta/.prettierrc

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"bracketSpacing": false,
33
"singleQuote": true,
4-
"jsxBracketSameLine": true,
4+
"bracketSameLine": true,
55
"trailingComma": "es5",
66
"printWidth": 80
77
}

‎beta/plugins/remark-header-custom-ids.js

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -36,27 +36,27 @@ module.exports = ({
3636
// A bit weird: this is to support MDX 2 comments in expressions,
3737
// while we’re still on MDX 1, which doesn’t support them.
3838
if (!tail || tail.type !== 'text' || tail.value !== '/}') {
39-
return
39+
return;
4040
}
4141

42-
tail = children[children.length - 2]
42+
tail = children[children.length - 2];
4343

4444
if (!tail && tail.type !== 'emphasis') {
45-
return
45+
return;
4646
}
4747

48-
const id = toString(tail)
48+
const id = toString(tail);
4949

50-
tail = children[children.length - 3]
50+
tail = children[children.length - 3];
5151

5252
if (!tail || tail.type !== 'text' || !tail.value.endsWith('{/')) {
53-
return
53+
return;
5454
}
5555

5656
// Remove the emphasis and trailing `/}`
57-
children.splice(children.length - 2, 2)
57+
children.splice(children.length - 2, 2);
5858
// Remove the `{/`
59-
tail.value = tail.value.replace(/[ \t]*\{\/$/, '')
59+
tail.value = tail.value.replace(/[ \t]*\{\/$/, '');
6060

6161
const data = patch(node, 'data', {});
6262

‎beta/src/components/Button.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,8 +32,10 @@ export function Button({
3232
className,
3333
'text-base leading-tight font-bold border rounded-lg py-2 px-4 focus:ring-1 focus:ring-offset-2 focus:ring-link active:bg-link active:border-link active:text-white active:ring-0 active:ring-offset-0 outline-none inline-flex items-center my-1',
3434
{
35-
'bg-link border-link text-white hover:bg-link focus:bg-link active:bg-link': active,
36-
'bg-transparent text-secondary dark:text-secondary-dark bg-secondary-button dark:bg-secondary-button-dark hover:text-link focus:text-link border-transparent': !active,
35+
'bg-link border-link text-white hover:bg-link focus:bg-link active:bg-link':
36+
active,
37+
'bg-transparent text-secondary dark:text-secondary-dark bg-secondary-button dark:bg-secondary-button-dark hover:text-link focus:text-link border-transparent':
38+
!active,
3739
}
3840
)}>
3941
{children}

‎beta/src/components/Layout/Nav/MobileNav.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -74,7 +74,8 @@ function TabButton({
7474
const classes = cn(
7575
'inline-flex items-center w-full border-b-2 justify-center text-base leading-9 px-3 py-0.5 hover:text-link hover:gray-5',
7676
{
77-
'text-link dark:text-link-dark dark:border-link-dark border-link font-bold': isActive,
77+
'text-link dark:text-link-dark dark:border-link-dark border-link font-bold':
78+
isActive,
7879
'border-transparent': !isActive,
7980
}
8081
);

‎beta/src/components/Layout/Nav/NavLink.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,8 @@ interface NavLinkProps {
1616
export default function NavLink({href, children, isActive}: NavLinkProps) {
1717
const classes = cn(
1818
{
19-
'text-link border-link dark:text-link-dark dark:border-link-dark font-bold': isActive,
19+
'text-link border-link dark:text-link-dark dark:border-link-dark font-bold':
20+
isActive,
2021
},
2122
{'border-transparent': !isActive},
2223
'inline-flex w-full items-center border-b-2 justify-center text-base leading-9 px-3 py-0.5 hover:text-link dark:hover:text-link-dark whitespace-nowrap'

‎beta/src/components/Layout/Sidebar/SidebarLink.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,8 @@ export function SidebarLink({
6565
'dark:text-primary-dark text-primary': heading,
6666
'text-base text-secondary dark:text-secondary-dark':
6767
!selected && !heading,
68-
'text-base text-link dark:text-link-dark bg-highlight dark:bg-highlight-dark border-blue-40 hover:bg-highlight hover:text-link dark:hover:bg-highlight-dark dark:hover:text-link-dark': selected,
68+
'text-base text-link dark:text-link-dark bg-highlight dark:bg-highlight-dark border-blue-40 hover:bg-highlight hover:text-link dark:hover:bg-highlight-dark dark:hover:text-link-dark':
69+
selected,
6970
}
7071
)}>
7172
{title}

‎beta/src/components/MDX/CodeBlock/CodeBlock.tsx

Lines changed: 79 additions & 83 deletions
Original file line numberDiff line numberDiff line change
@@ -21,94 +21,90 @@ interface InlineHiglight {
2121
endColumn: number;
2222
}
2323

24-
const CodeBlock = React.forwardRef(function CodeBlock
25-
(
26-
{
27-
children,
28-
className = 'language-js',
29-
metastring,
30-
noMargin,
31-
noMarkers,
32-
}: {
33-
children: string;
34-
className?: string;
35-
metastring: string;
36-
noMargin?: boolean;
37-
noMarkers?: boolean;
38-
},
39-
ref?: React.Ref<HTMLDivElement>
40-
) {
41-
const getDecoratedLineInfo = () => {
42-
if (!metastring) {
43-
return [];
44-
}
24+
const CodeBlock = React.forwardRef(function CodeBlock(
25+
{
26+
children,
27+
className = 'language-js',
28+
metastring,
29+
noMargin,
30+
noMarkers,
31+
}: {
32+
children: string;
33+
className?: string;
34+
metastring: string;
35+
noMargin?: boolean;
36+
noMarkers?: boolean;
37+
},
38+
ref?: React.Ref<HTMLDivElement>
39+
) {
40+
const getDecoratedLineInfo = () => {
41+
if (!metastring) {
42+
return [];
43+
}
4544

46-
const linesToHighlight = getHighlightLines(metastring);
47-
const highlightedLineConfig = linesToHighlight.map((line) => {
48-
return {
49-
className: 'bg-github-highlight dark:bg-opacity-10',
50-
line,
51-
};
52-
});
45+
const linesToHighlight = getHighlightLines(metastring);
46+
const highlightedLineConfig = linesToHighlight.map((line) => {
47+
return {
48+
className: 'bg-github-highlight dark:bg-opacity-10',
49+
line,
50+
};
51+
});
5352

54-
const inlineHighlightLines = getInlineHighlights(metastring, children);
55-
const inlineHighlightConfig = inlineHighlightLines.map(
56-
(line: InlineHiglight) => ({
57-
...line,
58-
elementAttributes: {'data-step': `${line.step}`},
59-
className: cn(
60-
'code-step bg-opacity-10 relative rounded-md p-1 ml-2',
61-
{
62-
'pl-3 before:content-[attr(data-step)] before:block before:w-4 before:h-4 before:absolute before:top-1 before:-left-2 before:rounded-full before:text-white before:text-center before:text-xs before:leading-4': !noMarkers,
63-
'bg-blue-40 before:bg-blue-40': line.step === 1,
64-
'bg-yellow-40 before:bg-yellow-40': line.step === 2,
65-
'bg-green-40 before:bg-green-40': line.step === 3,
66-
'bg-purple-40 before:bg-purple-40': line.step === 4,
67-
}
68-
),
69-
})
70-
);
53+
const inlineHighlightLines = getInlineHighlights(metastring, children);
54+
const inlineHighlightConfig = inlineHighlightLines.map(
55+
(line: InlineHiglight) => ({
56+
...line,
57+
elementAttributes: {'data-step': `${line.step}`},
58+
className: cn('code-step bg-opacity-10 relative rounded-md p-1 ml-2', {
59+
'pl-3 before:content-[attr(data-step)] before:block before:w-4 before:h-4 before:absolute before:top-1 before:-left-2 before:rounded-full before:text-white before:text-center before:text-xs before:leading-4':
60+
!noMarkers,
61+
'bg-blue-40 before:bg-blue-40': line.step === 1,
62+
'bg-yellow-40 before:bg-yellow-40': line.step === 2,
63+
'bg-green-40 before:bg-green-40': line.step === 3,
64+
'bg-purple-40 before:bg-purple-40': line.step === 4,
65+
}),
66+
})
67+
);
7168

72-
return highlightedLineConfig.concat(inlineHighlightConfig);
73-
};
69+
return highlightedLineConfig.concat(inlineHighlightConfig);
70+
};
7471

75-
// e.g. "language-js"
76-
const language = className.substring(9);
77-
const filename = '/index.' + language;
78-
const decorators = getDecoratedLineInfo();
79-
return (
80-
<div
81-
translate="no"
82-
className={cn(
83-
'rounded-lg h-full w-full overflow-x-auto flex items-center bg-wash dark:bg-gray-95 shadow-lg',
84-
!noMargin && 'my-8'
85-
)}>
86-
<SandpackProvider
87-
customSetup={{
88-
entry: filename,
89-
files: {
90-
[filename]: {
91-
code: children.trimEnd(),
92-
},
72+
// e.g. "language-js"
73+
const language = className.substring(9);
74+
const filename = '/index.' + language;
75+
const decorators = getDecoratedLineInfo();
76+
return (
77+
<div
78+
translate="no"
79+
className={cn(
80+
'rounded-lg h-full w-full overflow-x-auto flex items-center bg-wash dark:bg-gray-95 shadow-lg',
81+
!noMargin && 'my-8'
82+
)}>
83+
<SandpackProvider
84+
customSetup={{
85+
entry: filename,
86+
files: {
87+
[filename]: {
88+
code: children.trimEnd(),
9389
},
94-
}}>
95-
<SandpackThemeProvider theme={CustomTheme}>
96-
<ClasserProvider
97-
classes={{
98-
'sp-cm': styles.codeViewer,
99-
}}>
100-
<SandpackCodeViewer
101-
ref={ref}
102-
showLineNumbers={false}
103-
decorators={decorators}
104-
/>
105-
</ClasserProvider>
106-
</SandpackThemeProvider>
107-
</SandpackProvider>
108-
</div>
109-
);
110-
}
111-
);
90+
},
91+
}}>
92+
<SandpackThemeProvider theme={CustomTheme}>
93+
<ClasserProvider
94+
classes={{
95+
'sp-cm': styles.codeViewer,
96+
}}>
97+
<SandpackCodeViewer
98+
ref={ref}
99+
showLineNumbers={false}
100+
decorators={decorators}
101+
/>
102+
</ClasserProvider>
103+
</SandpackThemeProvider>
104+
</SandpackProvider>
105+
</div>
106+
);
107+
});
112108

113109
export default CodeBlock;
114110

‎beta/src/components/MDX/ExpandableExample.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -60,8 +60,10 @@ function ExpandableExample({
6060
<Button
6161
active={true}
6262
className={cn({
63-
'bg-purple-50 border-purple-50 hover:bg-purple-40 focus:bg-purple-50 active:bg-purple-50': isDeepDive,
64-
'bg-yellow-50 border-yellow-50 hover:bg-yellow-40 focus:bg-yellow-50 active:bg-yellow-50': isExample,
63+
'bg-purple-50 border-purple-50 hover:bg-purple-40 focus:bg-purple-50 active:bg-purple-50':
64+
isDeepDive,
65+
'bg-yellow-50 border-yellow-50 hover:bg-yellow-40 focus:bg-yellow-50 active:bg-yellow-50':
66+
isExample,
6567
})}
6668
onClick={() => setIsExpanded((current) => !current)}>
6769
<span className="mr-1">

0 commit comments

Comments
 (0)