Dep updates

TwoAbove · Jan 26, 2025 · 490d16c · 490d16c
1 parent 2f196f4
commit 490d16c
Show file tree

Hide file tree

Showing 11 changed files with 1,147 additions and 1,259 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -6,122 +6,122 @@
   "homepage": "https://www.noitool.com/",
   "dependencies": {
     "@gideo-llc/backblaze-b2-upload-any": "^0.1.4",
-    "@napi-rs/canvas": "^0.1.59",
+    "@napi-rs/canvas": "^0.1.65",
     "@types/yargs": "^17.0.33",
     "backblaze-b2": "^1.7.0",
     "body-parser": "^1.20.3",
     "cookie-parser": "^1.4.7",
-    "discord.js": "^14.16.3",
+    "discord.js": "^14.17.3",
     "dotenv-flow": "^4.1.0",
-    "express": "^4.21.1",
-    "express-rate-limit": "^7.4.1",
-    "mongoose": "^8.7.3",
+    "express": "^4.21.2",
+    "express-rate-limit": "^7.5.0",
+    "mongoose": "^8.9.5",
     "morgan": "^1.10.0",
     "multer": "^1.4.5-lts.1",
     "node-cron": "^3.0.3",
     "patreon": "^0.4.1",
     "react-countdown-circle-timer": "^3.2.1",
-    "react-use-search-params-state": "^1.0.3",
+    "react-use-search-params-state": "^2.0.1",
     "serve-handler": "^6.1.6",
     "socket.io": "4.8.1",
     "yargs": "^17.7.2"
   },
   "devDependencies": {
     "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
     "@loadable/component": "^5.16.4",
-    "@swc/helpers": "^0.5.13",
-    "@tanstack/react-query": "^5.59.16",
-    "@testing-library/cypress": "^10.0.2",
-    "@testing-library/jest-dom": "^6.6.2",
+    "@swc/helpers": "^0.5.15",
+    "@tanstack/react-query": "^5.64.2",
+    "@testing-library/cypress": "^10.0.3",
+    "@testing-library/jest-dom": "^6.6.3",
     "@types/backblaze-b2": "^1.5.6",
     "@types/cli-progress": "^3.11.6",
     "@types/glob": "^8.1.0",
     "@types/js-cookie": "^3.0.6",
     "@types/loadable__component": "^5.13.9",
-    "@types/lodash": "^4.17.13",
+    "@types/lodash": "^4.17.14",
     "@types/luaparse": "^0.2.12",
-    "@types/node": "^22.8.4",
+    "@types/node": "^22.10.10",
     "@types/node-cron": "^3.0.11",
     "@types/offscreencanvas": "^2019.7.3",
-    "@types/react": "^18.3.12",
-    "@types/react-dom": "^18.3.1",
+    "@types/react": "^19.0.8",
+    "@types/react-dom": "^19.0.3",
     "@types/recursive-readdir": "^2.2.4",
     "@types/w3c-image-capture": "^1.0.10",
     "@types/xml2js": "^0.4.14",
     "@types/xmldom": "^0.1.34",
-    "@vitejs/plugin-react-swc": "^3.7.1",
-    "axios": "^1.7.7",
+    "@vitejs/plugin-react-swc": "^3.7.2",
+    "axios": "^1.7.9",
     "browserslist-to-esbuild": "^2.1.1",
     "canvaskit-wasm": "^0.39.1",
     "classnames": "^2.5.1",
     "cli-progress": "^3.12.0",
-    "comlink": "^4.4.1",
-    "concurrently": "^9.0.1",
+    "comlink": "^4.4.2",
+    "concurrently": "^9.1.2",
     "copy-to-clipboard": "^3.3.3",
-    "csv-parse": "^5.5.6",
-    "cypress": "13.15.1",
-    "decimal.js": "^10.4.3",
-    "dexie": "^4.0.9",
-    "dexie-export-import": "^4.1.2",
+    "csv-parse": "^5.6.0",
+    "cypress": "14.0.0",
+    "decimal.js": "^10.5.0",
+    "dexie": "^4.0.11",
+    "dexie-export-import": "^4.1.4",
     "dexie-react-hooks": "^1.1.7",
     "directory-tree": "^3.5.2",
-    "esbuild": "^0.24.0",
-    "eslint-config-prettier": "^9.1.0",
+    "esbuild": "^0.24.2",
+    "eslint-config-prettier": "^10.0.1",
     "eslint-plugin-cypress": "^4.1.0",
     "fast-deep-equal": "^3.1.3",
     "fuse.js": "^7.0.0",
     "gifwrap": "^0.10.1",
-    "glob": "^11.0.0",
+    "glob": "^11.0.1",
     "http-proxy-middleware": "^3.0.3",
     "humanize-duration": "^3.32.1",
-    "husky": "^9.1.6",
+    "husky": "^9.1.7",
     "i18next": "^23.16.4",
     "i18next-browser-languagedetector": "^8.0.0",
     "i18next-http-backend": "^2.6.2",
     "image-capture": "^0.4.0",
     "jimp": "^1.6.0",
     "js-cookie": "^3.0.5",
-    "lint-staged": "^15.2.10",
+    "lint-staged": "^15.4.2",
     "lodash": "^4.17.21",
     "log-update": "^6.1.0",
     "lua-json": "^1.0.1",
     "lua2js": "^0.0.11",
     "luaparse": "^0.3.1",
-    "nodemon": "^3.1.7",
-    "p-limit": "^6.1.0",
+    "nodemon": "^3.1.9",
+    "p-limit": "^6.2.0",
     "pixelmatch": "^6.0.0",
-    "prettier": "^3.3.3",
-    "react": "^18.3.1",
-    "react-bootstrap": "^2.10.5",
-    "react-dark-mode-toggle-2": "^2.0.9",
+    "prettier": "^3.4.2",
+    "react": "^19.0.0",
+    "react-bootstrap": "^2.10.8",
+    "react-dark-mode-toggle-2": "^2.1.1",
     "react-dev-utils": "^12.0.1",
     "react-dnd": "^16.0.1",
     "react-dnd-html5-backend": "^16.0.1",
-    "react-dnd-multi-backend": "^8.0.3",
+    "react-dnd-multi-backend": "^8.1.2",
     "react-dnd-touch-backend": "^16.0.1",
-    "react-dom": "^18.3.1",
-    "react-dropzone": "^14.2.10",
+    "react-dom": "^19.0.0",
+    "react-dropzone": "^14.3.5",
     "react-fast-marquee": "^1.6.5",
     "react-i18next": "^15.1.0",
     "react-merge-refs": "^2.1.1",
-    "react-router-dom": "6",
+    "react-router-dom": "7",
     "react-slider": "^2.0.6",
-    "react-use-search-params-state": "^1.0.3",
-    "react-virtualized": "^9.22.5",
+    "react-use-search-params-state": "^2.0.1",
+    "react-virtualized": "^9.22.6",
     "recursive-readdir": "^2.2.3",
     "segfault-handler": "^1.3.0",
     "sharp": "^0.33.5",
     "simple-eta": "^3.0.2",
     "socket.io-client": "4.8.1",
     "source-map-explorer": "^2.5.3",
-    "tesseract.js": "^5",
+    "tesseract.js": "^6",
     "ts-node": "^10.9.2",
-    "tslib": "^2.8.0",
-    "typescript": "^5.6.3",
+    "tslib": "^2.8.1",
+    "typescript": "^5.7.3",
     "use-deep-compare-effect": "^1.8.1",
-    "vite": "^5.4.10",
+    "vite": "^6.0.11",
     "vite-plugin-comlink": "^5.1.0",
-    "vitest": "^2.1.4",
+    "vitest": "^3.0.4",
     "web-vitals": "^4.2.4",
     "xml2js": "^0.6.2",
     "xmldom": "^0.6.0"
@@ -164,7 +164,7 @@
     ]
   },
   "optionalDependencies": {
-    "bufferutil": "^4.0.8",
-    "utf-8-validate": "^6.0.4"
+    "bufferutil": "^4.0.9",
+    "utf-8-validate": "^6.0.5"
   }
 }
