Cleanup and update some dependencies

Author: DaneEveritt

package.json

@@ -5,20 +5,19 @@
         "@fortawesome/free-solid-svg-icons": "^5.15.1",
         "@fortawesome/react-fontawesome": "^0.1.11",
         "@tailwindcss/forms": "^0.2.1",
-        "axios": "^0.19.2",
+        "axios": "^0.21.1",
         "chart.js": "^2.8.0",
         "codemirror": "^5.57.0",
-        "date-fns": "^2.14.0",
+        "date-fns": "^2.16.1",
         "debounce": "^1.2.0",
         "deepmerge": "^4.2.2",
-        "easy-peasy": "^3.3.1",
+        "easy-peasy": "^4.0.1",
         "events": "^3.0.0",
-        "formik": "^2.1.4",
+        "formik": "^2.2.6",
         "i18next": "^19.0.0",
         "i18next-chained-backend": "^2.0.0",
         "i18next-localstorage-backend": "^3.0.0",
         "i18next-xhr-backend": "^3.2.2",
-        "jquery": "^3.3.1",
         "path": "^0.12.7",
         "query-string": "^6.7.0",
         "react": "^16.13.1",
@@ -27,10 +26,8 @@
         "react-fast-compare": "^3.2.0",
         "react-ga": "^3.1.2",
         "react-google-recaptcha": "^2.0.1",
-        "react-helmet": "^6.1.0",
         "react-hot-loader": "^4.12.21",
         "react-i18next": "^11.2.1",
-        "react-redux": "^7.1.0",
         "react-router-dom": "^5.1.2",
         "react-transition-group": "^4.4.1",
         "reaptcha": "^1.7.2",
@@ -103,7 +100,6 @@
         "terser-webpack-plugin": "^3.0.6",
         "twin.macro": "^2.0.7",
         "typescript": "^3.9.6",
-        "typescript-plugin-tw-template": "^2.0.1",
         "webpack": "^4.43.0",
         "webpack-assets-manifest": "^3.1.1",
         "webpack-bundle-analyzer": "^3.8.0",

resources/scripts/components/App.tsx

@@ -7,7 +7,6 @@ import { store } from '@/state';
 import DashboardRouter from '@/routers/DashboardRouter';
 import ServerRouter from '@/routers/ServerRouter';
 import AuthenticationRouter from '@/routers/AuthenticationRouter';
-import { Provider } from 'react-redux';
 import { SiteSettings } from '@/state/settings';
 import ProgressBar from '@/components/elements/ProgressBar';
 import NotFound from '@/components/screens/NotFound';
@@ -76,20 +75,18 @@ const App = () => {
             <GlobalStylesheet/>
             <TailwindGlobalStyles/>
             <StoreProvider store={store}>
-                <Provider store={store}>
-                    <ProgressBar/>
-                    <div css={tw`mx-auto w-auto`}>
-                        <Router history={history}>
-                            {SiteConfiguration?.analytics && <Pageview/>}
-                            <Switch>
-                                <Route path="/server/:id" component={ServerRouter}/>
-                                <Route path="/auth" component={AuthenticationRouter}/>
-                                <Route path="/" component={DashboardRouter}/>
-                                <Route path={'*'} component={NotFound}/>
-                            </Switch>
-                        </Router>
-                    </div>
-                </Provider>
+                <ProgressBar/>
+                <div css={tw`mx-auto w-auto`}>
+                    <Router history={history}>
+                        {SiteConfiguration?.analytics && <Pageview/>}
+                        <Switch>
+                            <Route path="/server/:id" component={ServerRouter}/>
+                            <Route path="/auth" component={AuthenticationRouter}/>
+                            <Route path="/" component={DashboardRouter}/>
+                            <Route path={'*'} component={NotFound}/>
+                        </Switch>
+                    </Router>
+                </div>
             </StoreProvider>
         </>
     );

resources/scripts/components/elements/PageContentBlock.tsx

@@ -1,9 +1,8 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import ContentContainer from '@/components/elements/ContentContainer';
 import { CSSTransition } from 'react-transition-group';
 import tw from 'twin.macro';
 import FlashMessageRender from '@/components/FlashMessageRender';
