Skip to content

Commit bb86874

Browse files
footfoot
authored
Upgrade to typescript 5.x (#3596)
- As we have in OSS - This doesn't really change any code but allows us to use newer typescript helper libs etc like type-fest - Once upgraded it required an upgrade of eslint... we were still using create-react-app as a linting base which is 2 years old and not really supported so we remove that and replace it with the newer components of that config (jest,jsx-ally,react,react-hooks) - https://github.com/facebook/create-react-app/blob/main/packages/eslint-config-react-app/index.js#L29
1 parent 7187149 commit bb86874

File tree

10 files changed

+1193
-717
lines changed

10 files changed

+1193
-717
lines changed

‎.eslintrc.js

Lines changed: 100 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
module.exports = {
2+
root: true,
3+
extends: [
4+
"eslint:recommended",
5+
"plugin:@typescript-eslint/recommended",
6+
"plugin:import/errors",
7+
"plugin:import/typescript",
8+
"plugin:import/warnings",
9+
"plugin:jest/recommended",
10+
"plugin:jsx-a11y/recommended",
11+
"plugin:react-hooks/recommended",
12+
"plugin:react/recommended",
13+
"plugin:testing-library/react",
14+
],
15+
rules: {
16+
"import/default": [0],
17+
"import/no-named-as-default-member": [0],
18+
"import/no-named-as-default": [0],
19+
"import/no-unresolved": [0],
20+
"import/order": [
21+
2,
22+
{
23+
alphabetize: {
24+
order: "asc",
25+
caseInsensitive: true,
26+
},
27+
groups: [
28+
"builtin",
29+
"external",
30+
"internal",
31+
"parent",
32+
"sibling",
33+
"index",
34+
"object",
35+
"type",
36+
],
37+
},
38+
],
39+
40+
"@typescript-eslint/explicit-module-boundary-types": [0],
41+
"@typescript-eslint/no-unused-vars": [0],
42+
"@typescript-eslint/ban-types": [
43+
"error",
44+
{
45+
types: {
46+
Object: false,
47+
"{}": false,
48+
},
49+
extendDefaults: true,
50+
},
51+
],
52+
"@typescript-eslint/no-explicit-any": [0],
53+
"@typescript-eslint/ban-ts-comment": [0],
54+
"@typescript-eslint/switch-exhaustiveness-check": [2],
55+
"@typescript-eslint/no-non-null-assertion": [0],
56+
57+
// testing stuff
58+
"testing-library/no-node-access": [0],
59+
"testing-library/no-unnecessary-act": [0],
60+
"testing-library/render-result-naming-convention": [0],
61+
"testing-library/prefer-screen-queries": [0],
62+
"jest/expect-expect": [0],
63+
64+
// Let you omit `import React` from files
65+
"react/react-in-jsx-scope": [0],
66+
"react/jsx-uses-react": [0],
67+
// Let you use quotes etc in JSX blocks
68+
"react/no-unescaped-entities": [0],
69+
// FIXME: lets switch this on for extra safety.
70+
// We get a runtime check on this too but it's nice to have it in the linter
71+
"react/jsx-key": [0],
72+
73+
// FIXME: nice to address these
74+
"jsx-a11y/label-has-associated-control": [0],
75+
"jsx-a11y/click-events-have-key-events": [0],
76+
"jsx-a11y/no-static-element-interactions": [0],
77+
"jsx-a11y/no-autofocus": [0],
78+
},
79+
settings: {
80+
react: {
81+
version: "detect",
82+
},
83+
},
84+
ignorePatterns: [
85+
"rpc",
86+
"api",
87+
"assets",
88+
"cluster-services",
89+
"fonts",
90+
"node_modules",
91+
".d.ts",
92+
".pb.ts",
93+
"setupProxy.js",
94+
"test-utils.tsx",
95+
"reportWebVitals.ts",
96+
],
97+
parserOptions: {
98+
project: "./tsconfig.json",
99+
},
100+
};

‎eslintrc.json

Lines changed: 0 additions & 73 deletions
This file was deleted.

‎package.json

Lines changed: 11 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -38,9 +38,8 @@
3838
"d3-time": "^3.0.0",
3939
"dotenv": "^10.0.0",
4040
"dotenv-expand": "^5.1.0",
41-
"eslint": "^8.3.0",
42-
"eslint-config-react-app": "^7.0.1",
43-
"eslint-webpack-plugin": "^3.1.1",
41+
"eslint": "^8.52.0",
42+
"eslint-plugin-import": "^2.25.4",
4443
"git-url-parse": "12.0.0",
4544
"http-proxy-middleware": "^2.0.0",
4645
"jest": "^27.4.3",
@@ -72,7 +71,7 @@
7271
"resolve": "^1.20.0",
7372
"semver": "^7.3.5",
7473
"styled-components": "^5.3.0",
75-
"typescript": "^4.1.2",
74+
"typescript": "^5.2.2",
7675
"urijs": "^1.19.11",
7776
"web-vitals": "^1.0.1",
7877
"yaml": "^2.2.2"
@@ -87,23 +86,7 @@
8786
"start": "parcel serve ui/index.html --port 3000 --dist-dir build --hmr-port 1234",
8887
"build": "parcel build ui/index.html --dist-dir build",
8988
"test": "node ui/scripts/test.js",
90-
"lint": "eslint ui/src -c eslintrc.json --max-warnings=0"
91-
},
92-
"eslintConfig": {
93-
"extends": [
94-
"react-app",
95-
"react-app/jest"
96-
],
97-
"overrides": [
98-
{
99-
"files": [
100-
"**/*.ts?(x)"
101-
],
102-
"rules": {
103-
"import/no-anonymous-default-export": "off"
104-
}
105-
}
106-
]
89+
"lint": "eslint ui/src -c .eslintrc.js --max-warnings=0"
10790
},
10891
"browserslist": {
10992
"production": [
@@ -121,7 +104,14 @@
121104
"@parcel/transformer-inline-string": "2.9.3",
122105
"@testing-library/react": "^12.1.5",
123106
"@types/react-syntax-highlighter": "^13.5.2",
107+
"@typescript-eslint/eslint-plugin": "^6.6.0",
108+
"@typescript-eslint/parser": "^6.6.0",
124109
"buffer": "^5.5.0",
110+
"eslint-plugin-jest": "^27.6.0",
111+
"eslint-plugin-jsx-a11y": "^6.8.0",
112+
"eslint-plugin-react": "^7.33.2",
113+
"eslint-plugin-react-hooks": "^4.6.0",
114+
"eslint-plugin-testing-library": "^6.1.0",
125115
"express": "^4.17.1",
126116
"http-proxy-middleware": "^2.0.0",
127117
"jest-styled-components": "^7.0.8",

‎ui/src/components/Applications/Add/index.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -460,4 +460,4 @@ const AddApplication = ({ clusterName }: { clusterName?: string }) => {
460460
]);
461461
};
462462