diff --git a/src/components/LiveSeedStats/LiveSeedStats.tsx b/src/components/LiveSeedStats/LiveSeedStats.tsx
@@ -212,7 +212,7 @@ const LiveSeedStats = () => {
   // We need a way for the OCR handler to notify of a state change.
   // Maybe refactoring this is the way to go, but I'm not sure how to
   // make it simpler?
-  const canvasRef = useRef(null);
+  const canvasRef = useRef<HTMLCanvasElement>(null);
 
   const [lastSeed, setLastSeed] = useState<string>();
   const forceUpdate = useForceUpdate();

diff --git a/src/components/LiveSeedStats/OCRHandler/index.ts b/src/components/LiveSeedStats/OCRHandler/index.ts
@@ -24,7 +24,7 @@ const startCapture = async (displayMediaOptions: MediaStreamConstraints): Promis
 };
 
 interface OCRConfig {
-  canvasRef?: React.RefObject<HTMLCanvasElement>;
+  canvasRef?: React.RefObject<HTMLCanvasElement | null>;
   onUpdate?: () => void;
 }
 class OCRHandler extends EventTarget {
@@ -37,7 +37,7 @@ class OCRHandler extends EventTarget {
 
   fontData!: IFontCanvases;
 
-  canvasRef?: React.RefObject<HTMLCanvasElement>;
+  canvasRef?: OCRConfig["canvasRef"];
   onUpdate: () => void;
 
   lastCapture = new Date();
@@ -74,12 +74,6 @@ class OCRHandler extends EventTarget {
       // logger: console.log,
       // logger: this.canvasRef ? console.log : () => { },
     });
-    await worker.setParameters({
-      tessedit_pageseg_mode: Tesseract.PSM.AUTO_ONLY, // https://github.com/tesseract-ocr/tesseract/blob/4.0.0/src/ccstruct/publictypes.h#L163
-      tessjs_create_hocr: "0",
-      tessjs_create_tsv: "0",
-      tessjs_create_box: "0",
-    });
 
     if (this.tesseractWorker) {
       await this.tesseractWorker.terminate();
@@ -204,8 +198,20 @@ class OCRHandler extends EventTarget {
       ctx.drawImage(img, 0, 0);
     }
 
-    const res = await this.tesseractWorker.recognize(img as any);
-    const secondLine = res.data.lines[1]; // seed is on the second line always
+    const res = await this.tesseractWorker.recognize(
+      img as any,
+      {},
+      {
+        text: true,
+        blocks: true,
+        debug: true,
+      },
+    );
+    if (!res.data || !res.data.blocks) {
+      return;
+    }
+    const lines = res.data.blocks.map(block => block.paragraphs.map(paragraph => paragraph.lines)).flat(2);
+    const secondLine = lines[1]; // seed is on the second line always
     if (!secondLine) {
       return;
     }

diff --git a/src/components/Patrons.tsx b/src/components/Patrons.tsx
@@ -1,4 +1,4 @@
-import React, { FC, useState, useEffect } from "react";
+import React, { FC, useState, useEffect, ReactElement } from "react";
 import { Row, Col } from "react-bootstrap";
 import Marquee from "react-fast-marquee";
 import { useIsOverflow } from "./helpers";
@@ -93,7 +93,7 @@ const Patrons = () => {
       });
   }, []);
 