-import { Helmet } from 'react-helmet';
 
 export interface PageContentBlockProps {
     title?: string;
@@ -12,14 +11,15 @@ export interface PageContentBlockProps {
 }
 
 const PageContentBlock: React.FC<PageContentBlockProps> = ({ title, showFlashKey, className, children }) => {
+    useEffect(() => {
+        if (title) {
+            document.title = title;
+        }
+    }, [ title ]);
+
     return (
         <CSSTransition timeout={150} classNames={'fade'} appear in>
             <>
-                {title &&
-                <Helmet>
-                    <title>{title}</title>
-                </Helmet>
-                }
                 <ContentContainer css={tw`my-4 sm:my-10`} className={className}>
                     {showFlashKey &&
                     <FlashMessageRender byKey={showFlashKey} css={tw`mb-4`}/>

resources/scripts/components/server/ServerConsole.tsx

@@ -18,8 +18,7 @@ const ChunkedStatGraphs = lazy(() => import(/* webpackChunkName: "graphs" */'@/c
 const ServerConsole = () => {
     const isInstalling = ServerContext.useStoreState(state => state.server.data!.isInstalling);
     const isTransferring = ServerContext.useStoreState(state => state.server.data!.isTransferring);
-    // @ts-ignore
-    const eggFeatures: string[] = ServerContext.useStoreState(state => state.server.data!.eggFeatures, isEqual);
+    const eggFeatures = ServerContext.useStoreState(state => state.server.data!.eggFeatures, isEqual);
 
     return (
         <ServerContentBlock title={'Console'} css={tw`flex flex-wrap`}>

resources/scripts/components/server/network/NetworkContainer.tsx

@@ -17,8 +17,7 @@ const NetworkContainer = () => {
     const [ loading, setLoading ] = useState(false);
     const uuid = ServerContext.useStoreState(state => state.server.data!.uuid);
     const allocationLimit = ServerContext.useStoreState(state => state.server.data!.featureLimits.allocations);
-    // @ts-ignore
-    const allocations: Allocation[] = ServerContext.useStoreState(state => state.server.data!.allocations, isEqual);
+    const allocations = ServerContext.useStoreState(state => state.server.data!.allocations, isEqual);
     const setServerFromState = ServerContext.useStoreActions(actions => actions.server.setServerFromState);
 
     const { clearFlashes, clearAndAddHttpError } = useFlash();

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

@@ -53,8 +53,7 @@ export default ({ match, history, location: { state } }: RouteComponentProps<Par
     const [ isLoading, setIsLoading ] = useState(true);
     const [ showEditModal, setShowEditModal ] = useState(false);
 
-    // @ts-ignore
-    const schedule: Schedule | undefined = ServerContext.useStoreState(st => st.schedules.data.find(s => s.id === state.schedule?.id), isEqual);
+    const schedule = ServerContext.useStoreState(st => st.schedules.data.find(s => s.id === state.schedule?.id), isEqual);
     const appendSchedule = ServerContext.useStoreActions(actions => actions.schedules.appendSchedule);
 
     useEffect(() => {

resources/scripts/components/server/settings/SettingsContainer.tsx

@@ -19,11 +19,7 @@ export default () => {
     const id = ServerContext.useStoreState(state => state.server.data!.id);
     const uuid = ServerContext.useStoreState(state => state.server.data!.uuid);
     const node = ServerContext.useStoreState(state => state.server.data!.node);
-    const sftp = ServerContext.useStoreState(
-        state => state.server.data!.sftpDetails,
-        // @ts-ignore
-        isEqual,
-    );
+    const sftp = ServerContext.useStoreState(state => state.server.data!.sftpDetails, isEqual);
 
     return (
         <ServerContentBlock title={'Settings'}>

resources/scripts/components/server/startup/StartupContainer.tsx

@@ -25,7 +25,6 @@ const StartupContainer = () => {
         variables: server.data!.variables,
         invocation: server.data!.invocation,
         dockerImage: server.data!.dockerImage,
-        // @ts-ignore
     }), isEqual);
 
     const { data, error, isValidating, mutate } = getServerStartup(uuid, {