463-
export default ({ ...rest }) => <AddApplication {...rest} />;
463+
export default AddApplication;

‎ui/src/components/Layout/HelpLinkWrapper.tsx

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,6 @@ import {
1010
} from '../../contexts/ListConfig';
1111
import { Tooltip } from '../Shared';
1212

13-
1413
const HelpLink = styled(Flex)<{
1514
backgroundColor?: string;
1615
textColor?: string;
@@ -54,11 +53,9 @@ const Footer = ({ version }: { version: string }) => {
5453
>
5554
{uiConfig?.footer?.content ? (
5655
<div>
57-
<ReactMarkdown
58-
children={uiConfig?.footer?.content || ''}
59-
remarkPlugins={[remarkGfm]}
60-
className={classes.editor}
61-
/>
56+
<ReactMarkdown remarkPlugins={[remarkGfm]} className={classes.editor}>
57+
{uiConfig?.footer?.content || ''}
58+
</ReactMarkdown>
6259
</div>
6360
) : (
6461
<div>

‎ui/src/components/Secrets/SecretDetails/SecretDetailsTabs.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ const SecretDetailsTabs = ({
2828
const secretObj = new FluxObject({
2929
payload: secretDetails?.yaml,
3030
});
31-
const props = secretObj.obj?.spec?.data?.map((d: any) => ({
31+
const secretProps = secretObj.obj?.spec?.data?.map((d: any) => ({
3232
key: d.secretKey,
3333
value: d.remoteRef.property,
3434
}));
@@ -81,8 +81,8 @@ const SecretDetailsTabs = ({
8181
Properties
8282
</Text>
8383
<DataTable
84-
key={props?.length}
85-
rows={props}
84+
key={secretProps?.length}
85+
rows={secretProps}
8686
fields={[
8787
{
8888
label: 'PROPERTY',

‎ui/src/components/Templates/Form/index.tsx

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -430,10 +430,9 @@ const ResourceForm: FC<ResourceFormProps> = ({ template, resource }) => {
430430
{template.description ? (
431431
<Flex column>
432432
<div>Description:</div>
433-
<Editor
434-
children={template.description || ''}
435-
remarkPlugins={[remarkGfm]}
436-
/>
433+
<Editor remarkPlugins={[remarkGfm]}>
434+
{template.description || ''}
435+
</Editor>
437436
</Flex>
438437
) : null}
439438
<Divider

‎ui/src/contexts/GitAuth/CallbackStateContext.tsx

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,5 +19,9 @@ export default function CallbackStateContextProvider({
1919
const value: CallbackStateContextType = {
2020
callbackState,
2121
};
22-
return <CallbackStateContext.Provider value={value} children={children} />;
22+
return (
23+
<CallbackStateContext.Provider value={value}>
24+
{children}
25+
</CallbackStateContext.Provider>
26+
);
2327
}

‎ui/src/routes.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -57,11 +57,13 @@ import Workspaces from './components/Workspaces';
5757
import WorkspaceDetails from './components/Workspaces/WorkspaceDetails';
5858
import { Routes } from './utils/nav';
5959

60-
function withSearchParams(Cmp: any) {
61-
return ({ location: { search }, ...rest }: any) => {
60+
function withSearchParams(Cmp: React.FC<any>) {
61+
const ComponentWithParams = ({ location: { search }, ...rest }: any) => {
6262
const params = qs.parse(search);
6363
return <Cmp {...rest} {...params} />;
6464
};
65+
ComponentWithParams.displayName = Cmp.displayName + 'WithParams';
66+
return ComponentWithParams;
6567
}
6668

6769
const Page404 = () => (

0 commit comments

Comments
 (0)