From c4b9cbb6072e46ca48cd245d259f8aa6f753991a Mon Sep 17 00:00:00 2001
From: Paul Bienkowski <pb@opatut.de>
Date: Sun, 26 Jun 2022 12:51:15 +0200
Subject: [PATCH] Add filter toggle for user-owned data to map UI

---
 frontend/src/pages/MapPage/LayerSidebar.tsx | 25 ++++++++++++++-------
 frontend/src/pages/MapPage/index.tsx        | 13 +++++------
 frontend/src/reducers/mapConfig.ts          |  6 +++++
 3 files changed, 29 insertions(+), 15 deletions(-)

diff --git a/frontend/src/pages/MapPage/LayerSidebar.tsx b/frontend/src/pages/MapPage/LayerSidebar.tsx
index f9e3c35..b787fc5 100644
--- a/frontend/src/pages/MapPage/LayerSidebar.tsx
+++ b/frontend/src/pages/MapPage/LayerSidebar.tsx
@@ -1,7 +1,16 @@
-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 { useTranslation } from "react-i18next";
 
 
@@ -36,11 +45,11 @@ function LayerSidebar({
 }) {
   const { t } = useTranslation();
   const {
-    baseMap: { style },
-    obsRoads: { show: showRoads, showUntagged, attribute, maxCount },
-    obsEvents: { show: showEvents },
+    baseMap: {style},
+    obsRoads: {show: showRoads, showUntagged, attribute, maxCount},
+    obsEvents: {show: showEvents},
     obsRegions: {show: showRegions},
-    filters: {
+        filters: {
       currentUser: filtersCurrentUser,
       dateMode,
       startDate,
diff --git a/frontend/src/pages/MapPage/index.tsx b/frontend/src/pages/MapPage/index.tsx
index fbd2bd3..d3e6d2f 100644
--- a/frontend/src/pages/MapPage/index.tsx
+++ b/frontend/src/pages/MapPage/index.tsx
@@ -1,14 +1,15 @@
 import React, { useState, useCallback, useMemo, useRef } from "react";
 import _ from "lodash";
-import { Button } from "semantic-ui-react";
+import { connect } from "react-redux";
+import {Button } from "semantic-ui-react";
 import { Layer, Source } from "react-map-gl";
 import produce from "immer";
 
 import api from "api";
-import { Page, Map } from "components";
-import { useConfig } from "config";
-import { colorByDistance, borderByZone, colorByCount, reds, isValidAttribute, getRegionLayers, isValidAttribute } from "mapstyles";
-import { useMapConfig } from "reducers/mapConfig";
+import {Page, Map} from 'components'
+import {useConfig} from 'config'
+import {colorByDistance, colorByCount, borderByZone, reds, isValidAttribute, getRegionLayers} from 'mapstyles'
+import {useMapConfig} from 'reducers/mapConfig'
 
 import RoadInfo from './RoadInfo'
 import RegionInfo from "./RegionInfo";
@@ -73,8 +74,6 @@ const getEventsLayer = () => ({
   paint: {
     'circle-radius': ['interpolate', ['linear'], ['zoom'], 14, 3, 17, 8],
     'circle-color': colorByDistance('distance_overtaker'),
-    'circle-stroke-color': borderByZone(),
-    'circle-stroke-width':['interpolate', ['linear'], ['zoom'], 14, 1, 17, 4],
   },
   minzoom: 11,
 })
diff --git a/frontend/src/reducers/mapConfig.ts b/frontend/src/reducers/mapConfig.ts
index a597fbb..e8a7db6 100644
--- a/frontend/src/reducers/mapConfig.ts
+++ b/frontend/src/reducers/mapConfig.ts
@@ -27,6 +27,9 @@ export type MapConfig = {
   obsEvents: {
     show: boolean;
   };
+  filters: {
+    currentUser: boolean;
+  };
   obsRegions: {
     show: boolean;
   };
@@ -52,6 +55,9 @@ export const initialState: MapConfig = {
   obsEvents: {
     show: false,
   },
+  filters: {
+    currentUser: false,
+  },
   obsRegions: {
     show: true,
   },