deps(node): typescript 3.9.6 => 4.1.3

.eslintrc.yml

@@ -76,6 +76,9 @@ rules:
     - 1
     - "line-aligned"
   "react/jsx-closing-tag-location": 1
+  "no-use-before-define": 0
+  "@typescript-eslint/no-use-before-define": 1
+  "multiline-ternary": 0
 overrides:
   - files:
       - "**/*.tsx"

package.json

@@ -1,9 +1,9 @@
 {
     "name": "pterodactyl-panel",
     "dependencies": {
-        "@fortawesome/fontawesome-svg-core": "^1.2.32",
+        "@fortawesome/fontawesome-svg-core": "^1.2.34",
-        "@fortawesome/free-solid-svg-icons": "^5.15.1",
+        "@fortawesome/free-solid-svg-icons": "^5.15.2",
-        "@fortawesome/react-fontawesome": "^0.1.11",
+        "@fortawesome/react-fontawesome": "^0.1.14",
         "@tailwindcss/forms": "^0.2.1",
         "axios": "^0.21.1",
         "chart.js": "^2.8.0",
@@ -20,14 +20,14 @@
         "i18next-xhr-backend": "^3.2.2",
         "query-string": "^6.7.0",
         "react": "^16.13.1",
-        "react-copy-to-clipboard": "^5.0.2",
+        "react-copy-to-clipboard": "^5.0.3",
         "react-dom": "npm:@hot-loader/react-dom",
         "react-fast-compare": "^3.2.0",
-        "react-ga": "^3.1.2",
+        "react-ga": "^3.3.0",
-        "react-google-recaptcha": "^2.0.1",
+        "react-google-recaptcha": "^2.1.0",
-        "react-hot-loader": "^4.12.21",
+        "react-hot-loader": "^4.13.0",
-        "react-i18next": "^11.2.1",
+        "react-i18next": "^11.8.5",
-        "react-router-dom": "^5.1.2",
+        "react-router-dom": "^5.2.0",
         "react-transition-group": "^4.4.1",
         "reaptcha": "^1.7.2",
         "sockette": "^2.0.6",
@@ -36,10 +36,10 @@
         "swr": "^0.2.3",
         "tailwindcss": "^2.0.2",
         "uuid": "^3.3.2",
-        "xterm": "^4.9.0",
+        "xterm": "^4.10.0",
         "xterm-addon-attach": "^0.6.0",
-        "xterm-addon-fit": "^0.4.0",
+        "xterm-addon-fit": "^0.5.0",
-        "xterm-addon-search": "^0.7.0",
+        "xterm-addon-search": "^0.8.0",
         "xterm-addon-search-bar": "^0.2.0",
         "xterm-addon-web-links": "^0.4.0",
         "yup": "^0.29.1"
@@ -75,30 +75,29 @@
         "@types/uuid": "^3.4.5",
         "@types/webpack-env": "^1.15.2",
         "@types/yup": "^0.29.3",
-        "@typescript-eslint/eslint-plugin": "^3.5.0",
+        "@typescript-eslint/eslint-plugin": "^4.14.2",
-        "@typescript-eslint/parser": "^3.5.0",
+        "@typescript-eslint/parser": "^4.14.2",
         "autoprefixer": "^10.1.0",
         "babel-loader": "^8.0.6",
         "babel-plugin-styled-components": "^1.12.0",
         "cross-env": "^7.0.2",
         "css-loader": "^3.2.1",
-        "eslint": "^7.4.0",
+        "eslint": "^7.19.0",
-        "eslint-config-standard": "^14.1.1",
+        "eslint-config-standard": "^16.0.2",
-        "eslint-plugin-import": "^2.22.0",
+        "eslint-plugin-import": "^2.22.1",
-        "eslint-plugin-node": "^9.1.0",
+        "eslint-plugin-node": "^11.1.0",
         "eslint-plugin-promise": "^4.2.1",
-        "eslint-plugin-react": "^7.20.3",
+        "eslint-plugin-react": "^7.22.0",
-        "eslint-plugin-react-hooks": "^4.0.5",
+        "eslint-plugin-react-hooks": "^4.2.0",
-        "eslint-plugin-standard": "^4.0.1",
+        "fork-ts-checker-webpack-plugin": "^6.1.0",
-        "fork-ts-checker-webpack-plugin": "^5.0.6",
+        "postcss": "^8.2.4",
-        "postcss": "^8.2.1",
         "redux-devtools-extension": "^2.13.8",
         "source-map-loader": "^1.0.1",
         "style-loader": "^1.2.1",
         "svg-url-loader": "^6.0.0",
         "terser-webpack-plugin": "^3.0.6",
         "twin.macro": "^2.0.7",
-        "typescript": "^3.9.6",
+        "typescript": "^4.1.3",
         "webpack": "^4.43.0",
         "webpack-assets-manifest": "^3.1.1",
         "webpack-bundle-analyzer": "^3.8.0",

resources/scripts/components/dashboard/AccountOverviewContainer.tsx

@@ -1,13 +1,13 @@
-import * as React from 'react';
+import React from 'react';
 import ContentBox from '@/components/elements/ContentBox';
 import UpdatePasswordForm from '@/components/dashboard/forms/UpdatePasswordForm';
 import UpdateEmailAddressForm from '@/components/dashboard/forms/UpdateEmailAddressForm';
 import ConfigureTwoFactorForm from '@/components/dashboard/forms/ConfigureTwoFactorForm';
 import PageContentBlock from '@/components/elements/PageContentBlock';
+import { useLocation } from 'react-router-dom';
 import tw from 'twin.macro';
 import { breakpoint } from '@/theme';
 import styled from 'styled-components/macro';
-import { RouteComponentProps } from 'react-router';
 import MessageBox from '@/components/MessageBox';
 
 const Container = styled.div`
@@ -26,7 +26,9 @@ const Container = styled.div`
     }
 `;
 
-export default ({ location: { state } }: RouteComponentProps) => {
+export default () => {
+    const state = useLocation<{ twoFactorRedirect: boolean }>().state;
+
     return (
         <PageContentBlock title={'Account Overview'}>
             {state?.twoFactorRedirect &&

resources/scripts/components/server/WebsocketHandler.tsx

@@ -20,6 +20,18 @@ export default () => {
     const setServerStatus = ServerContext.useStoreActions(actions => actions.status.setServerStatus);
     const { setInstance, setConnectionState } = ServerContext.useStoreActions(actions => actions.socket);
 
+    const updateToken = (uuid: string, socket: Websocket) => {
+        if (updatingToken) return;
+
+        updatingToken = true;
+        getWebsocketToken(uuid)
+            .then(data => socket.setToken(data.token, true))
+            .catch(error => console.error(error))
+            .then(() => {
+                updatingToken = false;
+            });
+    };
+
     const connect = (uuid: string) => {
         const socket = new Websocket();
 
@@ -73,18 +85,6 @@ export default () => {
             .catch(error => console.error(error));
     };
 
-    const updateToken = (uuid: string, socket: Websocket) => {
-        if (updatingToken) return;
-
-        updatingToken = true;
-        getWebsocketToken(uuid)
-            .then(data => socket.setToken(data.token, true))
-            .catch(error => console.error(error))
-            .then(() => {
-                updatingToken = false;
-            });
-    };
-
     useEffect(() => {
         connected && setError('');
     }, [ connected ]);

resources/scripts/components/server/files/FileEditContainer.tsx

@@ -24,7 +24,7 @@ const LazyCodemirrorEditor = lazy(() => import(/* webpackChunkName: "editor" */'
 
 export default () => {
     const [ error, setError ] = useState('');
-    const { action } = useParams();
+    const { action } = useParams<{ action: string }>();
     const [ loading, setLoading ] = useState(action === 'edit');
     const [ content, setContent ] = useState('');
     const [ modalVisible, setModalVisible ] = useState(false);

resources/scripts/components/server/schedules/ScheduleEditContainer.tsx

@@ -48,7 +48,7 @@ const ActivePill = ({ active }: { active: boolean }) => (
 export default () => {
     const params = useParams() as Params;
     const history = useHistory();
-    const state: State = useLocation().state;
+    const state = useLocation<State>().state;
 
     const id = ServerContext.useStoreState(state => state.server.data!.id);
     const uuid = ServerContext.useStoreState(state => state.server.data!.uuid);