-  const elements: JSX.Element[] = Object.entries(patrons)
+  const elements: ReactElement[] = Object.entries(patrons)
     .sort(([, a], [, b]) => b.tier.attributes.amount_cents - a.tier.attributes.amount_cents)
     .map(([tierId, tier]) => (
       <Col key={tierId} className="p-2">

diff --git a/src/components/SearchSeeds/RuleList.tsx b/src/components/SearchSeeds/RuleList.tsx
@@ -1,4 +1,4 @@
-import React, { FC, useContext, useEffect, useRef, useState } from "react";
+import React, { FC, useCallback, useContext, useEffect, useRef, useState } from "react";
 import {
   Container,
   Stack,
@@ -35,6 +35,17 @@ const treeTools = getTreeTools("id", "rules");
 
 type IIDRule = IRule & { id: string };
 
+function useDragRef(drag: (el: HTMLDivElement) => void) {
+  return useCallback(
+    (element: HTMLDivElement | null) => {
+      if (element) {
+        drag(element);
+      }
+    },
+    [drag],
+  );
+}
+
 interface IRuleProps extends IIDRule {
   deletable?: boolean;
   draggable?: boolean;
@@ -54,6 +65,8 @@ const Rule: FC<IRuleProps> = ({ id, type, deletable, draggable, titleProps, high
     [id, type, deletable, draggable],
   );
 
+  const handleDragRef = useDragRef(drag);
+
   const active = ruleTree.selectedRule === id;
 
   const handleDelete = () => {
@@ -65,7 +78,7 @@ const Rule: FC<IRuleProps> = ({ id, type, deletable, draggable, titleProps, high
 
   return (
     <Stack direction="horizontal" gap={2} className="align-items-center" ref={dragPreview} {...(collected as any)}>
-      {draggable && <i className="bi bi-grip-vertical" ref={drag}></i>}
+      {draggable && <i className="bi bi-grip-vertical" ref={handleDragRef}></i>}
       <ListGroup.Item
         active={active}
         action
@@ -92,7 +105,7 @@ const LogicRule: FC<ILogicRuleProps> = ({ type, id, rules, deletable, draggable
   const handleDelete = () => {
     ruleDispatch({ action: "delete", data: id });
   };
-  const [dragProps, dragRef, dragPreviewRef] = useDrag(
+  const [dragProps, drag, dragPreview] = useDrag(
     () => ({
       type: "rule",
       item: { id },
@@ -103,7 +116,10 @@ const LogicRule: FC<ILogicRuleProps> = ({ type, id, rules, deletable, draggable
     [id, type, rules, deletable, draggable],
   );
 
-  const [dropProps, dropRef] = useDrop(
+  const dragRef = useDragRef(drag);
+  const dragPreviewRef = useDragRef(dragPreview);
+
+  const [dropProps, drop] = useDrop(
     () => ({
       accept: "rule",
       drop: (item: any, monitor) => {
@@ -141,6 +157,7 @@ const LogicRule: FC<ILogicRuleProps> = ({ type, id, rules, deletable, draggable
     }),
     [id, type, rules, deletable, draggable],
   );
+  const dropRef = useDragRef(drop);
   const rule = RuleConstructors[type];
   return (
     <Card

diff --git a/src/components/SearchSeeds/ruleReducer.tsx b/src/components/SearchSeeds/ruleReducer.tsx
@@ -47,7 +47,7 @@ interface IImportAction {
 
 type IActions = IAddAction | ISelectAction | IUpdateAction | IDeleteAction | IMoveAction | IImportAction;
 
-export const initialRuleState = {
+export const initialRuleState: IState = {
   id: "root",
   type: RuleType.AND,
   rules: [],

diff --git a/src/components/SeedInfo/SeedInfoViews/Alchemy.tsx b/src/components/SeedInfo/SeedInfoViews/Alchemy.tsx
@@ -1,4 +1,4 @@
-import React, { FC, useContext } from "react";
+import React, { FC, ReactElement, useContext } from "react";
 import { Card, CardGroup, Container, ListGroup, ListGroupItem, Stack } from "react-bootstrap";
 
 import GameInfoProvider from "../../../services/SeedInfo/infoHandler";
@@ -16,7 +16,7 @@ interface IAlchemyProps {
   infoProvider: GameInfoProvider;
 }
 
-const AlchemyCard: FC<{ materials: string[]; Title: JSX.Element }> = ({ materials, Title }) => {
+const AlchemyCard: FC<{ materials: string[]; Title: ReactElement }> = ({ materials, Title }) => {
   const { isFavorite } = useMaterialFavorite();
   return (
     <Card style={{ width: "12rem" }}>

diff --git a/src/components/SeedInfo/SeedInfoViews/HolyMountain.tsx b/src/components/SeedInfo/SeedInfoViews/HolyMountain.tsx
@@ -1,5 +1,16 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
-import React, { createContext, FC, memo, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
+import React, {
+  createContext,
+  FC,
+  memo,
+  ReactElement,
+  useCallback,
+  useContext,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from "react";
 import { Button, Col, Form, Stack, Modal, Row, Table } from "react-bootstrap";
 
 import GameInfoProvider from "../../../services/SeedInfo/infoHandler";
@@ -327,7 +338,7 @@ interface IHolyMountainHeaderProps {
   lotteries: number;
   setAdvanced: (boolean) => void;
   handleOffset: (type: "+" | "-") => void;
-  offsetText: () => JSX.Element;
+  offsetText: () => ReactElement;
   handleReset: () => void;
   handleBack: () => void;
   isPerkFavorite: (string) => boolean;