import { fork } from 'redux-saga/effects';
import homeSaga from './sagas/home';
import gameBrowserSaga from './sagas/gameBrowser';
import lobbySaga from './sagas/lobby';

import { HomeLayout, LobbyLayout } from './layouts';
import HomePage from './containers/home';
import GameBrowser from './containers/gameBrowser';
import Lobby from './containers/lobby';
import Error404 from './components/errors/Error404';

export const makeSagaRoutes = wsConnection => ({
  *'/'() {
    yield fork(homeSaga, wsConnection);
  },
  *'/games'() {
    yield fork(gameBrowserSaga, wsConnection);
  },
  *'/lobby/*'() {
    yield fork(lobbySaga, wsConnection);
  },
});

export const routes = [
  {
    path: '/',
    component: HomeLayout,
    indexRoute: { component: HomePage },
  },
  {
    path: '/',
    component: LobbyLayout,
    childRoutes: [{ path: '/games', component: GameBrowser }, { path: '/lobby/*', component: Lobby }],
  },
  {
    path: '*',
    component: Error404,
  },
];