From 8a5178f0dc5534e51c48899119170078062d9d00 Mon Sep 17 00:00:00 2001
From: dhrubesh <dhrubesh97@gmail.com>
Date: Mon, 17 May 2021 14:42:39 +0530
Subject: [PATCH 1/2] adds default view option

---
 .../src/modules/Servicemap/SelectService.tsx  | 19 ++++++++++++++++---
 .../src/modules/Servicemap/ServiceMap.tsx     |  5 +++++
 2 files changed, 21 insertions(+), 3 deletions(-)

diff --git a/frontend/src/modules/Servicemap/SelectService.tsx b/frontend/src/modules/Servicemap/SelectService.tsx
index 8317e87212..2377293fe4 100644
--- a/frontend/src/modules/Servicemap/SelectService.tsx
+++ b/frontend/src/modules/Servicemap/SelectService.tsx
@@ -4,6 +4,7 @@ import { InfoCircleOutlined } from "@ant-design/icons";
 import { Select } from "antd";
 import styled from "styled-components";
 const { Option } = Select;
+import { cloneDeep } from "lodash";
 
 const Container = styled.div`
   margin-top: 12px;
@@ -25,14 +26,26 @@ const Container = styled.div`
 interface SelectServiceProps {
 	services: servicesItem[];
 	zoomToService: (arg0: string) => void;
+	zoomToDefault: () => void;
 }
 
+const defaultOption = {
+	serviceName: "Default"
+};
+
 const SelectService = (props: SelectServiceProps) => {
-	const [selectedVal, setSelectedVal] = useState<string>();
-	const { services, zoomToService } = props;
+	const [selectedVal, setSelectedVal] = useState<string>(defaultOption.serviceName);
+	console.log("props",props);
+	const { zoomToService, zoomToDefault } = props;
+	const services = cloneDeep(props.services);
+	services.unshift(defaultOption)
 	const handleSelect = (value: string) => {
+		if(value === defaultOption.serviceName){
+			zoomToDefault()
+		} else {
+			zoomToService(value);
+		}
 		setSelectedVal(value);
-		zoomToService(value);
 	};
 	return (
 		<Container>
diff --git a/frontend/src/modules/Servicemap/ServiceMap.tsx b/frontend/src/modules/Servicemap/ServiceMap.tsx
index 5960997313..77fec0c920 100644
--- a/frontend/src/modules/Servicemap/ServiceMap.tsx
+++ b/frontend/src/modules/Servicemap/ServiceMap.tsx
@@ -75,6 +75,10 @@ const ServiceMap = (props: ServiceMapProps) => {
 		fgRef && fgRef.current.zoomToFit(700, getZoomPx(), (e) => e.id === value);
 	};
 
+	const zoomToDefault = () => {
+		fgRef && fgRef.current.zoomToFit(100, 120);
+	};
+
 	const { nodes, links } = getGraphData(serviceMap);
 	const graphData = { nodes, links };
 	return (
@@ -82,6 +86,7 @@ const ServiceMap = (props: ServiceMapProps) => {
 			<SelectService
 				services={serviceMap.services}
 				zoomToService={zoomToService}
+				zoomToDefault={zoomToDefault}
 			/>
 			<ForceGraph2D
 				ref={fgRef}

From c49ffd83a3b7ed616dad53d8b0853b0c8dc680e9 Mon Sep 17 00:00:00 2001
From: dhrubesh <dhrubesh97@gmail.com>
Date: Mon, 17 May 2021 14:43:20 +0530
Subject: [PATCH 2/2] remove logs

---
 frontend/src/modules/Servicemap/SelectService.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/frontend/src/modules/Servicemap/SelectService.tsx b/frontend/src/modules/Servicemap/SelectService.tsx
index 2377293fe4..016a504fe6 100644
--- a/frontend/src/modules/Servicemap/SelectService.tsx
+++ b/frontend/src/modules/Servicemap/SelectService.tsx
@@ -35,7 +35,6 @@ const defaultOption = {
 
 const SelectService = (props: SelectServiceProps) => {
 	const [selectedVal, setSelectedVal] = useState<string>(defaultOption.serviceName);
-	console.log("props",props);
 	const { zoomToService, zoomToDefault } = props;
 	const services = cloneDeep(props.services);
 	services.unshift(defaultOption)