From 0eab614a4897464941a2be85e1141c2e7a9a1727 Mon Sep 17 00:00:00 2001
From: Paul Bienkowski <pb@opatut.de>
Date: Sun, 24 Jul 2022 18:43:26 +0200
Subject: [PATCH] Translate MapPage

---
 frontend/src/pages/MapPage/LayerSidebar.tsx | 30 +++++++++++++++------
 1 file changed, 22 insertions(+), 8 deletions(-)

diff --git a/frontend/src/pages/MapPage/LayerSidebar.tsx b/frontend/src/pages/MapPage/LayerSidebar.tsx
index b8a31c3..f9e3c35 100644
--- a/frontend/src/pages/MapPage/LayerSidebar.tsx
+++ b/frontend/src/pages/MapPage/LayerSidebar.tsx
@@ -1,12 +1,10 @@
-import React from "react";
-import _ from "lodash";
-import { connect } from "react-redux";
-import {List, Select, Input, Divider, Label,
-  Checkbox,
-  Header,
-} from "semantic-ui-react";
+import React from 'react'
+import _ from 'lodash'
+import {connect} from 'react-redux'
+import {List, Select, Input, Divider, Label, Checkbox, Header} from 'semantic-ui-react'
 import { useTranslation } from "react-i18next";
 
+
 import {
   MapConfig,
   setMapConfigFlag as setMapConfigFlagAction,
@@ -24,6 +22,7 @@ const ROAD_ATTRIBUTE_OPTIONS = [
   {value: 'distance_overtaker_median', key: 'distance_overtaker_median', text: 'Overtaker distance median'},
   {value: 'overtaking_event_count', key: 'overtaking_event_count', text: 'Event count'},
   {value: 'usage_count', key: 'usage_count', text: 'Usage count'},
+  {value: 'zone', key: 'zone', text: 'Overtaking distance zone'}
 ]
 
 function LayerSidebar({
@@ -160,6 +159,21 @@ function LayerSidebar({
                   />
                 </List.Item>
               </>
+            ) : (
+                <List.Item>
+                  <ColorMapLegend
+                    map={_.chunk(
+                      colorByCount(
+                        "obsRoads.maxCount",
+                        mapConfig.obsRoads.maxCount,
+                        viridisSimpleHtml
+                      ).slice(3),
+                      2
+                    )}
+                    twoTicks
+                  />
+                </List.Item>
+              </>
             ) : attribute.endsWith("zone") ? (
               <>
                 <List.Item>
@@ -287,7 +301,7 @@ function LayerSidebar({
                   value={startDate ?? null}
                   label={t("MapPage.sidebar.filters.start")}
                 />
-              </List.Item>
+            </List.Item>
             )}
 
             {dateMode == "range" && (