Improved configuration.

src/config.js → src/config.ts

@@ -13,12 +13,22 @@ export const COLOR_PALETTE = [
 export const LINK_WIDTH = 3;
 export const HOVER_LINK_WIDTH = 6;
 
+export const NODE_SIZE: [number, number, number] = [8, 8, 8];
+export const HIGHLIGHTED_NODE_SIZE: [number, number, number] = [12, 12, 12];
+
 // Just renaming a variable which is given by the PHP script. This avoids errors in all other files.
+
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore
 export const PLUGIN_PATH = ks_global.plugin_path;
-export var SPACE = ks_global.space_id;
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore
+export let SPACE = ks_global.space_id;
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore
 export const MODE = ks_global.mode;
 
-export function setSpace(space) {
+export function setSpace(space: string) {
     SPACE = space;
 }
 

src/display/renderer.tsx

@@ -20,7 +20,6 @@ import PropTypes, { InferType } from "prop-types";
 import SpriteText from "three-spritetext";
 import { Object3D } from "three";
 import Graph, { Coordinate, LinkData, NodeData } from "./graph";
-// import { graph } from "../editor/js/editor";
 
 export interface GraphNode extends NodeData {
     x: number;
@@ -130,7 +129,7 @@ export class GraphRenderer extends React.Component<
 
         const sprite = new THREE.Sprite(material);
         //sprite.renderOrder = 999; // This may not be optimal. But it allows us to render the sprite on top of everything else.
-        sprite.scale.set(8, 8, 8);
+        sprite.scale.set(...Config.NODE_SIZE);
 
         group.add(sprite);
 
@@ -224,11 +223,13 @@ export class GraphRenderer extends React.Component<
 
         // Update Nodes
         this.highlightedNodes.forEach((node) => {
-            node.__threeObj.children[1].scale.set(8, 8, 8);
+            node.__threeObj.children[1].scale.set(...Config.NODE_SIZE);
         });
         this.highlightedNodes = highlightedNodes;
         this.highlightedNodes.forEach((node) => {
-            node.__threeObj.children[1].scale.set(12, 12, 12);
+            node.__threeObj.children[1].scale.set(
+                ...Config.HIGHLIGHTED_NODE_SIZE
+            );
         });
     }