Permalink
Browse files

FEATURE: display restaurant details from api

  • Loading branch information...
toranb committed Jun 8, 2018
1 parent 27dc1c5 commit 0fac0e8af66de392d28bc114ace6cf31ebef122f
@@ -9,4 +9,14 @@ export interface ListDispatch {
(action: ListAction): void;
}

export interface DetailAction {
type: 'RESTAURANTS:TRANSFORM_DETAIL';
response: Restaurant;
}

export interface DetailDispatch {
(action: DetailAction): void;
}

export const TRANSFORM_LIST = 'RESTAURANTS:TRANSFORM_LIST';
export const TRANSFORM_DETAIL = 'RESTAURANTS:TRANSFORM_DETAIL';
@@ -0,0 +1,9 @@
import { connect } from 'ember-redux';
import { RootState } from '../types/index';
import _ from 'lodash';

const stateToComputed = (state: RootState) => ({
restaurant: _.get(state.restaurants.all, state.restaurants.selectedId)
});

export default connect(stateToComputed)();
@@ -1,18 +1,29 @@
import _ from 'lodash';
import { Restaurant, RestaurantState } from '../types/restaurants';
import { TRANSFORM_LIST, ListAction } from '../actions/restaurants';
import { TRANSFORM_LIST, TRANSFORM_DETAIL, DetailAction, ListAction } from '../actions/restaurants';

const initialState = {
all: undefined
all: undefined,
selectedId: undefined
};

export default ((state: RestaurantState, action: ListAction): RestaurantState => {
type Action = ListAction | DetailAction;

export default ((state: RestaurantState, action: Action): RestaurantState => {
switch(action.type) {
case TRANSFORM_LIST: {
const restaurants = _.keyBy(action.response, (restaurant: Restaurant) => restaurant.id);
const merged = _.extend({}, state.all, restaurants);
return Object.assign({}, state, {all: merged});
}
case TRANSFORM_DETAIL: {
const restaurant = {[action.response.id]: action.response};
const merge = _.extend({}, state.all, restaurant);
return Object.assign({}, state, {
all: merge,
selectedId: action.response.id
});
}
default: {
return state || initialState;
}
@@ -7,7 +7,9 @@ const Router = EmberRouter.extend({
});

Router.map(function() {
this.route('restaurants', {path: '/'});
this.route('restaurants', {path: '/'}, function() {
this.route('detail', {path: '/detail/:id'});
});
});

export default Router;
@@ -0,0 +1,19 @@
import fetch from 'fetch';
import { route } from 'ember-redux';
import { RestaurantHash } from '../../types/restaurants';
import { DetailDispatch, TRANSFORM_DETAIL } from '../../actions/restaurants';

type ParamsObject = {
id: string
}

const model = (dispatch: DetailDispatch, params: ParamsObject) => {
return fetch(`/api/restaurants/${params.id}`)
.then((fetched: Response) => fetched.json())
.then((response: RestaurantHash) => dispatch({
type: TRANSFORM_DETAIL,
response: response.restaurants
}));
};

export default route({model})();
@@ -0,0 +1,7 @@
<ul>
{{#each @restaurant.reviews as |review|}}
<li>{{review.rating}} ★</li>
{{else}}
<li>no reviews</li>
{{/each}}
</ul>
@@ -0,0 +1 @@
{{yield restaurant}}
@@ -1,5 +1,5 @@
<ul>
{{#each-in @restaurants as |key restaurant|}}
<li>{{restaurant.name}}</li>
<li>{{#link-to "restaurants.detail" restaurant.id}}{{restaurant.name}}{{/link-to}}</li>
{{/each-in}}
</ul>
@@ -1,3 +1,4 @@
<RestaurantItems as |restaurants|>
<RestaurantList @restaurants={{restaurants}} />
{{outlet}}
</RestaurantItems>
@@ -0,0 +1,3 @@
<RestaurantItem as |restaurant|>
<RestaurantDetail @restaurant={{restaurant}} />
</RestaurantItem>
@@ -7,8 +7,13 @@ export interface Restaurant {

export interface RestaurantState {
all: Dictionary<Restaurant>;
selectedId: number;
}

export interface Restaurants {
restaurants: Array<Restaurant>;
}

export interface RestaurantHash {
restaurants: Restaurant;
}

0 comments on commit 0fac0e8

Please sign in to comment.