Skip to content

Commit 0a4ce3b

Browse files
author
Barthélémy Ledoux
authored
create eslint plugin (#219)
* add eslint plugin * add rule for import deprecation * add tests to the test workflow * rename workflow * add changeset * add vscode linter * add linter rules to the engine * add lint to the test workflow * finish linting * remove all warnings from the repo * remove one last warning * match the absolute path of the imported file * document the new rules * fix compileIcon test * fix mor etests on compile icon * fix tests again * add tests for icons * add changeset * some additional tests * fix monorepo once more * fix eslint tests * build: fix test again * add content to mock import * build icons * order tests by speed * simplify yml code * fix build * fix build process * fix most ts errors * fix most of it * make sure all types pass * remove all extraneous tsconfig files * refactor: script before template * fix lint * remove the open prop on accordion * remove alert tsconfig * test: changing btn attrs repaint vue component * de-comment react changes * update dependencies * fix loading of icons * remove useless component * better docgen config * fix test apps tsconfigs * a last set of fixes * fix one more project * fix types * update name of job * fix percy snapshots
1 parent 2ef4c37 commit 0a4ce3b

File tree

119 files changed

+1893
-789
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

119 files changed

+1893
-789
lines changed

Diff for: .changeset/eslint-plugin.md

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"@cypress-design/eslint-plugin": patch
3+
---
4+
5+
create eslint plugin

Diff for: .changeset/refactor-eslint.md

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
---
2+
'@cypress-design/react-statusicon': patch
3+
'@cypress-design/vue-statusicon': patch
4+
'@cypress-design/react-button': patch
5+
'@cypress-design/react-alert': patch
6+
'@cypress-design/vue-button': patch
7+
'@cypress-design/react-icon': patch
8+
'@cypress-design/react-tabs': patch
9+
'@cypress-design/vue-alert': patch
10+
'@cypress-design/vue-icon': patch
11+
'@cypress-design/icon-registry': patch
12+
'@cypress-design/css': patch
13+
---
14+
15+
refactor some typings so eslint passes without warning

Diff for: .eslintignore

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
**/dist
2+
**/iconsData
3+
**/_TreeShakableIcons.ts
4+
icon-registry/src/icons.ts
5+
icon-registry/src/iconsList.ts

Diff for: .eslintrc.cjs

+107
Original file line numberDiff line numberDiff line change
@@ -12,4 +12,111 @@ module.exports = {
1212
'no-only-tests/no-only-tests': 'error',
1313
'no-unused-vars': 'off',
1414
},
15+
overrides: [
16+
{
17+
files: ['packages/eslint-plugin/**/*.js'],
18+
env: {
19+
node: true,
20+
},
21+
},
22+
{
23+
files: ['{packages,css,icon-registry}/**/*.{ts,tsx}'],
24+
plugins: ['@typescript-eslint'],
25+
extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended'],
26+
parser: '@typescript-eslint/parser',
27+
parserOptions: {
28+
sourceType: 'module',
29+
project: ['./tsconfig.json'],
30+
},
31+
env: {
32+
node: true,
33+
},
34+
},
35+
{
36+
files: ['components/*/react/*.{ts,tsx}'],
37+
plugins: ['@typescript-eslint'],
38+
extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended'],
39+
parser: '@typescript-eslint/parser',
40+
parserOptions: {
41+
sourceType: 'module',
42+
project: ['./tsconfig.react.json'],
43+
},
44+
env: {
45+
browser: true,
46+
},
47+
},
48+
{
49+
files: ['components/*/react/*.{cy,rootStory,rootstory}.tsx'],
50+
plugins: ['@typescript-eslint'],
51+
extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended'],
52+
parser: '@typescript-eslint/parser',
53+
parserOptions: {
54+
sourceType: 'module',
55+
project: ['./tsconfig.react.json'],
56+
},
57+
rules: {
58+
'@typescript-eslint/no-empty-function': 'off',
59+
'@typescript-eslint/no-explicit-any': 'off',
60+
},
61+
env: {
62+
browser: true,
63+
},
64+
},
65+
{
66+
files: ['components/*/vue/*.{ts,vue}'],
67+
plugins: ['@typescript-eslint'],
68+
extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended'],
69+
parser: 'vue-eslint-parser',
70+
parserOptions: {
71+
parser: '@typescript-eslint/parser',
72+
sourceType: 'module',
73+
extraFileExtensions: ['.vue'],
74+
project: ['./tsconfig.vue.json', './tsconfig.json'],
75+
},
76+
env: {
77+
browser: true,
78+
},
79+
},
80+
{
81+
files: ['test/vue-app/src/*.{ts,vue}'],
82+
plugins: ['@typescript-eslint', '@cypress-design'],
83+
extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended'],
84+
parser: 'vue-eslint-parser',
85+
parserOptions: {
86+
parser: '@typescript-eslint/parser',
87+
sourceType: 'module',
88+
extraFileExtensions: ['.vue'],
89+
project: ['./test/vue-app/tsconfig.json'],
90+
},
91+
settings: {
92+
'import/resolver': {
93+
typescript: {
94+
project: ['./test/vue-app/tsconfig.json'],
95+
},
96+
},
97+
},
98+
rules: {
99+
'@cypress-design/deprecate-imports': [
100+
'warn',
101+
[
102+
{
103+
name: 'Button',
104+
source: ['**/invalid-path/*'],
105+
docs: 'https://design.cypress.io/components/vue/Button',
106+
},
107+
],
108+
],
109+
'@cypress-design/deprecate-imports-again': [
110+
'error',
111+
[
112+
{
113+
name: 'Lodash',
114+
source: 'lodash',
115+
docs: 'https://design.cypress.io/components/vue/Button',
116+
},
117+
],
118+
],
119+
},
120+
},
121+
],
15122
}

