From e88b1369f71a4680e98a365426cd432730c2a9c6 Mon Sep 17 00:00:00 2001 From: Artem Golub Date: Tue, 12 Jul 2022 22:32:46 +0300 Subject: [PATCH] chore: rename IClientNodeItem -> IServiceNodeItem --- .../frontend/src/components/Canvas/index.tsx | 4 ++-- .../frontend/src/components/Canvas/node.tsx | 4 ++-- .../src/components/Modal/Service/Edit.tsx | 4 ++-- .../frontend/src/components/Project/index.tsx | 16 ++++++++-------- services/frontend/src/components/useJsPlumb.ts | 8 ++++---- services/frontend/src/types/index.ts | 4 ++-- services/frontend/src/utils/generators.ts | 8 ++++++-- services/frontend/src/utils/index.ts | 18 +++++++++--------- services/frontend/src/utils/position.ts | 12 ++++++------ 9 files changed, 41 insertions(+), 37 deletions(-) diff --git a/services/frontend/src/components/Canvas/index.tsx b/services/frontend/src/components/Canvas/index.tsx index d6f4686..9fa10a0 100644 --- a/services/frontend/src/components/Canvas/index.tsx +++ b/services/frontend/src/components/Canvas/index.tsx @@ -2,14 +2,14 @@ import { FC, useState, useEffect } from "react"; import { Dictionary, values } from "lodash"; import { v4 as uuidv4 } from "uuid"; import eventBus from "../../events/eventBus"; -import { IGraphData, CallbackFunction, IClientNodeItem } from "../../types"; +import { IGraphData, CallbackFunction, IServiceNodeItem } from "../../types"; import { useJsPlumb } from "../useJsPlumb"; import Node from "./node"; const CANVAS_ID: string = "canvas-container-" + uuidv4(); interface ICanvasProps { - nodes: Dictionary; + nodes: Dictionary; connections: any; canvasPosition: any; onNodeUpdate: CallbackFunction; diff --git a/services/frontend/src/components/Canvas/node.tsx b/services/frontend/src/components/Canvas/node.tsx index ffe9c74..ef4a09a 100644 --- a/services/frontend/src/components/Canvas/node.tsx +++ b/services/frontend/src/components/Canvas/node.tsx @@ -1,10 +1,10 @@ import { useEffect, useState } from "react"; -import { IClientNodeItem, CallbackFunction } from "../../types"; +import { IServiceNodeItem, CallbackFunction } from "../../types"; import eventBus from "../../events/eventBus"; import { Popover } from "./Popover"; interface INodeProps { - node: IClientNodeItem; + node: IServiceNodeItem; setNodeForEdit: CallbackFunction; setNodeForDelete: CallableFunction; } diff --git a/services/frontend/src/components/Modal/Service/Edit.tsx b/services/frontend/src/components/Modal/Service/Edit.tsx index b9d5c66..b97bed6 100644 --- a/services/frontend/src/components/Modal/Service/Edit.tsx +++ b/services/frontend/src/components/Modal/Service/Edit.tsx @@ -9,7 +9,7 @@ import { canvasConfigInitialValues } from "../../../utils"; import { CallbackFunction, ICanvasConfig, - IClientNodeItem, + IServiceNodeItem, IService } from "../../../types"; @@ -22,7 +22,7 @@ interface IModalServiceProps { const ModalServiceEdit = (props: IModalServiceProps) => { const { node, onHide, onUpdateEndpoint } = props; const [openTab, setOpenTab] = useState("General"); - const [selectedNode, setSelectedNode] = useState(); + const [selectedNode, setSelectedNode] = useState(); const formik = useFormik({ initialValues: { canvasConfig: { diff --git a/services/frontend/src/components/Project/index.tsx b/services/frontend/src/components/Project/index.tsx index 2071a61..abddcbf 100644 --- a/services/frontend/src/components/Project/index.tsx +++ b/services/frontend/src/components/Project/index.tsx @@ -5,7 +5,7 @@ import YAML from "yaml"; import { PlusIcon } from "@heroicons/react/solid"; import { IProjectPayload, - IClientNodeItem, + IServiceNodeItem, IServiceNodePosition, IProject } from "../../types"; @@ -41,7 +41,7 @@ export default function Project() { const { uuid } = useParams<{ uuid: string }>(); const { height } = useWindowDimensions(); const { data, error, isFetching } = useProject(uuid); - const stateNodesRef = useRef>(); + const stateNodesRef = useRef>(); const stateConnectionsRef = useRef<[[string, string]] | []>(); const [generatedCode, setGeneratedCode] = useState(); @@ -49,8 +49,8 @@ export default function Project() { const [showModalCreateService, setShowModalCreateService] = useState(false); const [showVolumesModal, setShowVolumesModal] = useState(false); const [showNetworksModal, setShowNetworksModal] = useState(false); - const [nodeForEdit, setNodeForEdit] = useState(null); - const [nodeForDelete, setNodeForDelete] = useState( + const [nodeForEdit, setNodeForEdit] = useState(null); + const [nodeForDelete, setNodeForDelete] = useState( null ); const [language, setLanguage] = useState("yaml"); @@ -216,7 +216,7 @@ export default function Project() { setNodes({ ...nodes, [clientNodeItem.key]: clientNodeItem }); }; - const onUpdateEndpoint = (nodeItem: IClientNodeItem) => { + const onUpdateEndpoint = (nodeItem: IServiceNodeItem) => { setNodes({ ...nodes, [nodeItem.key]: nodeItem }); }; @@ -255,7 +255,7 @@ export default function Project() { } }; - const onRemoveEndpoint = (node: IClientNodeItem) => { + const onRemoveEndpoint = (node: IServiceNodeItem) => { setNodes({ ...omit(nodes, node.key) }); eventBus.dispatch("NODE_DELETED", { message: { node: node } }); }; @@ -434,10 +434,10 @@ export default function Project() { onConnectionDetached={(connectionData: any) => onConnectionDetached(connectionData) } - setNodeForEdit={(node: IClientNodeItem) => + setNodeForEdit={(node: IServiceNodeItem) => setNodeForEdit(node) } - setNodeForDelete={(node: IClientNodeItem) => + setNodeForDelete={(node: IServiceNodeItem) => setNodeForDelete(node) } /> diff --git a/services/frontend/src/components/useJsPlumb.ts b/services/frontend/src/components/useJsPlumb.ts index de7a1ba..bf54b33 100644 --- a/services/frontend/src/components/useJsPlumb.ts +++ b/services/frontend/src/components/useJsPlumb.ts @@ -28,12 +28,12 @@ import { } from "../utils/options"; import eventBus from "../events/eventBus"; import { getConnections } from "../utils"; -import { IClientNodeItem } from "../types"; +import { IServiceNodeItem } from "../types"; import { Dictionary, isEqual } from "lodash"; import { IAnchor, CallbackFunction } from "../types"; export const useJsPlumb = ( - nodes: Dictionary, + nodes: Dictionary, connections: Array<[string, string]>, onGraphUpdate: CallbackFunction, onNodeUpdate: CallbackFunction, @@ -43,11 +43,11 @@ export const useJsPlumb = ( (containerElement: HTMLDivElement) => void, (zoom: number) => void, (style: any) => void, - (node: IClientNodeItem) => void + (node: IServiceNodeItem) => void ] => { const [instance, setInstance] = useState(null as any); const containerRef = useRef(); - const stateRef = useRef>(); + const stateRef = useRef>(); const instanceRef = useRef(); stateRef.current = nodes; instanceRef.current = instance; diff --git a/services/frontend/src/types/index.ts b/services/frontend/src/types/index.ts index 4caf949..3ff542f 100644 --- a/services/frontend/src/types/index.ts +++ b/services/frontend/src/types/index.ts @@ -68,7 +68,7 @@ export interface ICanvasConfig { } export interface IGraphData { - nodes: IClientNodeItem[]; + nodes: IServiceNodeItem[]; connections: Dictionary; } @@ -329,7 +329,7 @@ export interface IDockerCompose { services: IService[]; } -export interface IClientNodeItem extends INodeItem { +export interface IServiceNodeItem extends INodeItem { outputs: string[]; canvasConfig: ICanvasConfig; serviceConfig: Partial; diff --git a/services/frontend/src/utils/generators.ts b/services/frontend/src/utils/generators.ts index 1c645c2..7040ab7 100644 --- a/services/frontend/src/utils/generators.ts +++ b/services/frontend/src/utils/generators.ts @@ -1,8 +1,12 @@ -import { IClientNodeItem, IGeneratePayload, ISaturatedService } from "../types"; +import { + IServiceNodeItem, + IGeneratePayload, + ISaturatedService +} from "../types"; import { Dictionary } from "lodash"; const getServices = ( - graphNodes: Dictionary + graphNodes: Dictionary ): ISaturatedService[] => { const ret: ISaturatedService[] = []; for (const [, value] of Object.entries(graphNodes)) { diff --git a/services/frontend/src/utils/index.ts b/services/frontend/src/utils/index.ts index 76cd396..b0856bd 100644 --- a/services/frontend/src/utils/index.ts +++ b/services/frontend/src/utils/index.ts @@ -12,7 +12,7 @@ import { } from "lodash"; import { LOCAL_STORAGE } from "../constants"; import { - IClientNodeItem, + IServiceNodeItem, INodeLibraryItem, INodeGroup, ICanvasConfig, @@ -31,8 +31,8 @@ export function ensure( return argument; } -export const parseSingleNode = (configurationStr: string): IClientNodeItem => { - let node: IClientNodeItem = {} as IClientNodeItem; +export const parseSingleNode = (configurationStr: string): IServiceNodeItem => { + let node: IServiceNodeItem = {} as IServiceNodeItem; const configurationObj = JSON.parse(configurationStr); if (isPlainObject(configurationObj)) { @@ -49,8 +49,8 @@ export const formatName = (name: string): string => { export const parseConfiguration = ( configurationStr: string -): IClientNodeItem[] => { - let nodes: IClientNodeItem[] = []; +): IServiceNodeItem[] => { + let nodes: IServiceNodeItem[] = []; const configurationObj = JSON.parse(configurationStr); if (isPlainObject(configurationObj)) { @@ -107,9 +107,9 @@ export const attachUUID = (key: string): string => { }; export const getClientNodeItem = ( - nodeItem: IClientNodeItem, + nodeItem: IServiceNodeItem, library: INodeLibraryItem -): IClientNodeItem => { +): IServiceNodeItem => { const uniqueKey = attachUUID(nodeItem.key); return { @@ -151,9 +151,9 @@ export const getConnections = ( }; export const getClientNodesAndConnections = ( - nodeItems: IClientNodeItem[], + nodeItems: IServiceNodeItem[], sections: INodeGroup[] -): Dictionary => { +): Dictionary => { if (!Array.isArray(nodeItems) || !Array.isArray(sections)) { return {}; } diff --git a/services/frontend/src/utils/position.ts b/services/frontend/src/utils/position.ts index 2ed8721..e8518d8 100644 --- a/services/frontend/src/utils/position.ts +++ b/services/frontend/src/utils/position.ts @@ -1,8 +1,8 @@ import * as d3 from "d3"; -import { IClientNodeItem } from "../types"; +import { IServiceNodeItem } from "../types"; import { getNodeKeyFromConnectionId } from "./index"; -interface INodeItemWithParent extends IClientNodeItem { +interface INodeItemWithParent extends IServiceNodeItem { parent: string; } @@ -10,7 +10,7 @@ const nodeWidth = 150; const nodeHeight = 60; export const getHierarchyTree = ( - nodes: IClientNodeItem[] + nodes: IServiceNodeItem[] ): d3.HierarchyPointNode => { const data = nodes.map((node): INodeItemWithParent => { return { @@ -48,9 +48,9 @@ export const getHierarchyTree = ( }; export const getNodesPositions = ( - nodes: IClientNodeItem[] -): [IClientNodeItem[], number, number] => { - const nodeWithPosition: IClientNodeItem[] = []; + nodes: IServiceNodeItem[] +): [IServiceNodeItem[], number, number] => { + const nodeWithPosition: IServiceNodeItem[] = []; const tree = getHierarchyTree(nodes); let x0 = Infinity; let x1 = -x0;