Add typescript

This commit is contained in:
Mark McDowall 2023-01-05 18:43:51 -08:00 committed by Mark McDowall
parent 27cc551980
commit 910511dba0
17 changed files with 925 additions and 45 deletions

View File

@ -1 +1,2 @@
**/JsLibraries/** **/JsLibraries/**
**/*.css.d.ts

View File

@ -1,4 +1,7 @@
// eslint-disable-next-line @typescript-eslint/no-var-requires
const fs = require('fs'); const fs = require('fs');
// eslint-disable-next-line @typescript-eslint/no-var-requires
const typescriptEslintRecommended = require('@typescript-eslint/eslint-plugin').configs.recommended;
const dirs = fs const dirs = fs
.readdirSync('frontend/src', { withFileTypes: true }) .readdirSync('frontend/src', { withFileTypes: true })
@ -41,7 +44,8 @@ module.exports = {
'react', 'react',
'react-hooks', 'react-hooks',
'simple-import-sort', 'simple-import-sort',
'import' 'import',
'@typescript-eslint'
], ],
settings: { settings: {
@ -224,7 +228,7 @@ module.exports = {
'consistent-this': ['error', 'self'], 'consistent-this': ['error', 'self'],
'eol-last': 'error', 'eol-last': 'error',
'func-names': 'off', 'func-names': 'off',
'func-style': ['error', 'declaration'], 'func-style': ['error', 'declaration', { allowArrowFunctions: true }],
indent: ['error', 2, { SwitchCase: 1 }], indent: ['error', 2, { SwitchCase: 1 }],
'key-spacing': ['error', { beforeColon: false, afterColon: true }], 'key-spacing': ['error', { beforeColon: false, afterColon: true }],
'keyword-spacing': ['error', { before: true, after: true }], 'keyword-spacing': ['error', { before: true, after: true }],
@ -315,7 +319,9 @@ module.exports = {
}, },
overrides: [ overrides: [
{ {
files: ['*.js'], files: [
'*.js'
],
rules: { rules: {
'simple-import-sort/imports': [ 'simple-import-sort/imports': [
'error', 'error',
@ -330,6 +336,47 @@ module.exports = {
} }
] ]
} }
},
{
files: [
'*.ts',
'*.tsx'
],
parser: '@typescript-eslint/parser',
parserOptions: {
project: './tsconfig.json'
},
rules: Object.assign(typescriptEslintRecommended.rules, {
'no-shadow': 'off',
// These should be enabled after cleaning things up
'@typescript-eslint/no-unused-vars': 'warn',
'@typescript-eslint/explicit-function-return-type': 'off',
'react/prop-types': 'off',
'simple-import-sort/imports': [
'error',
{
groups: [
// Packages
// Absolute Paths
// Relative Paths
// Css
['^@?\\w', `^(${dirs})(/.*|$)`, '^\\.', '^\\..*css$']
]
}
]
})
},
{
files: [
'*.css.d.ts'
],
rules: {
'filenames/match-exported': 'off',
'init-declarations': 'off',
'prettier/prettier': 'off'
}
} }
] ]
}; };

View File

