From 49de1d0ed49d313767736c3fa89057c43643f2c5 Mon Sep 17 00:00:00 2001 From: Dane Everitt Date: Tue, 17 Sep 2019 21:59:35 -0700 Subject: [PATCH] Fixes for console socket disconnecting with HMR enabled --- package.json | 2 +- .../scripts/components/server/Console.tsx | 2 +- .../components/server/ServerConsole.tsx | 30 ++++++++++++-- .../components/server/WebsocketHandler.tsx | 12 +++++- yarn.lock | 39 ++++++++++--------- 5 files changed, 61 insertions(+), 24 deletions(-) diff --git a/package.json b/package.json index 779f7e655..498c7afc4 100644 --- a/package.json +++ b/package.json @@ -8,7 +8,7 @@ "axios": "^0.18.0", "classnames": "^2.2.6", "date-fns": "^1.29.0", - "easy-peasy": "^2.5.0", + "easy-peasy": "^3.0.2", "events": "^3.0.0", "formik": "^1.5.7", "jquery": "^3.3.1", diff --git a/resources/scripts/components/server/Console.tsx b/resources/scripts/components/server/Console.tsx index 49f49e5ea..a20700792 100644 --- a/resources/scripts/components/server/Console.tsx +++ b/resources/scripts/components/server/Console.tsx @@ -79,7 +79,7 @@ export default () => { className={'rounded-t p-2 bg-black overflow-scroll w-full'} style={{ minHeight: '16rem', - maxHeight: '64rem', + maxHeight: '32rem', }} >
diff --git a/resources/scripts/components/server/ServerConsole.tsx b/resources/scripts/components/server/ServerConsole.tsx index 19a8d9d1b..a93550d7e 100644 --- a/resources/scripts/components/server/ServerConsole.tsx +++ b/resources/scripts/components/server/ServerConsole.tsx @@ -1,18 +1,42 @@ import React from 'react'; import Console from '@/components/server/Console'; import { ServerContext } from '@/state/server'; +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +import { faServer } from '@fortawesome/free-solid-svg-icons/faServer'; +import { faCircle } from '@fortawesome/free-solid-svg-icons/faCircle'; +import classNames from 'classnames'; export default () => { + const server = ServerContext.useStoreState(state => state.server.data!); const status = ServerContext.useStoreState(state => state.status.value); return (
+
+
+
+

+ {server.name} +

+
+
+

+ +  {status} +

+
+
+
-
-

Current status: {status}

-
); }; diff --git a/resources/scripts/components/server/WebsocketHandler.tsx b/resources/scripts/components/server/WebsocketHandler.tsx index 565e96bbf..8ce8faaac 100644 --- a/resources/scripts/components/server/WebsocketHandler.tsx +++ b/resources/scripts/components/server/WebsocketHandler.tsx @@ -4,7 +4,7 @@ import { ServerContext } from '@/state/server'; export default () => { const server = ServerContext.useStoreState(state => state.server.data); - const instance = ServerContext.useStoreState(state => state.socket.instance); + const { instance, connected } = ServerContext.useStoreState(state => state.socket); const setServerStatus = ServerContext.useStoreActions(actions => actions.status.setServerStatus); const { setInstance, setConnectionState } = ServerContext.useStoreActions(actions => actions.socket); @@ -32,5 +32,15 @@ export default () => { }; }, [ server ]); + // Prevent issues with HMR in development environments. This might need to also + // exist outside of dev? Will need to see how things go. + if (process.env.NODE_ENV === 'development') { + useEffect(() => { + if (!connected && instance) { + instance.connect(); + } + }, [ connected ]); + } + return null; }; diff --git a/yarn.lock b/yarn.lock index ffbfa9ae1..8c30ac176 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3015,17 +3015,17 @@ duplexify@^3.4.2, duplexify@^3.6.0: readable-stream "^2.0.0" stream-shift "^1.0.0" -easy-peasy@^2.5.0: - version "2.5.0" - resolved "https://registry.yarnpkg.com/easy-peasy/-/easy-peasy-2.5.0.tgz#5366ff59c71c980cc31ec230dc8855f72b8d2875" +easy-peasy@^3.0.2: + version "3.0.2" + resolved "https://registry.yarnpkg.com/easy-peasy/-/easy-peasy-3.0.2.tgz#1bd9cd589cb6fd930528243b950e13d4f41958a5" dependencies: - immer "^3.1.3" + immer-peasy "3.1.3" memoizerific "^1.11.3" - redux "^4.0.1" + prop-types "^15.6.2" + redux "^4.0.4" redux-thunk "^2.3.0" shallowequal "^1.1.0" - type-zoo "^3.3.0" - typelevel-ts "^0.3.5" + ts-toolbelt "^3.8.0" ee-first@1.1.1: version "1.1.1" @@ -4206,9 +4206,9 @@ ignore@^5.1.1: version "5.1.2" resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.1.2.tgz#e28e584d43ad7e92f96995019cc43b9e1ac49558" -immer@^3.1.3: +immer-peasy@3.1.3: version "3.1.3" - resolved "https://registry.yarnpkg.com/immer/-/immer-3.1.3.tgz#59bc742b2aab6e2c676445edb653e588a23c70fc" + resolved "https://registry.yarnpkg.com/immer-peasy/-/immer-peasy-3.1.3.tgz#d0ea8d388f47ec6b15ab2ca19ffb9f0bf4310110" import-cwd@^2.0.0: version "2.1.0" @@ -6912,13 +6912,20 @@ redux-thunk@^2.3.0: version "2.3.0" resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.3.0.tgz#51c2c19a185ed5187aaa9a2d08b666d0d6467622" -redux@^4.0.0, redux@^4.0.1: +redux@^4.0.0: version "4.0.1" resolved "https://registry.yarnpkg.com/redux/-/redux-4.0.1.tgz#436cae6cc40fbe4727689d7c8fae44808f1bfef5" dependencies: loose-envify "^1.4.0" symbol-observable "^1.2.0" +redux@^4.0.4: + version "4.0.4" + resolved "https://registry.yarnpkg.com/redux/-/redux-4.0.4.tgz#4ee1aeb164b63d6a1bcc57ae4aa0b6e6fa7a3796" + dependencies: + loose-envify "^1.4.0" + symbol-observable "^1.2.0" + regenerate-unicode-properties@^8.1.0: version "8.1.0" resolved "https://registry.yarnpkg.com/regenerate-unicode-properties/-/regenerate-unicode-properties-8.1.0.tgz#ef51e0f0ea4ad424b77bf7cb41f3e015c70a3f0e" @@ -7969,6 +7976,10 @@ ts-loader@^5.3.3: micromatch "^3.1.4" semver "^5.0.1" +ts-toolbelt@^3.8.0: + version "3.14.0" + resolved "https://registry.yarnpkg.com/ts-toolbelt/-/ts-toolbelt-3.14.0.tgz#f4c4984cf4e988915a0175fd6a8ded00bd1d23b0" + tslib@^1.8.1: version "1.9.3" resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.9.3.tgz#d7e4dd79245d85428c4d7e4822a79917954ca286" @@ -8004,18 +8015,10 @@ type-is@~1.6.17, type-is@~1.6.18: media-typer "0.3.0" mime-types "~2.1.24" -type-zoo@^3.3.0: - version "3.3.0" - resolved "https://registry.yarnpkg.com/type-zoo/-/type-zoo-3.3.0.tgz#d5b59393b09a48ac30380c50e2369e828817e9b3" - typedarray@^0.0.6: version "0.0.6" resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777" -typelevel-ts@^0.3.5: - version "0.3.5" - resolved "https://registry.yarnpkg.com/typelevel-ts/-/typelevel-ts-0.3.5.tgz#9f242c193fa6c5489d2342c642ab8912a065af9d" - typescript@^3.6.3: version "3.6.3" resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.6.3.tgz#fea942fabb20f7e1ca7164ff626f1a9f3f70b4da"