Fix typescript errors

nix/node-packages.nix

@@ -1813,6 +1813,15 @@ let
         sha512 = "YRRv9DNZhaVTVRh9Wmmit7Y0UFhEVqXqCSw3uazRWMxa2x85hWQZ5BN24i7GXZbaclaLXEcodEeIHsjBA8eAMw==";
       };
     };
+    "@types/react-dom-17.0.3" = {
+      name = "_at_types_slash_react-dom";
+      packageName = "@types/react-dom";
+      version = "17.0.3";
+      src = fetchurl {
+        url = "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.3.tgz";
+        sha512 = "4NnJbCeWE+8YBzupn/YrJxZ8VnjcJq5iR1laqQ1vkpQgBiA7bwk0Rp24fxsdNinzJY2U+HHS4dJJDPdoMjdJ7w==";
+      };
+    };
     "@types/react-redux-7.1.16" = {
       name = "_at_types_slash_react-redux";
       packageName = "@types/react-redux";
@@ -1840,6 +1849,15 @@ let
         sha512 = "7EJYyKTL7tFR8+gDbB6Wwz/arpGa0Mywk1TJbNzKzHtzbwVmY4HR9WqS5VV7dsBUKQmPNr192jHr/VpBluj/hg==";
       };
     };
+    "@types/three-0.127.0" = {
+      name = "_at_types_slash_three";
+      packageName = "@types/three";
+      version = "0.127.0";
+      src = fetchurl {
+        url = "https://registry.npmjs.org/@types/three/-/three-0.127.0.tgz";
+        sha512 = "4Q33L6PzzxCXm0VdUv4x1/4VBnwWgCS7Ui6WpRh88GVIUUYsg5qU2GVzva14hDJbtfyNBxey7UcdInR4RkKPeQ==";
+      };
+    };
     "abab-2.0.5" = {
       name = "abab";
       packageName = "abab";
@@ -9992,9 +10010,11 @@ let
       sources."@types/prop-types-15.7.3"
       sources."@types/q-1.5.4"
       sources."@types/react-16.14.5"
+      sources."@types/react-dom-17.0.3"
       sources."@types/react-redux-7.1.16"
       sources."@types/scheduler-0.16.1"
       sources."@types/sizzle-2.3.2"
+      sources."@types/three-0.127.0"
       sources."abab-2.0.5"
       sources."abortcontroller-polyfill-1.7.1"
       sources."acorn-3.3.0"
@@ -10398,6 +10418,7 @@ let
       (sources."favicons-6.2.1" // {
         dependencies = [
           sources."semver-7.3.5"
+          sources."sharp-0.26.3"
         ];
       })
       sources."file-type-9.0.0"
@@ -11153,11 +11174,6 @@ let
       })
       sources."setimmediate-1.0.5"
       sources."sha.js-2.4.11"
-      (sources."sharp-0.26.3" // {
-        dependencies = [
-          sources."semver-7.3.5"
-        ];
-      })
       sources."shebang-command-1.2.0"
       sources."shebang-regex-1.0.0"
       sources."signal-exit-3.0.3"

package-lock.json

@@ -3191,6 +3191,12 @@
       "integrity": "sha512-7EJYyKTL7tFR8+gDbB6Wwz/arpGa0Mywk1TJbNzKzHtzbwVmY4HR9WqS5VV7dsBUKQmPNr192jHr/VpBluj/hg==",
       "dev": true
     },
+    "@types/three": {
+      "version": "0.127.0",
+      "resolved": "https://registry.npmjs.org/@types/three/-/three-0.127.0.tgz",
+      "integrity": "sha512-4Q33L6PzzxCXm0VdUv4x1/4VBnwWgCS7Ui6WpRh88GVIUUYsg5qU2GVzva14hDJbtfyNBxey7UcdInR4RkKPeQ==",
+      "dev": true
+    },
     "abab": {
       "version": "2.0.5",
       "resolved": "https://registry.npmjs.org/abab/-/abab-2.0.5.tgz",

package.json

@@ -28,6 +28,7 @@
     "@types/react": "^16.9.41",
     "@types/react-dom": "^17.0.3",
     "@types/react-redux": "^7.1.9",
+    "@types/three": "^0.127.0",
     "jstransformer-markdown-it": "^2.1.0",
     "parcel": "2.0.0-beta.2",
     "posthtml-favicons": "^1.3.0",

src/index.ts

@@ -1,4 +1,4 @@
-import $ from "jquery";
+import jQuery from "jquery";
 
 // Helpers
 
@@ -113,7 +113,7 @@ class Typer {
     }
 }
 
-$(document).ready(() => {
+jQuery(($) => {
     let typer = new Typer($(".head-line .typed").get(0), 500, 3000);
     typer.type();
 });

src/lib/js/main.ts

@@ -1,3 +1,5 @@
-import $ from "jquery";
+import jQuery from "jquery";
 
-$(document).ready(() => $("html").removeClass("no-js"));
+jQuery(($) => {
+    $("html").removeClass("no-js")
+})

src/music/components/controls.tsx

@@ -1,9 +1,8 @@
 import React from "react";
-import Redux from "redux";
 import { connect } from "react-redux";
 
 import { State } from "../store";
-import { Title, togglePlay } from "../store/music/types";
+import { Title } from "../store/music/types";
 import Indicator from "./indicator";
 
 type ControlProps = {

src/music/components/indicator.tsx

@@ -2,8 +2,8 @@ import React from "react";
 import { connect } from "react-redux";
 import classNames from "classnames";
 
-import { State } from "../store";
+import { State, Dispatch } from "../store";
-import { MusicState, togglePlay } from "../store/music/types";
+import { togglePlay } from "../store/music/types";
 
 type IndicatorProps = {
     muted: boolean;
@@ -49,7 +49,7 @@ function mapStateToProps(state: State): IndicatorProps {
     };
 }
 
-function mapDispatchToProps(dispatch: Redux.Dispatch<any>): IndicatorDispatch {
+function mapDispatchToProps(dispatch: Dispatch): IndicatorDispatch {
     return {
         play: () => {
             dispatch(togglePlay());

src/music/components/visualizer.tsx

@@ -13,8 +13,8 @@ class CanvasDrawer {
     private analyserData: Float32Array;
 
     private boxes: Array<three.Mesh>;
-  private camera: three.Camera;
+    private camera: three.PerspectiveCamera;
-  private renderer: three.Renderer;
+    private renderer: three.WebGLRenderer;
     private scene: three.Scene;
 
     private angle: number;
@@ -77,7 +77,7 @@ class CanvasDrawer {
             powerPreference: "low-power",
         });
 
-    this.renderer.setClearColor(new three.Color(0x0f0f0f));
+        this.renderer.setClearColor(new three.Color(0x0f0f0f), 1.0);
         this.renderer.setSize(canvas.width, canvas.height);
 
         // Set up canvas resizing

src/music/index.tsx

@@ -5,6 +5,7 @@ import { Provider } from "react-redux";
 import { store } from "./store";
 import MusicPlayer from "./MusicPlayer";
 import { setSource, setTitle } from "./store/music/types";
+// @ts-ignore Can't find module - this is an mp3 file, so...
 import mseq from "./Mseq_-_Journey.mp3";
 
 const rootElement = document.getElementById("playerUI");

src/music/store/index.ts

@@ -13,5 +13,8 @@ const rootReducer = combineReducers<State>({
 
 export const store = createStore(
     rootReducer,
+    // @ts-ignore Missing property - this will only exist if the devtools extension is installed, and is actually what we're checking for
     window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
 );
+
+export type Dispatch = typeof store.dispatch;