@ -17,7 +17,8 @@ module.exports = {
env: { env: {
development: { development: {
presets: [ presets: [
['@babel/preset-react', { development: true }] ['@babel/preset-react', { development: true }],
'@babel/preset-typescript'
], ],
plugins: [ plugins: [
'babel-plugin-inline-classnames' 'babel-plugin-inline-classnames'
@ -25,7 +26,8 @@ module.exports = {
}, },
production: { production: {
presets: [ presets: [
'@babel/preset-react' '@babel/preset-react',
'@babel/preset-typescript'
], ],
plugins: [ plugins: [
'babel-plugin-transform-react-remove-prop-types' 'babel-plugin-transform-react-remove-prop-types'

View File

@ -1,3 +1,4 @@
/* eslint-disable @typescript-eslint/no-var-requires */
const path = require('path'); const path = require('path');
const webpack = require('webpack'); const webpack = require('webpack');
const FileManagerPlugin = require('filemanager-webpack-plugin'); const FileManagerPlugin = require('filemanager-webpack-plugin');
@ -5,6 +6,7 @@ const HtmlWebpackPlugin = require('html-webpack-plugin');
const LiveReloadPlugin = require('webpack-livereload-plugin'); const LiveReloadPlugin = require('webpack-livereload-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin'); const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const TerserPlugin = require('terser-webpack-plugin'); const TerserPlugin = require('terser-webpack-plugin');
const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
module.exports = (env) => { module.exports = (env) => {
const uiFolder = 'UI'; const uiFolder = 'UI';
@ -38,6 +40,11 @@ module.exports = (env) => {
}, },
resolve: { resolve: {
extensions: [
'.ts',
'.tsx',
'.js'
],
modules: [ modules: [
srcFolder, srcFolder,
path.join(srcFolder, 'Shims'), path.join(srcFolder, 'Shims'),
@ -131,6 +138,8 @@ module.exports = (env) => {
} }
}), }),
new ForkTsCheckerWebpackPlugin(),
new LiveReloadPlugin() new LiveReloadPlugin()
], ],
@ -154,7 +163,7 @@ module.exports = (env) => {
} }
}, },
{ {
test: /\.js?$/, test: [/\.jsx?$/, /\.tsx?$/],
exclude: /(node_modules|JsLibraries)/, exclude: /(node_modules|JsLibraries)/,
use: [ use: [
{ {
@ -185,6 +194,7 @@ module.exports = (env) => {
exclude: /(node_modules|globals.css)/, exclude: /(node_modules|globals.css)/,
use: [ use: [
{ loader: MiniCssExtractPlugin.loader }, { loader: MiniCssExtractPlugin.loader },
{ loader: 'css-modules-typescript-loader' },
{ {
loader: 'css-loader', loader: 'css-loader',
options: { options: {

View File

@ -4,7 +4,15 @@ import Alert from 'Components/Alert';
import { kinds } from 'Helpers/Props'; import { kinds } from 'Helpers/Props';
import styles from './Form.css'; import styles from './Form.css';
function Form({ children, validationErrors, validationWarnings, ...otherProps }) { function Form(props) {
const {
children,
validationErrors,
validationWarnings,
// eslint-disable-next-line no-unused-vars
...otherProps
} = props;
return ( return (
<div> <div>
{ {

View File

@ -27,6 +27,7 @@ SortMenuItem.propTypes = {
name: PropTypes.string, name: PropTypes.string,
sortKey: PropTypes.string, sortKey: PropTypes.string,
sortDirection: PropTypes.oneOf(sortDirections.all), sortDirection: PropTypes.oneOf(sortDirections.all),
children: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,
onPress: PropTypes.func.isRequired onPress: PropTypes.func.isRequired
}; };

View File

@ -22,7 +22,9 @@ function ViewMenuItem(props) {
ViewMenuItem.propTypes = { ViewMenuItem.propTypes = {
name: PropTypes.string, name: PropTypes.string,
selectedView: PropTypes.string.isRequired selectedView: PropTypes.string.isRequired,
children: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,
onPress: PropTypes.func.isRequired
}; };
export default ViewMenuItem; export default ViewMenuItem;

View File

@ -173,7 +173,7 @@ OverlayScroller.defaultProps = {
scrollDirection: scrollDirections.VERTICAL, scrollDirection: scrollDirections.VERTICAL,
autoHide: false, autoHide: false,
autoScroll: true, autoScroll: true,
registerScroller: () => {} registerScroller: () => { /* no-op */ }
}; };
export default OverlayScroller; export default OverlayScroller;

View File

@ -89,7 +89,7 @@ Scroller.defaultProps = {
scrollDirection: scrollDirections.VERTICAL, scrollDirection: scrollDirections.VERTICAL,
autoFocus: true, autoFocus: true,
autoScroll: true, autoScroll: true,
registerScroller: () => {} registerScroller: () => { /* no-op */ }
}; };
export default Scroller; export default Scroller;

View File

@ -13,6 +13,7 @@ export function virtualTableSelectCellRenderer(cellProps) {
} = cellProps; } = cellProps;
return ( return (
// eslint-disable-next-line no-use-before-define
<VirtualTableSelectCell <VirtualTableSelectCell
key={cellKey} key={cellKey}
id={rowData.name} id={rowData.name}

View File

@ -13,6 +13,8 @@ export function headerRenderer(headerProps) {
} = headerProps; } = headerProps;
return ( return (
// eslint-disable-next-line no-use-before-define
<VirtualTableHeaderCell <VirtualTableHeaderCell
name={dataKey} name={dataKey}
{...columnData} {...columnData}

View File

@ -1,4 +1,4 @@
/* eslint no-empty-function: 0 no-extend-native: 0 */ /* eslint no-empty-function: 0, no-extend-native: 0, "@typescript-eslint/no-empty-function": 0 */
window.console = window.console || {}; window.console = window.console || {};
window.console.log = window.console.log || function() {}; window.console.log = window.console.log || function() {};

29
frontend/tsconfig.json Normal file
View File

@ -0,0 +1,29 @@
{
"compilerOptions": {
"target": "es6",
"allowJs": true,
"checkJs": false,
"baseUrl": "src",
"jsx": "react",
"module": "commonjs",
"moduleResolution": "node",
"noEmit": true,
"esModuleInterop": true,
"typeRoots": ["node_modules/@types", "typings"],
"paths": {
"*": [
"*"
]
},
"plugins": [{ "name": "typescript-plugin-css-modules" }]
},
"include": [
"./src/**/*",
"./.eslintrc.js",
"./build/webpack.config.js",
"./typings/*.ts",
],
"exclude": [
"node_modules"
]
}

1
frontend/typings/Globals.d.ts vendored Normal file
View File

@ -0,0 +1 @@
declare module '*.module.css';

View File

@ -32,6 +32,10 @@
"@microsoft/signalr": "6.0.3", "@microsoft/signalr": "6.0.3",
"@sentry/browser": "6.19.7", "@sentry/browser": "6.19.7",
"@sentry/integrations": "6.19.7", "@sentry/integrations": "6.19.7",
"@types/jest": "29.2.5",
"@types/node": "18.11.18",
"@types/react": "18.0.26",
"@types/react-dom": "18.0.10",
"classnames": "2.3.1", "classnames": "2.3.1",
"clipboard": "2.0.11", "clipboard": "2.0.11",
"connected-react-router": "6.9.2", "connected-react-router": "6.9.2",
@ -77,7 +81,8 @@
"redux-batched-actions": "0.5.0", "redux-batched-actions": "0.5.0",
"redux-localstorage": "0.4.1", "redux-localstorage": "0.4.1",
"redux-thunk": "2.4.1", "redux-thunk": "2.4.1",
"reselect": "4.1.5" "reselect": "4.1.5",
"typescript": "4.9.4"
}, },
"devDependencies": { "devDependencies": {
"@babel/core": "7.18.0", "@babel/core": "7.18.0",
@ -94,22 +99,28 @@
"@babel/plugin-syntax-dynamic-import": "7.8.3", "@babel/plugin-syntax-dynamic-import": "7.8.3",
"@babel/preset-env": "7.18.0", "@babel/preset-env": "7.18.0",
"@babel/preset-react": "7.17.12", "@babel/preset-react": "7.17.12",
"@babel/preset-typescript": "7.18.6",
"@typescript-eslint/eslint-plugin": "5.48.1",
"@typescript-eslint/parser": "5.48.0",
"autoprefixer": "10.4.7", "autoprefixer": "10.4.7",
"babel-eslint": "10.1.0",
"babel-loader": "8.2.5", "babel-loader": "8.2.5",
"babel-plugin-inline-classnames": "2.0.1", "babel-plugin-inline-classnames": "2.0.1",
"babel-plugin-transform-react-remove-prop-types": "0.4.24", "babel-plugin-transform-react-remove-prop-types": "0.4.24",
"core-js": "3.22.5", "core-js": "3.22.5",
"css-loader": "6.7.1", "css-loader": "6.7.1",
"css-modules-typescript-loader": "4.0.1",
"esformatter": "0.11.3", "esformatter": "0.11.3",
"eslint": "8.15.0", "eslint": "8.15.0",
"eslint-plugin-filenames": "1.3.2", "eslint-plugin-filenames": "1.3.2",
"eslint-plugin-import": "2.26.0", "eslint-plugin-import": "2.26.0",
"eslint-plugin-react": "7.30.0", "eslint-plugin-react": "7.30.0",
"eslint-plugin-react-hooks": "4.6.0", "eslint-plugin-react-hooks": "4.6.0",
"eslint-plugin-simple-import-sort": "7.0.0", "eslint-plugin-simple-import-sort": "8.0.0",
"esprint": "3.6.0", "esprint": "3.6.0",
"file-loader": "6.2.0", "file-loader": "6.2.0",
"filemanager-webpack-plugin": "7.0.0-beta.0", "filemanager-webpack-plugin": "7.0.0-beta.0",
"fork-ts-checker-webpack-plugin": "7.2.14",
"html-webpack-plugin": "5.5.0", "html-webpack-plugin": "5.5.0",
"loader-utils": "^3.2.1", "loader-utils": "^3.2.1",
"mini-css-extract-plugin": "2.6.0", "mini-css-extract-plugin": "2.6.0",
@ -125,6 +136,8 @@
"style-loader": "3.3.1", "style-loader": "3.3.1",
"stylelint": "14.8.2", "stylelint": "14.8.2",
"stylelint-order": "5.0.0", "stylelint-order": "5.0.0",
"ts-loader": "9.4.2",
"typescript-plugin-css-modules": "4.1.1",
"url-loader": "4.1.1", "url-loader": "4.1.1",
"webpack": "5.72.1", "webpack": "5.72.1",
"webpack-cli": "4.9.2", "webpack-cli": "4.9.2",

3
tsconfig.json Normal file
View File

@ -0,0 +1,3 @@
{
"extends": "./frontend/tsconfig.json",
}

824
yarn.lock

File diff suppressed because it is too large Load Diff