structural and naming lint (#724)

This commit is contained in:
Michael Quigley 2025-01-09 13:54:26 -05:00
parent 70a1a43a9a
commit 272cc87797
No known key found for this signature in database
GPG Key ID: 9B60314A9DD20A62
3 changed files with 19 additions and 19 deletions

View File

@ -1,6 +1,6 @@
import {JSX, useCallback, useEffect, useRef, useState} from "react"; import {JSX, useCallback, useEffect, useRef, useState} from "react";
import {Configuration, MetadataApi} from "./api"; import {Configuration, MetadataApi} from "./api";
import {layout, mergeVisualOverview, nodesEqual, VisualOverview} from "./model/visualizer.ts"; import {Graph, layout, mergeGraph, nodesEqual} from "./model/graph.ts";
import {Grid2} from "@mui/material"; import {Grid2} from "@mui/material";
import NavBar from "./NavBar.tsx"; import NavBar from "./NavBar.tsx";
import Visualizer from "./Visualizer.tsx"; import Visualizer from "./Visualizer.tsx";
@ -17,9 +17,9 @@ interface ApiConsoleProps {
const ApiConsole = ({ logout }: ApiConsoleProps) => { const ApiConsole = ({ logout }: ApiConsoleProps) => {
const user = useStore((state) => state.user); const user = useStore((state) => state.user);
const overview = useStore((state) => state.overview); const graph = useStore((state) => state.graph);
const updateOverview = useStore((state) => state.updateOverview); const updateGraph = useStore((state) => state.updateGraph);
const oldVov = useRef<VisualOverview>(overview); const oldGraph = useRef<Graph>(graph);
const updateNodes = useStore((state) => state.updateNodes); const updateNodes = useStore((state) => state.updateNodes);
const updateEdges = useStore((state) => state.updateEdges); const updateEdges = useStore((state) => state.updateEdges);
const selectedNode = useStore((state) => state.selectedNode); const selectedNode = useStore((state) => state.selectedNode);
@ -55,11 +55,11 @@ const ApiConsole = ({ logout }: ApiConsoleProps) => {
let api = new MetadataApi(cfg); let api = new MetadataApi(cfg);
api.overview() api.overview()
.then(d => { .then(d => {
let newVov = mergeVisualOverview(oldVov.current, user, d.accountLimited!, d); let newVov = mergeGraph(oldGraph.current, user, d.accountLimited!, d);
if(!nodesEqual(oldVov.current.nodes, newVov.nodes)) { if(!nodesEqual(oldGraph.current.nodes, newVov.nodes)) {
console.log("refreshed vov", oldVov.current.nodes, newVov.nodes); console.log("refreshed vov", oldGraph.current.nodes, newVov.nodes);
updateOverview(newVov); updateGraph(newVov);
oldVov.current = newVov; oldGraph.current = newVov;
let laidOut = layout(newVov.nodes, newVov.edges); let laidOut = layout(newVov.nodes, newVov.edges);
let selected = laidOut.nodes.map((n) => ({ let selected = laidOut.nodes.map((n) => ({

View File

@ -3,13 +3,13 @@ import {Edge, Node} from "@xyflow/react";
import {User} from "./user.ts"; import {User} from "./user.ts";
import {stratify, tree} from "d3-hierarchy"; import {stratify, tree} from "d3-hierarchy";
export class VisualOverview { export class Graph {
nodes: Node[]; nodes: Node[];
edges: Edge[]; edges: Edge[];
} }
export const mergeVisualOverview = (oldVov: VisualOverview, u: User, limited: boolean, newOv: Overview): VisualOverview => { export const mergeGraph = (oldVov: Graph, u: User, limited: boolean, newOv: Overview): Graph => {
let newVov = new VisualOverview(); let newVov = new Graph();
let accountNode = { let accountNode = {
id: u.token, id: u.token,
@ -152,7 +152,7 @@ export const nodesEqual = (a: Node[], b: Node[]) => {
return a.every((e, i) => e.id === b[i].id && e.data.limited === b[i].data.limited && e.data.label === b[i].data.label); return a.every((e, i) => e.id === b[i].id && e.data.limited === b[i].data.limited && e.data.label === b[i].data.label);
} }
export const layout = (nodes, edges): VisualOverview => { export const layout = (nodes, edges): Graph => {
if(!nodes) { if(!nodes) {
return { nodes: [], edges: [] }; return { nodes: [], edges: [] };
} }
@ -170,5 +170,5 @@ export const layout = (nodes, edges): VisualOverview => {
.descendants() .descendants()
.map((node) => ({...node.data, position: {x: node.x, y: node.y}})), .map((node) => ({...node.data, position: {x: node.x, y: node.y}})),
edges, edges,
} as VisualOverview } as Graph
} }

View File

@ -1,12 +1,12 @@
import {create} from "zustand"; import {create} from "zustand";
import {Environment} from "../api"; import {Environment} from "../api";
import {VisualOverview} from "./visualizer.ts"; import {Graph} from "./graph.ts";
import {Edge, Node, Viewport} from "@xyflow/react"; import {Edge, Node, Viewport} from "@xyflow/react";
import {User} from "./user.ts"; import {User} from "./user.ts";
type StoreState = { type StoreState = {
user: User; user: User;
overview: VisualOverview; graph: Graph;
environments: Array<Environment>; environments: Array<Environment>;
nodes: Node[]; nodes: Node[];
edges: Edge[]; edges: Edge[];
@ -16,7 +16,7 @@ type StoreState = {
type StoreAction = { type StoreAction = {
updateUser: (user: StoreState['user']) => void, updateUser: (user: StoreState['user']) => void,
updateOverview: (vov: StoreState['overview']) => void, updateGraph: (vov: StoreState['graph']) => void,
updateEnvironments: (environments: StoreState['environments']) => void, updateEnvironments: (environments: StoreState['environments']) => void,
updateSelectedNode: (selectedNode: StoreState['selectedNode']) => void, updateSelectedNode: (selectedNode: StoreState['selectedNode']) => void,
updateNodes: (nodes: StoreState['nodes']) => void, updateNodes: (nodes: StoreState['nodes']) => void,
@ -26,14 +26,14 @@ type StoreAction = {
const useStore = create<StoreState & StoreAction>((set) => ({ const useStore = create<StoreState & StoreAction>((set) => ({
user: null, user: null,
overview: new VisualOverview(), graph: new Graph(),
environments: new Array<Environment>(), environments: new Array<Environment>(),
nodes: [], nodes: [],
edges: [], edges: [],
selectedNode: null, selectedNode: null,
viewport: {x: 0, y: 0, zoom: 1}, viewport: {x: 0, y: 0, zoom: 1},
updateUser: (user) => set({user: user}), updateUser: (user) => set({user: user}),
updateOverview: (vov) => set({overview: vov}), updateGraph: (vov) => set({overview: vov}),
updateEnvironments: (environments) => set({environments: environments}), updateEnvironments: (environments) => set({environments: environments}),
updateNodes: (nodes) => set({nodes: nodes}), updateNodes: (nodes) => set({nodes: nodes}),
updateEdges: (edges) => set({edges: edges}), updateEdges: (edges) => set({edges: edges}),