Diff for: .github/workflows/e2e-tests.yml

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ name: Build each test
33
on: [push]
44

55
jobs:
6-
cypress-run:
6+
build-projects:
77
runs-on: ubuntu-latest
88
steps:
99
- name: Get Yarn cache path

Diff for: .github/workflows/cypress.yml renamed to .github/workflows/test.yml

+17-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
name: Cypress Tests
1+
name: Tests
22

33
on: [push]
44

@@ -34,14 +34,29 @@ jobs:
3434
env:
3535
CI: true
3636

37+
- name: Lint all files
38+
run: yarn eslint .
39+
40+
- name: Run Eslint Plugin Tests
41+
run: yarn test:eslint-plugin
42+
43+
- name: Generate icon files
44+
run: |
45+
yarn turbo run build --filter=@cypress-design/css
46+
yarn workspace @cypress-design/icon-registry run build:svg
47+
yarn workspace @cypress-design/icon-registry run build:icons
48+
3749
- name: Run Unit Tests
3850
run: yarn test
3951

4052
- name: Build Components
4153
run: yarn run build:components
4254

4355
- name: Check global types
44-
run: yarn vue-tsc --noEmit
56+
run: |
57+
yarn vue-tsc --noEmit -p .
58+
yarn tsc --noEmit --project ./tsconfig.react.json
59+
yarn vue-tsc --noEmit --project ./tsconfig.vue.json
4560
4661
# run cypress component tests
4762
- name: Cypress run CT

Diff for: .vscode/settings.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -5,5 +5,6 @@
55
"typescript.tsdk": "node_modules/typescript/lib",
66
"[vue]": {
77
"editor.defaultFormatter": "esbenp.prettier-vscode"
8-
}
8+
},
9+
"eslint.validate": ["javascript", "typescript", "vue"]
910
}

Diff for: _templates/component/new/components_ComponentName_react_tsconfig.json.ejs.t

-10
This file was deleted.

Diff for: _templates/component/new/components_ComponentName_vue_tsconfig.json.ejs.t

-17
This file was deleted.

Diff for: components/Accordion/react/tsconfig.json

-7
This file was deleted.

Diff for: components/Accordion/vue/Accordion.rootstory.tsx

+2-1
Original file line numberDiff line numberDiff line change
@@ -15,12 +15,13 @@ export default (options: AccordionStoryOptions = {}) => {
1515
} = options
1616

