results page first commit.

This commit is contained in:
Ahmed-Ayman 2018-12-13 19:04:55 +02:00
parent ff519477ac
commit fde16110cc
6 changed files with 45 additions and 6 deletions

View File

@ -26,6 +26,7 @@ class App extends Component {
<Switch>
<Route exact={true} path="/" component={Home}/>
<Route path="/topics" component={TopicsListContainer}/>
<Route path="/results/:categoryKey/:searchValue" component={Results}/>
<Route path="/videos/:videoId" component={Video}/>
</Switch>
<Nav/>

View File

@ -1,4 +1,3 @@
// Topics Action Types
export const START_LOADING_ALL_TOPICS = 'START_LOADING_ALL_TOPICS';
export const LOADED_ALL_TOPICS = 'LOADED_ALL_TOPICS';
@ -8,4 +7,9 @@ export const LOADED_RANDOM_TOPIC = 'LOADED_RANDOM_TOPIC';
// Videos Action Types
export const ADD_VIDEOS_TO_STATE = 'ADD_VIDEOS_TO_STATE';
export const START_LOADING_VIDEO = 'START_LOADING_VIDEO';
export const LOADED_VIDEO = 'LOADED_VIDEO';
export const LOADED_VIDEO = 'LOADED_VIDEO';
// Search Results Action Types
export const START_LOADING_ALL_RESULTS = 'START_LOADING_ALL_RESULTS';
export const LOADED_ALL_RESULTS = 'LOADED_ALL_RESULTS';

12
src/actions/search.js Normal file
View File

@ -0,0 +1,12 @@
import {LOADED_ALL_RESULTS,START_LOADING_ALL_RESULTS} from "./action_types";
export function getAllResuts(categoryKey, searchValue){
// get the stuff from the api
// dispatch loaded
return dispatch => {
dispatch(loadingAllResults())
}
}
function loadingAllResults() {
}

View File

@ -39,7 +39,6 @@ class TopicsList extends React.Component {
{this.state.filteredTopics.map(topic => {
return (
<section className="topic-item" key={topic.name}>
<Link to={"/topic/" + topic.name}>
<h3>{topic.name} ({topic.items} videos)</h3>

View File

@ -1,12 +1,9 @@
import React from 'react';
import {connect} from 'react-redux';
import { getAllTopics, getRandomTopicVideos } from '../actions/topics';
import Search from '../components/Search';
import Footer from '../components/Footer';
import RandomLocation from "../components/RandomLocation";
import RandomDate from "../components/RandomDate";
import RandomTopic from "../components/RandomTopic";
import Header from "../components/Header";
class Home extends React.Component {
componentDidMount() {

26
src/containers/Results.js Normal file
View File

@ -0,0 +1,26 @@
import React from 'react';
class Results extends React.Component {
componentDidMount() {
const categoryKey = this.props.match.params.categoryKey;
const searchValue = this.props.match.params.searchValue;
}
render() {
return (
);
}
}
const mapStateToProps = state => ({
searchResults: this.state.results.currentItems,
});
const mapDispatchToProps = dispatch => ({
searchResults: (categoryKey, searchValue) => dispatch(getSearchResults(categoryKey, searchValue)),
});
export default;