From ccb9661666c81a055d3307871a91e732cf5e8b5f Mon Sep 17 00:00:00 2001 From: Robin Wieruch Date: Fri, 1 Sep 2017 17:53:10 +0200 Subject: [PATCH] part 14 --- src/components/SearchStories.js | 14 ++++++++++---- src/stores/storyStore.js | 25 +++++-------------------- 2 files changed, 15 insertions(+), 24 deletions(-) diff --git a/src/components/SearchStories.js b/src/components/SearchStories.js index bc7c7df..78b7b9a 100644 --- a/src/components/SearchStories.js +++ b/src/components/SearchStories.js @@ -1,9 +1,15 @@ import React, { Component } from 'react'; import { observable, action } from 'mobx'; -import { observer } from 'mobx-react'; +import { observer, inject } from 'mobx-react'; import Button from './Button'; -@observer +const HN_BASE_URL = 'http://hn.algolia.com/api/v1/search?query='; + +const fetchStories = (query) => + fetch(HN_BASE_URL + query) + .then(response => response.json()); + +@inject('storyStore') @observer class SearchStories extends Component { @observable query = ''; @@ -23,8 +29,8 @@ class SearchStories extends Component { @action onSubmit(event) { if (this.query) { - // TODO do API fetch stories - console.log(this.query); + fetchStories(this.query) + .then(result => this.props.storyStore.setStories(result.hits)) this.query = ''; } diff --git a/src/stores/storyStore.js b/src/stores/storyStore.js index eaaa9ba..589e98d 100644 --- a/src/stores/storyStore.js +++ b/src/stores/storyStore.js @@ -1,33 +1,18 @@ -import { observable, computed } from 'mobx'; - -const INITIAL_STATE = [ - { - title: 'React', - url: 'https://facebook.github.io/react/', - author: 'Jordan Walke', - num_comments: 3, - points: 4, - objectID: 0, - }, { - title: 'Redux', - url: 'https://github.com/reactjs/redux', - author: 'Dan Abramov, Andrew Clark', - num_comments: 2, - points: 5, - objectID: 1, - }, -]; +import { observable, computed, action } from 'mobx'; const isNotArchived = (archivedStoryIds) => (story) => archivedStoryIds.indexOf(story.objectID) === -1; class StoryStore { - @observable stories = INITIAL_STATE; + @observable stories = []; constructor(rootStore) { this.rootStore = rootStore; } + @action setStories = stories => + this.stories = stories; + @computed get readableStories() { const { archivedStoryIds } = this.rootStore.archiveStore; return this.stories.filter(isNotArchived(archivedStoryIds));