typescriptification: settings & fixes edition

package.json

@@ -11,6 +11,7 @@
 	"license": "BSD-3-Clause",
 	"dependencies": {
 		"@ltd/j-toml": "^1.30.0",
+		"@types/react": "^18.0.17",
 		"chokidar": "^3.5.3",
 		"idb-keyval": "^6.2.0",
 		"nests": "^2.3.1",

src/api/plugin.ts

@@ -16,7 +16,7 @@ const ctxNest: Nest<any> = nests.make(); //Plugin context nest (I would create t
 let pluginNest: Nest<{plugins: any}>;
 
 const pluginEval = (iife: string) => (0, eval)(iife); //defined as a separate function in case we want to do more things on plugin eval later
-async function savePlugin(eve: string, { path, value }: { path: string, value: any }) {
+async function savePlugin(eve: string, { path, value }: { path: string[] | string, value: any }) {
 	logger.debug(
 		["Plugins"],
 		`Got ${eve} event for plugin manager's nest with path ${path} and val ${value}`

src/api/ui/settings/hummus.tsx

@@ -4,8 +4,12 @@ import webpack from "../../webpack";
 
 const Checkbox = webpack.findByDisplayName("Checkbox");
 
-export default class HummusUI extends React.Component {
-	constructor(props) {
+interface HummusUI extends React.Component {
+	state: { tg: number } //we love jank!
+}
+
+class HummusUI extends React.Component {
+	constructor(props: any) {
 		super(props);
 		this.state = {
 			tg: 0
@@ -27,9 +31,9 @@ export default class HummusUI extends React.Component {
 									onChange={async () => {
 										toggle(k);
 										const ele =
-											document.getElementsByClassName(
+											(document.getElementsByClassName(
 												`demon-stub-plugin-checkbox-${k}`
-											)[0];
+											)[0]) as HTMLInputElement;
 										//ele.value = extNest.ghost.pluginsStatus[k].running
 										if (!extNest.ghost.plugins[k].enabled) {
 											ele.value = "on";
@@ -49,3 +53,5 @@ export default class HummusUI extends React.Component {
 		);
 	}
 }
+
+export default HummusUI

src/api/ui/settings/plugincard.tsx

@@ -10,7 +10,10 @@ const Button = webpack.findByProps("BorderColors", "Colors");
 const FormDivider = webpack.findByDisplayName("FormDivider");
 const Switch = webpack.findByDisplayName("Switch");
 
-export default (props) => {
+export default (props: {
+	nest: Nest<{plugins: any}>,
+	name: string
+}) => {
 	nestsReact.useNest(props.nest);
 	if (!props.nest.ghost.plugins[props.name]) {
 		return null; //you wouldn't think i'd have to do this but

src/api/ui/settings/plugins.tsx

@@ -6,7 +6,7 @@
 import { React, nests, nestsReact } from "../../common";
 import { add } from "../../plugin";
 import webpack from "../../webpack";
-import PlugCard from "./plugincard.jsx";
+import PlugCard from "./plugincard";
 
 const Header = webpack.findByProps("Sizes", "Tags");
 const FormDivider = webpack.findByDisplayName("FormDivider");
@@ -15,7 +15,7 @@ const TextInput = webpack.findByDisplayName("TextInput");
 const Button = webpack.findByProps("BorderColors", "Colors");
 
 export default () => {
-	const extNest = demon.summon("internal/nest");
+	const extNest: Nest<{plugins: any}> = demon.summon("internal/nest");
 	const [input, setInput] = React.useState("");
 	nestsReact.useNest(extNest);
 	return (
@@ -28,7 +28,7 @@ export default () => {
 					type="text"
 					value={input}
 					onChange={setInput}
-					onKeyDown={async (eve) => {
+					onKeyDown={async (eve: {key: string}) => {
 						if (eve.key === "Enter") {
 							const text = await (
 								await fetch("$_CORS_URL" + input)

src/api/ui/settings/settings.ts

@@ -1,7 +1,7 @@
 import webpack from "../../webpack";
 import { after } from "../../patcher";
-import plugins from "./plugins.jsx";
-import hummus from "./hummus.jsx";
+import plugins from "./plugins.js";
+import hummus from "./hummus.js";
 import css from "../../css";
 import { React } from "../../common";
 
@@ -106,11 +106,11 @@ function init() {
 	}
 }
 
-function add(name, ele) {
+function add(name: string, ele: () => JSX.Element) {
 	const idx =
 		pluginSettings.push({
 			section: "demoncord-plugins",
-			label: "name",
+			label: name,
 			element: ele
 		}) - 1;
 	return () => {

src/global.d.ts

@@ -1,13 +1,33 @@
 interface Nest<Schema> {
 	ghost: Schema,
 	store: Schema,
-	on: (event: string, callback: (eve: string, { path, value }: { path: string, value: any }) => void) => void
+	on: (event: string, callback: (eve: string, { path, value }: { path: string[] | string, value: any }) => void) => void,
+	get: any,
+	set: any,
+	delete: any,
+	update: any,
+	listeners: any,
+	once: any,
+	off: any,
+	emit: any
 }
 
-declare const demon: {
+const demon: {
     summon: (mod: string) => any
 }
 
 interface Window {
 	beelzejuice: Uint8Array[]
+	webpackChunkdiscord_app: any
+}
+
+namespace JSX {
+	interface IntrinsicElements {
+		hr: any
+		svg: any
+		path: any
+		div: any
+		label: any
+		span: any
+	}
 }

tsconfig.json

@@ -1,8 +1,9 @@
 {
 	"compilerOptions": {
-    "paths": {
-      "nests/*": ["./node_modules/nests/esm/*"]
-    },
+		"jsx": "preserve",
+		"paths": {
+		  "nests/*": ["./node_modules/nests/esm/*"]
+		},
 		/* Visit https://aka.ms/tsconfig.json to read more about this file */
 		/* Language and Environment */
 		"target": "ESNext",