added editable route

src/redux/map/actions.ts

@@ -0,0 +1,17 @@
+import { MAP_ACTIONS } from "./constants";
+import { IMapReducer } from "./";
+
+export const mapSet = (map: Partial<IMapReducer>) => ({
+  type: MAP_ACTIONS.SET_MAP,
+  map
+});
+
+export const mapSetProvider = (provider: IMapReducer['provider']) => ({
+  type: MAP_ACTIONS.SET_PROVIDER,
+  provider
+});
+
+export const mapSetRoute = (route: IMapReducer['route']) => ({
+  type: MAP_ACTIONS.SET_ROUTE,
+  route,
+});

src/redux/map/constants.ts

@@ -0,0 +1,7 @@
+const P = 'MAP'
+
+export const MAP_ACTIONS = {
+  SET_MAP: `${P}-SET_MAP`,
+  SET_PROVIDER: `${P}-SET_PROVIDER`,
+  SET_ROUTE: `${P}-SET_ROUTE`,
+}

src/redux/map/handlers.ts

@@ -1,3 +1,33 @@
+import { MAP_ACTIONS } from "./constants";
+import { IMapReducer } from ".";
+import { mapSet, mapSetProvider, mapSetRoute } from "./actions";
+
+const setMap = (
+  state: IMapReducer,
+  { map }: ReturnType<typeof mapSet>
+): IMapReducer => ({
+  ...state,
+  ...map
+});
+
+const setProvider = (
+  state: IMapReducer,
+  { provider }: ReturnType<typeof mapSetProvider>
+): IMapReducer => ({
+  ...state,
+  provider
+});
+
+const setRoute = (
+  state: IMapReducer,
+  { route }: ReturnType<typeof mapSetRoute>
+): IMapReducer => ({
+  ...state,
+  route
+});
+
 export const MAP_HANDLERS = {
-  
-}
+  [MAP_ACTIONS.SET_MAP]: setMap,
+  [MAP_ACTIONS.SET_PROVIDER]: setProvider,
+  [MAP_ACTIONS.SET_ROUTE]: setRoute
+};

src/redux/map/index.ts

@@ -1,11 +1,15 @@
 import { createReducer } from 'reduxsauce';
 import { MAP_HANDLERS } from './handlers';
+import { DEFAULT_PROVIDER } from '$constants/providers';
+import { IMapRoute } from './types';
 
 export interface IMapReducer {
-
+  provider: string;
+  route: IMapRoute;
 }
 
 export const MAP_INITIAL_STATE = {
-
+  provider: DEFAULT_PROVIDER,
 }
+
 export const map = createReducer(MAP_INITIAL_STATE, MAP_HANDLERS)

src/redux/map/selectors.ts

@@ -0,0 +1,2 @@
+export const selectMapProvider = state => state.map.provider;
+export const selectMapRoute= state => state.map.route;

src/redux/map/types.ts

@@ -0,0 +1,8 @@
+import { LatLng } from "leaflet";
+
+export type ILatLng = {
+  lat: number,
+  lng: number,
+}
+
+export type IMapRoute = ILatLng[];

src/redux/store.ts

@@ -9,6 +9,7 @@ import { userSaga } from '$redux/user/sagas';
 import { createBrowserHistory } from 'history';
 import { locationChanged } from '$redux/user/actions';
 import { PersistConfig, Persistor } from "redux-persist/es/types";
+import { map, IMapReducer } from '$redux/map';
 
 const userPersistConfig: PersistConfig = {
   key: 'user',
@@ -18,6 +19,7 @@ const userPersistConfig: PersistConfig = {
 
 export interface IState {
   user: IRootReducer
+  map: IMapReducer,
 }
 // create the saga middleware
 export const sagaMiddleware = createSagaMiddleware();
@@ -32,6 +34,7 @@ const composeEnhancers =
 export const store = createStore(
   combineReducers({
     user: persistReducer(userPersistConfig, userReducer),
+    map,
     // routing: routerReducer
   }),
   composeEnhancers(applyMiddleware(/* routerMiddleware(history), */ sagaMiddleware))

src/redux/user/sagas.ts

@@ -89,6 +89,7 @@ import { IRootState } from "$redux/user";
 import { downloadGPXTrack, getGPXString } from "$utils/gpx";
 import { Unwrap } from "$utils/middleware";
 import { IState } from "$redux/store";
+import { mapSetProvider, mapSet } from "$redux/map/actions";
 
 const getUser = (state: IState) => state.user.user;
 const getState = (state: IState) => state.user;
@@ -156,6 +157,8 @@ function* loadMapSaga(path) {
     data: { route, error, random_url }
   }: Unwrap<typeof getStoredMap> = yield call(getStoredMap, { name: path });
 
+  console.log({ route });
+
   if (route && !error) {
     yield editor.clearAll();
     yield editor.setData(route);
@@ -164,6 +167,13 @@ function* loadMapSaga(path) {
 
     yield put(setChanged(false));
 
+    // TODO: REACTIVE BRANCH:
+    // yield put(mapSetProvider(route.provider));
+    yield put(mapSet({
+      provider: route.provider,
+      route: route.route,
+    }))
+
     return { route, random_url };
   }
 
@@ -529,6 +539,9 @@ function* changeProviderSaga({
 
   yield put(setProvider(provider));
 
+  // TODO: REACTIVE BRANCH
+  yield put(mapSetProvider(provider))
+
   if (current_provider === provider) return;
 
   yield put(setChanged(true));