./src/modules/movie-browser/movie-modal/movie-modal.container .js
Attempted import error: 'updateMoviePic tureUrls' is not exported from '../movie-browser.helper' (imported as 'movieHelpers') .
movie-browser.helper. js code
const TMDB_IMAGE_BASE _URL = (width = 300) => `https://image.tmdb.org/t/p/w$(width)`;
const updateMoviePict ureUrls = (movieResult, width = 300) => ({
...movieResult,
backdrop_path: `${TMDB_IMAGE_B ASE_URL(width)} ${movieResult.b ackdrop_path}`,
poster_path: `${TMDB_IMAGE_B ASE_URL(width)} ${movieResult.p oster_path}`,
});
export const getMoviesList = (moviesRes) => {
return !!moviesRes ? ([
...moviesRes.re sults.map(movie Result => updateMoviePict ureUrls(movieRe sult))
]) : null;
}
movie-modal.container .js code
import React from 'react';
import {connect} from 'react-redux';
import { Dialog } from 'material-ui';
import _ from 'lodash';
import { closeMovieModal } from './movie-modal.actions';
import { getMovieDetails } from '../movie-browser.actions ';
import * as movieHelpers from '../movie-browser.helper' ;
import Loader from '../../common/loader.componen t';
render() {
const {isOpen, closeMovieModal , isLoading} = this.props;
// const loadingStatus = isLoading ? 'loading' : 'hide';
const movie = movieHelpers.up dateMoviePictur eUrls(this.prop s.movie);
const genres = (movie && movie.genres) ? movie.genres.ma p(genre => genre.name).joi n(', ') : '';
return (
<Dialog
autoScrollBodyC ontent={true}
title={null}
modal={false}
open={isOpen}
onRequestClose= {closeMovieModa l}
>
<Loader isLoading={isLo ading}>
<div style={styles.d ialogContent(mo vie.backdrop_pa th)}>
<h1>{movie.titl e}</h1>
<h5>{genres}</h5>
<p>{movie.overv iew}</p>
<p>Popularity : {movie.populari ty}</p>
<p>Budget: ${movie.budget} </p>
</div>
</Loader>
</Dialog>
);
}
}
export default connect(
(state) => ({
isOpen: _.get(state, 'movieBrowser.m ovieModal.isOpe n', false),
movieId: _.get(state, 'movieBrowser.m ovieModal.movie Id'),
movie: _.get(state, 'movieBrowser.m ovieDetails.res ', {}),
isLoading: _.get(state, 'movieBrowser.m ovieDetails.isL oading', false),
}),
{ closeMovieModal , getMovieDetails }
)(MovieModalCon tainer);
Attempted import error: 'updateMoviePic tureUrls' is not exported from '../movie-browser.helper' (imported as 'movieHelpers') .
movie-browser.helper. js code
const TMDB_IMAGE_BASE _URL = (width = 300) => `https://image.tmdb.org/t/p/w$(width)`;
const updateMoviePict ureUrls = (movieResult, width = 300) => ({
...movieResult,
backdrop_path: `${TMDB_IMAGE_B ASE_URL(width)} ${movieResult.b ackdrop_path}`,
poster_path: `${TMDB_IMAGE_B ASE_URL(width)} ${movieResult.p oster_path}`,
});
export const getMoviesList = (moviesRes) => {
return !!moviesRes ? ([
...moviesRes.re sults.map(movie Result => updateMoviePict ureUrls(movieRe sult))
]) : null;
}
movie-modal.container .js code
import React from 'react';
import {connect} from 'react-redux';
import { Dialog } from 'material-ui';
import _ from 'lodash';
import { closeMovieModal } from './movie-modal.actions';
import { getMovieDetails } from '../movie-browser.actions ';
import * as movieHelpers from '../movie-browser.helper' ;
import Loader from '../../common/loader.componen t';
render() {
const {isOpen, closeMovieModal , isLoading} = this.props;
// const loadingStatus = isLoading ? 'loading' : 'hide';
const movie = movieHelpers.up dateMoviePictur eUrls(this.prop s.movie);
const genres = (movie && movie.genres) ? movie.genres.ma p(genre => genre.name).joi n(', ') : '';
return (
<Dialog
autoScrollBodyC ontent={true}
title={null}
modal={false}
open={isOpen}
onRequestClose= {closeMovieModa l}
>
<Loader isLoading={isLo ading}>
<div style={styles.d ialogContent(mo vie.backdrop_pa th)}>
<h1>{movie.titl e}</h1>
<h5>{genres}</h5>
<p>{movie.overv iew}</p>
<p>Popularity : {movie.populari ty}</p>
<p>Budget: ${movie.budget} </p>
</div>
</Loader>
</Dialog>
);
}
}
export default connect(
(state) => ({
isOpen: _.get(state, 'movieBrowser.m ovieModal.isOpe n', false),
movieId: _.get(state, 'movieBrowser.m ovieModal.movie Id'),
movie: _.get(state, 'movieBrowser.m ovieDetails.res ', {}),
isLoading: _.get(state, 'movieBrowser.m ovieDetails.isL oading', false),
}),
{ closeMovieModal , getMovieDetails }
)(MovieModalCon tainer);