From ac745c8f5c3e4aa2ac8d6ca23bb1276452d4018b Mon Sep 17 00:00:00 2001
From: sabhas <sabirbk06@gmail.com>
Date: Tue, 26 Oct 2021 09:31:30 +0000
Subject: [PATCH] fix(web): infinite call to api end point fixed

---
 web/src/containers/Drive/sideBar.tsx | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/web/src/containers/Drive/sideBar.tsx b/web/src/containers/Drive/sideBar.tsx
index 2a7a80d..5a92834 100644
--- a/web/src/containers/Drive/sideBar.tsx
+++ b/web/src/containers/Drive/sideBar.tsx
@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react'
+import React, { useState, useEffect, useCallback } from 'react'
 import axios from 'axios'
 import { useLocation } from 'react-router-dom'
 
@@ -41,8 +41,14 @@ const SideBar = (props: any) => {
   const baseUrl = window.location.origin
   const classes = useStyles()
 
+  const { setSelectedFilePath } = props
   const [directoryData, setDirectoryData] = useState<TreeNode | null>(null)
 
+  const setFilePathOnMount = useCallback(() => {
+    const queryParams = new URLSearchParams(location.search)
+    setSelectedFilePath(queryParams.get('filePath'))
+  }, [location.search, setSelectedFilePath])
+
   useEffect(() => {
     axios
       .get(`/SASjsApi/executor`)
@@ -54,9 +60,8 @@ const SideBar = (props: any) => {
       .catch((err) => {
         console.log(err)
       })
-    const queryParams = new URLSearchParams(location.search)
-    props.setSelectedFilePath(queryParams.get('filePath'))
-  })
+    setFilePathOnMount()
+  }, [setFilePathOnMount])
 
   const handleSelect = (node: TreeNode) => {
     if (!node.children.length) {
@@ -65,7 +70,7 @@ const SideBar = (props: any) => {
         '',
         `${baseUrl}/#/SASjsDrive?filePath=${node.relativePath}`
       )
-      props.setSelectedFilePath(node.relativePath)
+      setSelectedFilePath(node.relativePath)
     }
   }