refactor: update format

ls1intum · Jan 13, 2025 · 4056e80 · 4056e80
1 parent 9148879
commit 4056e80
Show file tree

Hide file tree

Showing 11 changed files with 134 additions and 151 deletions.
diff --git a/library/lib/App.tsx b/library/lib/App.tsx
@@ -30,10 +30,9 @@ function App({ onReactFlowInit }: AppProps) {
   const [nodes, , onNodesChange] = useNodesState(initialNodes)
   const [edges, , onEdgesChange] = useEdgesState(initialEdges)
   const { onDrop, onDragOver } = useDragDrop()
-  const {onConnect} = useConnect()
-  const {onReconnect} = useReconnect()
+  const { onConnect } = useConnect()
+  const { onReconnect } = useReconnect()
 
-
   return (
     <div style={{ display: "flex", width: "100vw", height: "100vh" }}>
       <Sidebar />

diff --git a/library/lib/edges/AggregationEdge.tsx b/library/lib/edges/AggregationEdge.tsx
@@ -2,30 +2,30 @@ import { BaseEdge, EdgeProps, getSmoothStepPath } from "@xyflow/react"
 
 // Aggregation Edge (White Rhombus)
 export const AggregationEdge = ({
-    id,
+  id,
+  sourceX,
+  sourceY,
+  targetX,
+  targetY,
+  sourcePosition,
+  targetPosition,
+}: EdgeProps) => {
+  const [edgePath] = getSmoothStepPath({
     sourceX,
     sourceY,
+    sourcePosition,
     targetX,
     targetY,
-    sourcePosition,
     targetPosition,
-  }: EdgeProps) => {
-    const [edgePath] = getSmoothStepPath({
-      sourceX,
-      sourceY,
-      sourcePosition,
-      targetX,
-      targetY,
-      targetPosition,
-    })
-    return (
-      <BaseEdge
-        id={id}
-        path={edgePath}
-        markerEnd="url(#white-rhombus)"
-        style={{
-          stroke: "#000000",
-        }}
-      />
-    )
-  }
+  })
+  return (
+    <BaseEdge
+      id={id}
+      path={edgePath}
+      markerEnd="url(#white-rhombus)"
+      style={{
+        stroke: "#000000",
+      }}
+    />
+  )
+}
diff --git a/library/lib/edges/BiAssociationEdge.tsx b/library/lib/edges/BiAssociationEdge.tsx
@@ -2,30 +2,29 @@ import { BaseEdge, EdgeProps, getSmoothStepPath } from "@xyflow/react"
 
 // Uni-Directional Association Edge (Black Arrow)
 export const BiAssociationEdge = ({
-    id,
+  id,
+  sourceX,
+  sourceY,
+  targetX,
+  targetY,
+  sourcePosition,
+  targetPosition,
+}: EdgeProps) => {
+  const [edgePath] = getSmoothStepPath({
     sourceX,
     sourceY,
+    sourcePosition,
     targetX,
     targetY,
-    sourcePosition,
     targetPosition,
-  }: EdgeProps) => {
-    const [edgePath] = getSmoothStepPath({
-      sourceX,
-      sourceY,
-      sourcePosition,
-      targetX,
-      targetY,
-      targetPosition,
-    })
-    return (
-      <BaseEdge
-        id={id}
-        path={edgePath}
-        style={{
-          stroke: "#000000",
-        }}
-      />
-    )
-  }
-
+  })
+  return (
+    <BaseEdge
+      id={id}
+      path={edgePath}
+      style={{
+        stroke: "#000000",
+      }}
+    />
+  )
+}
diff --git a/library/lib/edges/CompositionEdge.tsx b/library/lib/edges/CompositionEdge.tsx
@@ -2,30 +2,30 @@ import { BaseEdge, EdgeProps, getSmoothStepPath } from "@xyflow/react"
 
 // Composition Edge (Black Rhombus)
 export const CompositionEdge = ({
-    id,
+  id,
+  sourceX,
+  sourceY,
+  targetX,
+  targetY,
+  sourcePosition,
+  targetPosition,
+}: EdgeProps) => {
+  const [edgePath] = getSmoothStepPath({
     sourceX,
     sourceY,
+    sourcePosition,
     targetX,
     targetY,
-    sourcePosition,
     targetPosition,
-  }: EdgeProps) => {
-    const [edgePath] = getSmoothStepPath({
-      sourceX,
-      sourceY,
-      sourcePosition,
-      targetX,
-      targetY,
-      targetPosition,
-    })
-    return (
-      <BaseEdge
-        id={id}
-        path={edgePath}
-        markerEnd="url(#black-rhombus)"
-        style={{
-          stroke: "#000000",
-        }}
-      />
-    )
-  }
+  })
+  return (
+    <BaseEdge
+      id={id}
+      path={edgePath}
+      markerEnd="url(#black-rhombus)"
+      style={{
+        stroke: "#000000",
+      }}
+    />
+  )
+}
diff --git a/library/lib/edges/DependencyEdge.tsx b/library/lib/edges/DependencyEdge.tsx
@@ -2,32 +2,32 @@ import { BaseEdge, EdgeProps, getSmoothStepPath } from "@xyflow/react"
 
 // Dependency Edge (Dotted White Arrow)
 export const DependencyEdge = ({
-    id,
+  id,
+  sourceX,
+  sourceY,
+  targetX,
+  targetY,
+  sourcePosition,
+  targetPosition,
+}: EdgeProps) => {
+  const [edgePath] = getSmoothStepPath({
     sourceX,
     sourceY,
+    sourcePosition,
     targetX,
     targetY,
-    sourcePosition,
     targetPosition,
-  }: EdgeProps) => {
-    const [edgePath] = getSmoothStepPath({
-      sourceX,
-      sourceY,
-      sourcePosition,
-      targetX,
-      targetY,
-      targetPosition,
-    })
-    return (
-      <BaseEdge
-        id={id}
-        path={edgePath}
-        markerEnd="url(#custom-arrow)"
-        strokeDasharray="8"
-        strokeWidth={4}
-        style={{
-          stroke: "#000000",
-        }}
-      />
-    )
-  }
+  })
+  return (
+    <BaseEdge
+      id={id}
+      path={edgePath}
+      markerEnd="url(#custom-arrow)"
+      strokeDasharray="8"
+      strokeWidth={4}
+      style={{
+        stroke: "#000000",
+      }}
+    />
+  )
+}
diff --git a/library/lib/edges/InheritanceEdge.tsx b/library/lib/edges/InheritanceEdge.tsx
@@ -28,4 +28,4 @@ export const InheritanceEdge = ({
       }}
     />
   )