1717
return (
18-
<div className="m-[16px]">
18+
<div class="m-[16px]">
1919
<Accordion
2020
title={title}
2121
separator={separator}
2222
description={description}
2323
icon={icon}
24+
// @ts-expect-error volar is a little too strict for tsx html attributes. Only do this for tests
2425
open={open}
2526
fullWidthContent={fullWidthContent}
2627
headingClassName={headingClassName}

Diff for: components/Accordion/vue/Accordion.vue

+3-3
Original file line numberDiff line numberDiff line change
@@ -51,16 +51,16 @@
5151
</template>
5252

5353
<script lang="ts" setup>
54-
import { CssClasses } from '@cypress-design/constants-accordion'
55-
import { DetailsAnimation } from '@cypress-design/details-animation'
56-
import { IconChevronDownSmall } from '@cypress-design/vue-icon'
5754
import {
5855
FunctionalComponent,
5956
SVGAttributes,
6057
onMounted,
6158
ref,
6259
useSlots,
6360
} from 'vue'
61+
import { CssClasses } from '@cypress-design/constants-accordion'
62+
import { DetailsAnimation } from '@cypress-design/details-animation'
63+
import { IconChevronDownSmall } from '@cypress-design/vue-icon'
6464
6565
const slots = useSlots()
6666

Diff for: components/Accordion/vue/tsconfig.build.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
{
2-
"extends": "../../../tsconfig.vue.json",
2+
"extends": "../../../tsconfig.vue.build.json",
33
"include": ["./*.vue", "./index.ts"],
44
"compilerOptions": {
55
"outDir": "dist",

Diff for: components/Accordion/vue/tsconfig.json

-14
This file was deleted.

Diff for: components/Alert/react/Alert.rootstory.tsx

+9-9
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ export default () => {
99
return (
1010
<div className="flex flex-col p-4 gap-[16px]">
1111
<Alert
12-
type="error"
12+
variant="error"
1313
title="Spec not found"
1414
detailsTitle="Stack trace"
1515
data-cy="alert-1"
@@ -76,17 +76,17 @@ export default () => {
7676
/>
7777
) : null}
7878
<Alert
79-
type="success"
79+
variant="success"
8080
dismissible
8181
title="Success with body"
8282
data-cy="alert-3"
8383
>
8484
Success body
8585
</Alert>
86-
<Alert type="warning" title="Warning" notRounded />
87-
<Alert type="neutral" title="Neutral" />
86+
<Alert variant="warning" title="Warning" notRounded />
87+
<Alert variant="neutral" title="Neutral" />
8888
<Alert
89-
type="error"
89+
variant="error"
9090
dismissible
9191
data-cy="alert-4"
9292
className="text-justify"
@@ -98,13 +98,13 @@ export default () => {
9898
cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id
9999
est laborum."
100100
/>
101-
<Alert type="info" title="Info" />
102-
<Alert type="info" title="Info" customIcon={IconArrowRight} />
101+
<Alert variant="info" title="Info" />
102+
<Alert variant="info" title="Info" customIcon={IconArrowRight} />
103103
{(['xs', 'sm', 'md', 'lg'] as const).map((size) => (
104104
<>
105105
<Alert
106+
variant="error"
106107
title={`${size} - Lorem ipsum dolor sit amet`}
107-
type="error"
108108
data-cy="alert-size"
109109
size={size}
110110
/>
@@ -116,7 +116,7 @@ export default () => {
116116
velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
117117
cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id
118118
est laborum."
119-
type="error"
119+
variant="error"
120120
data-cy="alert-size"
121121
size={size}
122122
/>

Diff for: components/Alert/react/Alert.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ export interface AlertProps {
2525
/**
2626
* Box at the bottom of the alert for buttons or links
2727
*/
28-
footer: React.ReactNode
28+
footer?: React.ReactNode
2929
/**
3030
* Color scheme
3131
*/
@@ -127,7 +127,7 @@ export const Alert: React.FC<
127127
React.useEffect(() => {
128128
if (onDismiss && duration && !durationTimeout) {
129129
setDismissed(false)
130-
const timeout = setTimeout(dismiss, duration) as any
130+
const timeout = setTimeout(dismiss, duration) as unknown as number
131131
setDurationTimeout(timeout)
132132
}
133133
return clearDurationTimeout

Diff for: components/Alert/react/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -27,9 +27,9 @@
2727
},
2828
"devDependencies": {
2929
"@cypress-design/css": "*",
30-
"postcss": "^8.4.22",
30+
"postcss": "^8.4.23",
3131
"rollup-plugin-postcss": "^4.0.2",
32-
"sass": "^1.62.0"
32+
"sass": "^1.62.1"
3333
},
3434
"license": "MIT"
3535
}

Diff for: components/Alert/react/tsconfig.json

-7
This file was deleted.

Diff for: components/Alert/vue/Alert.vue

+1-1
Original file line numberDiff line numberDiff line change
@@ -88,7 +88,7 @@ let timeout: number | undefined
8888
8989
onMounted(() => {
9090
if (props.duration) {
91-
timeout = setTimeout(dismiss, props.duration) as any
91+
timeout = setTimeout(dismiss, props.duration)
9292
}
9393
})
9494

0 commit comments

Comments
 (0)