Merge pull request #178 from loophole/update-node

Update everything node-related
loophole · Apr 15, 2022 · 5cecf33 · 5cecf33
2 parents d9157b6 + f52b30d
commit 5cecf33
Show file tree

Hide file tree

Showing 6 changed files with 6,322 additions and 7,872 deletions.
diff --git a/.github/workflows/release-dry-run.yml b/.github/workflows/release-dry-run.yml
@@ -25,7 +25,7 @@ jobs:
       - name: Set up Node
         uses: actions/setup-node@v2
         with:
-          node-version: '12'
+          node-version: '16'
 
       - run: yarn --frozen-lockfile
         working-directory: ./ui/desktop

diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
@@ -21,7 +21,7 @@ jobs:
       - name: Set up Node
         uses: actions/setup-node@v2
         with:
-          node-version: '12'
+          node-version: '16'
 
       - run: yarn --frozen-lockfile
         working-directory: ./ui/desktop

diff --git a/ui/desktop/package.json b/ui/desktop/package.json
@@ -3,38 +3,28 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "@fortawesome/fontawesome-free": "^5.15.1",
+    "@fortawesome/fontawesome-free": "^6.1.1",
     "@giantmachines/redux-websocket": "^1.4.0",
     "@reduxjs/toolkit": "^1.5.0",
-    "@testing-library/jest-dom": "^5.11.4",
-    "@testing-library/react": "^11.1.0",
-    "@testing-library/user-event": "^12.1.10",
-    "@types/classnames": "^2.2.11",
-    "@types/jwt-decode": "^3.1.0",
-    "@types/qrcode.react": "^1.0.1",
-    "@types/react-copy-to-clipboard": "^5.0.0",
-    "@types/react-dom": "^17.0.0",
-    "@types/redux-logger": "^3.0.8",
-    "@types/uuid": "^8.3.0",
-    "axios": "^0.21.1",
+    "axios": "^0.26.1",
     "bulma": "^0.9.1",
     "classnames": "^2.2.6",
     "fakefile": "^1.0.0",
     "jwt-decode": "^3.1.2",
-    "node-sass": "^4.14.1",
-    "qrcode.react": "^1.0.0",
-    "react": "^17.0.1",
+    "node-sass": "^7.0.1",
+    "qrcode.react": "^3.0.1",
+    "react": "^18.0.0",
     "react-beforeunload": "^2.4.0",
     "react-copy-to-clipboard": "^5.0.2",
-    "react-dom": "^17.0.1",
+    "react-dom": "^18.0.0",
     "react-redux": "^7.2.2",
     "react-router-dom": "^5.2.0",
-    "react-scripts": "4.0.3",
+    "react-scripts": "5.0.1",
     "redux": "^4.0.5",
     "redux-logger": "^3.0.6",
     "redux-thunk": "^2.3.0",
     "typescript": "^4.1.3",
-    "web-vitals": "^0.2.4"
+    "web-vitals": "^2.1.4"
   },
   "scripts": {
     "start": "react-scripts start",
@@ -61,9 +51,19 @@
     ]
   },
   "devDependencies": {
-    "@types/react": "^17.0.0",
+    "@types/react": "^18.0.5",
     "@types/react-beforeunload": "^2.1.0",
     "@types/react-redux": "^7.1.12",
-    "@types/react-router-dom": "^5.1.6"
+    "@types/react-router-dom": "^5.1.6",
+    "@types/classnames": "^2.2.11",
+    "@types/jwt-decode": "^3.1.0",
+    "@types/qrcode.react": "^1.0.1",
+    "@types/react-copy-to-clipboard": "^5.0.0",
+    "@types/react-dom": "^18.0.1",
+    "@types/redux-logger": "^3.0.8",
+    "@types/uuid": "^8.3.0",
+    "@testing-library/jest-dom": "^5.11.4",
+    "@testing-library/react": "^13.0.1",
+    "@testing-library/user-event": "^14.1.0"
   }
 }
diff --git a/ui/desktop/src/features/tunnels/TunnelInfo.tsx b/ui/desktop/src/features/tunnels/TunnelInfo.tsx
@@ -1,5 +1,5 @@
 import React from "react";
-import QRCode from "qrcode.react";
+import QRCodeCanvas from "qrcode.react";
 
 import OpenCopyBlock from "../../components/routing/OpenCopyBlock";
 import Tunnel from "./interfaces/Tunnel";
@@ -30,10 +30,8 @@ const TunnelInfo = (props: TunnelInfoProps) => {
       <div className="has-text-centered">
         {tunnel.started && tunnel.siteAddrs && tunnel.siteAddrs[0] ? (
           <div className="qrcode-container">
-            <QRCode
+            <QRCodeCanvas
               value={tunnel.siteAddrs[0]}
-              renderAs="canvas"
-              width="80%"
               size={256}
               level="H"
             />

diff --git a/ui/desktop/src/pages/Login.js b/ui/desktop/src/pages/Login.js
@@ -1,7 +1,7 @@
 import { useSelector, useDispatch } from "react-redux";
 import { useHistory, useLocation } from "react-router-dom";
 
-import QRCode from "qrcode.react";
+import QRCodeSVG from "qrcode.react";
 import { send } from "@giantmachines/redux-websocket";
 
 import { useAuth } from "../features/config/authProvider";
@@ -52,10 +52,8 @@ const LoginPage = () => {
           <div className="column is-12">
             <p className="title is-3">QR Code</p>
             <p className="content has-text-centered">
-              <QRCode
-                renderAs="svg"
+              <QRCodeSVG
                 size={256}
-                width="80%"
                 level="H"
                 value={appState.authInstructions.verificationUriComplete}
               />