From 52ad98fc3d55f7f4f9a4d1062adbfcf8d1899806 Mon Sep 17 00:00:00 2001
From: "Thomas F. K. Jorna" <thomasfkjorna@gmail.com>
Date: Thu, 29 Jul 2021 07:11:24 +0200
Subject: cleaned some more errors

---
 pages/index.tsx | 60 +++++++++++++++++++++------------------------------------
 1 file changed, 22 insertions(+), 38 deletions(-)

(limited to 'pages/index.tsx')

diff --git a/pages/index.tsx b/pages/index.tsx
index f47414c..98fd7ed 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -66,15 +66,15 @@ export function GraphPage() {
   const nodeByIdRef = useRef<NodeById>({})
   const linksByNodeIdRef = useRef<LinksByNodeId>({})
 
-  const fetchGraphData = () => {
-    return fetch('http://localhost:35901/graph')
-      .then((res) => res.json())
-      .then((orgRoamGraphData) => {
-        console.log('fetching graphdata')
-        parseGraphData(orgRoamGraphData)
-      })
-  }
-
+  /* const fetchGraphData = () => {
+   *   return fetch('http://localhost:35901/graph')
+   *     .then((res) => res.json())
+   *     .then((orgRoamGraphData) => {
+   *       console.log('fetching graphdata')
+   *       parseGraphData(orgRoamGraphData)
+   *     })
+   * }
+   */
   const parseGraphData = (orgRoamGraphData: OrgRoamGraphReponse) => {
     const nodesByFile = orgRoamGraphData.nodes.reduce<NodesByFile>((acc, node) => {
       return {
@@ -125,7 +125,7 @@ export function GraphPage() {
   const { setEmacsTheme } = useContext(ThemeContext)
   useEffect(() => {
     const socket = new WebSocket('ws://localhost:35903')
-    socket.addEventListener('open', (e) => {
+    socket.addEventListener('open', (event) => {
       console.log('Connection with Emacs established')
     })
     socket.addEventListener('message', (event) => {
@@ -420,30 +420,15 @@ export const Graph = function (props: GraphProps) {
   }, [hoverNode])
   const theme = useTheme()
   const themeContext = useContext<ThemeContextProps>(ThemeContext)
-  const interPurple = useMemo(
-    () => d3int.interpolate(theme.colors.gray[500], theme.colors.purple[500]),
-    [theme],
-  )
-  const interHighlight = useMemo(
-    () => d3int.interpolate(theme.colors.gray[500], theme.colors[themeContext.highlightColor][500]),
-    [theme, visuals.highlightColor],
-  )
-  const interGray = useMemo(
-    () => d3int.interpolate(theme.colors.gray[500], theme.colors.gray[400]),
-    [theme],
-  )
 
   const highlightColors = useMemo(() => {
-    const allColors = [].concat(
-      visuals.nodeColorScheme /* && visuals.nodeColorScheme.map((c) => theme.colors[c][500]))  */ ||
-        [],
-      visuals.linkColorScheme /* && theme.colors.gray[visuals.linkColorScheme])]]  */ || [],
-      visuals.linkHighlight /* && theme.colors[visuals.linkHighlight][500])  */ || [],
-      visuals.nodeHighlight /* && theme.colors[visuals.linkHighlight][500]) */ || [],
+    const allColors = visuals.nodeColorScheme.concat(
+      visuals.linkColorScheme || [],
+      visuals.linkHighlight || [],
+      visuals.nodeHighlight || [],
     )
 
-    console.log(visuals.linkColorScheme)
-    const getColor = (c) => (isNaN(c) ? theme.colors[c][500] : theme.colors.gray[c])
+    const getColor = (c: any) => (isNaN(c) ? theme.colors[c][500] : theme.colors.gray[c])
     const highlightColors = Object.fromEntries(
       allColors.map((color) => {
         const color1 = getColor(color)
@@ -477,7 +462,7 @@ export const Graph = function (props: GraphProps) {
           ...previouslyHighlightedLinks.flatMap((link) => [link.source, link.target]),
         ].map((nodeId) => [nodeId, {}]),
       ),
-    [hoverNode, previouslyHighlightedLinks, lastHoverNode],
+    [hoverNode, previouslyHighlightedLinks, lastHoverNode.current],
   )
 
   const getNodeColorById = (id: string) => {
@@ -492,11 +477,11 @@ export const Graph = function (props: GraphProps) {
     ]
   }
   const getLinkNodeColor = (link: OrgRoamLink) =>
-    linksByNodeId[link.target.id!]?.length < linksByNodeId[link.source.id!]?.length
-      ? getNodeColorById(link.target.id!)
-      : getNodeColorById(link.source.id!)
+    linksByNodeId[link.target!]!.length < linksByNodeId[link.source!]!.length
+      ? getNodeColorById(link.target!)
+      : getNodeColorById(link.source!)
 
-  const getLinkColor = (link: OrgRoamLinkObject) => {
+  const getLinkColor = (link: OrgRoamLink) => {
     // I'm so sorry
     const linkIsHighlighted = isLinkRelatedToNode(link, centralHighlightedNode)
     const linkWasHighlighted = isLinkRelatedToNode(link, lastHoverNode.current)
@@ -552,7 +537,7 @@ export const Graph = function (props: GraphProps) {
     backgroundColor: theme.colors.gray[visuals.backgroundColor],
     nodeLabel: (node) => (node as OrgRoamNode).title,
     nodeColor: (node) => {
-      return getNodeColor(node)
+      return getNodeColor(node as OrgRoamNode)
     },
     nodeRelSize: physics.nodeRel,
     nodeVal: (node) => {
@@ -575,7 +560,6 @@ export const Graph = function (props: GraphProps) {
       if (!physics.labels) {
         return
       }
-      const links = linksByNodeId[node.id!] ?? []
       const wasHighlightedNode = previouslyHighlightedNodes[node.id!]
 
       if (
@@ -638,7 +622,7 @@ export const Graph = function (props: GraphProps) {
        *     : theme.colors[getLinkNodeColor(link)][500]
        * } */
 
-      return getLinkColor(link)
+      return getLinkColor(link as OrgRoamLink)
     },
     linkWidth: (link) => {
       const linkIsHighlighted = isLinkRelatedToNode(link, centralHighlightedNode)
-- 
cgit v1.2.3

