Есть ли более чистый (более динамичный) способ написания этой функции карты в RxJS?

Question

Мне нужно нажать новый маршрут после того, как пользователь загрузит изображение. Новый маршрут отличается в зависимости от конкретного модуля, в котором в данный момент находится пользователь. В настоящий момент actionRouteEpic фильтрует новый маршрут и затем вызывает PUSH_ROUTE в каждом операторе if, однако есть способ обновления переменной route и затем вызывать PUSH_ROUTE один раз в конце карты коммутатора?

Первый пример кода - рабочая, но неуклюжая версия. Второй пример - последняя неудачная попытка создания более чистой версии.

В настоящее время это работает:

const actionRouteEpic = action$ =>
  action$.pipe(
    ofType('DISPATCH_ACTION_ROUTE'),
    switchMap(action => {
        if (action.module === 'module_one') {
          return of({
            type: 'PUSH_ROUTE',
            route: '/route-one'
          });
        }
        if (action.module === 'module_two') {
          return of({
            type: 'PUSH_ROUTE',
            route: '/route-two'
          });
        }
        if (action.module === 'module_three') {
          return of({
            type: 'PUSH_ROUTE',
            route: '/route-three'
          });
        }
        return empty();
      }
  );

const pushRouteEpic = action$ =>
  action$.pipe(
    ofType('PUSH_ROUTE'),
    map(action => push(`${action.route}`))
  );

Попытка в более чистой версии:

const actionRouteEpic = action$ =>
  action$.pipe(
    ofType('DISPATCH_ACTION_ROUTE'),
    switchMap(action => {
        let route = ''
        if (action.module === 'module_one') {
          route = '/route-one';
        }
        if (action.module === 'module_two') {
          route = '/route-two';
        }
        if (action.module === 'module_three') {
          route = '/route-three';
        }
        return of({
            type: 'PUSH_ROUTE',
            route: route
          });
      }
  );

const pushRouteEpic = action$ =>
  action$.pipe(
    ofType('PUSH_ROUTE'),
    map(action => push(`${action.route}`))
  );

Спасибо, оценили.

Answer 1

Использование объекта js в качестве карты хешей и определение «маршрутизатора», который отображает каждый модуль на соответствующий путь входа

const actionRouteEpic = action$ =>
 const router = {
    module_one: '/route-one',
    module_two: '/route-two'
 } 
 action$.pipe(
    ofType('DISPATCH_ACTION_ROUTE'),
    switchMap(action => {     
        return of({
            type: 'PUSH_ROUTE',
            route: router[action.module]
          });
      }
  );

Answer 2

В вашем коде нет ничего плохого, но вы можете сделать его "чище", используя вместо этого функцию, действующую на карте:

const selectRouteFromActionModule = action =>
  of(
    {
      module_one: '/route-one',
      module_two: '/route-two',
      module_three: '/route-three',
    }[action.module],
  );

const actionRouteEpic = action$ =>
  action$.pipe(
    ofType('DISPATCH_ACTION_ROUTE'),
    switchMap(selectRouteFromActionModule),
  );

Answer 3

const actionRouteEpic = action$ =>
  action$.pipe(
    ofType('DISPATCH_ACTION_ROUTE'),
    switchMap(action => of({
      type: 'PUSH_ROUTE',
      route: action.module === 'module_one' ? '/route-one' : 
             action.module === 'module_two' ? '/route-two' :
             '/route-three'
    })
  );