From 98c36c8b03a5febf8989f04f598394bcee29850a Mon Sep 17 00:00:00 2001
From: Dan Albert <dan@gingerhq.net>
Date: Tue, 1 Mar 2022 23:09:41 -0800
Subject: [PATCH] Remove default zoom control, add map scale.

https://github.com/dcs-liberation/dcs_liberation/issues/2039
---
 client/src/components/liberationmap/LiberationMap.tsx   | 6 ++++--
 client/src/components/waypointmarker/WaypointMarker.tsx | 2 +-
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/client/src/components/liberationmap/LiberationMap.tsx b/client/src/components/liberationmap/LiberationMap.tsx
index db92f495..fa1f222f 100644
--- a/client/src/components/liberationmap/LiberationMap.tsx
+++ b/client/src/components/liberationmap/LiberationMap.tsx
@@ -1,10 +1,11 @@
 import "./LiberationMap.css";
 
+import { MapContainer, ScaleControl } from "react-leaflet";
+
 import { BasemapLayer } from "react-esri-leaflet";
 import ControlPointsLayer from "../controlpointslayer";
 import FlightPlansLayer from "../flightplanslayer";
 import { LatLng } from "leaflet";
-import { MapContainer } from "react-leaflet";
 
 interface GameProps {
   mapCenter: LatLng;
@@ -12,8 +13,9 @@ interface GameProps {
 
 export default function LiberationMap(props: GameProps) {
   return (
-    <MapContainer zoom={8} center={props.mapCenter}>
+    <MapContainer zoom={8} center={props.mapCenter} zoomControl={false}>
       <BasemapLayer name="ImageryClarity" />
+      <ScaleControl />
       <ControlPointsLayer />
       <FlightPlansLayer blue={true} />
       <FlightPlansLayer blue={false} />
diff --git a/client/src/components/waypointmarker/WaypointMarker.tsx b/client/src/components/waypointmarker/WaypointMarker.tsx
index c85f5eac..ae136f2e 100644
--- a/client/src/components/waypointmarker/WaypointMarker.tsx
+++ b/client/src/components/waypointmarker/WaypointMarker.tsx
@@ -1,5 +1,5 @@
 import { Marker, Tooltip, useMap, useMapEvent } from "react-leaflet";
-import { MutableRefObject, useCallback, useEffect, useRef } from "react";
+import { MutableRefObject, useCallback, useRef } from "react";
 
 import { Icon } from "leaflet";
 import { Marker as LMarker } from "leaflet";