-}
+}
diff --git a/library/lib/edges/RealizationEdge.tsx b/library/lib/edges/RealizationEdge.tsx
@@ -1,32 +1,32 @@
 import { BaseEdge, EdgeProps, getSmoothStepPath } from "@xyflow/react"
 // Realization Edge (Dotted White Triangle)
 export const RealizationEdge = ({
-    id,
+  id,
+  sourceX,
+  sourceY,
+  targetX,
+  targetY,
+  sourcePosition,
+  targetPosition,
+}: EdgeProps) => {
+  const [edgePath] = getSmoothStepPath({
     sourceX,
     sourceY,
+    sourcePosition,
     targetX,
     targetY,
-    sourcePosition,
     targetPosition,
-  }: EdgeProps) => {
-    const [edgePath] = getSmoothStepPath({
-      sourceX,
-      sourceY,
-      sourcePosition,
-      targetX,
-      targetY,
-      targetPosition,
-    })
-    return (
-      <BaseEdge
-        id={id}
-        path={edgePath}
-        markerEnd="url(#white-triangle)"
-        strokeDasharray="8"
-        strokeWidth={4}
-        style={{
-          stroke: "#000000",
-        }}
-      />
-    )
-  }
+  })
+  return (
+    <BaseEdge
+      id={id}
+      path={edgePath}
+      markerEnd="url(#white-triangle)"
+      strokeDasharray="8"
+      strokeWidth={4}
+      style={{
+        stroke: "#000000",
+      }}
+    />
+  )
+}
diff --git a/library/lib/edges/UniAssociationEdge.tsx b/library/lib/edges/UniAssociationEdge.tsx
@@ -28,4 +28,4 @@ export const UniAssociationEdge = ({
       }}
     />
   )
-}
+}
diff --git a/library/lib/edges/index.ts b/library/lib/edges/index.ts
@@ -1,4 +1,3 @@
-
 export * from "./types"
 export * from "./AggregationEdge"
 export * from "./BiAssociationEdge"

diff --git a/library/lib/hooks/useConnect.ts b/library/lib/hooks/useConnect.ts
@@ -1,26 +1,19 @@
-import {
-    addEdge,
-    Edge,
-    Connection,
-    useReactFlow
-  } from "@xyflow/react"
-import { useCallback} from "react"
+import { addEdge, Edge, Connection, useReactFlow } from "@xyflow/react"
+import { useCallback } from "react"
 
 export const useConnect = () => {
-
-  const { setEdges} = useReactFlow()
+  const { setEdges } = useReactFlow()
   const onConnect = useCallback(
-      (connection: Connection) => {
-        const edge: Edge = {
-          ...connection,
-          id: `${Date.now()}-${connection.source}-${connection.target}`,
-          type: "biassociation",
-          selected: true,
-        }
-        setEdges((edges) => addEdge(edge, edges))
-      },
-      [setEdges]
-    )
+    (connection: Connection) => {
+      const edge: Edge = {
+        ...connection,
+        id: `${Date.now()}-${connection.source}-${connection.target}`,
+        type: "biassociation",
+        selected: true,
+      }
+      setEdges((edges) => addEdge(edge, edges))
+    },
+    [setEdges]
+  )
   return { onConnect }
 }
-
diff --git a/library/lib/hooks/useReconnect.ts b/library/lib/hooks/useReconnect.ts
@@ -1,14 +1,8 @@
-import {
-    reconnectEdge,
-    Edge,
-    Connection,
-    useReactFlow
-  } from "@xyflow/react"
-import { useCallback} from "react"
+import { reconnectEdge, Edge, Connection, useReactFlow } from "@xyflow/react"
+import { useCallback } from "react"
 
 export const useReconnect = () => {
-
-  const { setEdges} = useReactFlow()
+  const { setEdges } = useReactFlow()
   const onReconnect = useCallback(
     (oldEdge: Edge, newConnection: Connection) =>
       setEdges((els) =>
@@ -23,4 +17,3 @@ export const useReconnect = () => {
   )
   return { onReconnect }
 }
-
-Original file line number
+Diff line change
@@ Expand Up / @@ -28,4 +28,4 @@ export const InheritanceEdge = ({ @@
           }}
         />
       )
-    }
+    }