472,125 Members | 1,572 Online
Bytes | Software Development & Data Engineering Community
Post +

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 472,125 software developers and data experts.

Failed to compile. Attempted import error: 'updateMoviePictureUrls'

10 Byte
./src/modules/movie-browser/movie-modal/movie-modal.container.js
Attempted import error: 'updateMoviePictureUrls' 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 updateMoviePictureUrls = (movieResult, width = 300) => ({
...movieResult,
backdrop_path: `${TMDB_IMAGE_BASE_URL(width)}${movieResult.backdr op_path}`,
poster_path: `${TMDB_IMAGE_BASE_URL(width)}${movieResult.poster _path}`,
});

export const getMoviesList = (moviesRes) => {
return !!moviesRes ? ([
...moviesRes.results.map(movieResult => updateMoviePictureUrls(movieResult))
]) : 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.component';

render() {
const {isOpen, closeMovieModal, isLoading} = this.props;
// const loadingStatus = isLoading ? 'loading' : 'hide';
const movie = movieHelpers.updateMoviePictureUrls(this.props.mov ie);
const genres = (movie && movie.genres) ? movie.genres.map(genre => genre.name).join(', ') : '';

return (
<Dialog
autoScrollBodyContent={true}
title={null}
modal={false}
open={isOpen}
onRequestClose={closeMovieModal}
>
<Loader isLoading={isLoading}>
<div style={styles.dialogContent(movie.backdrop_path)}>
<h1>{movie.title}</h1>
<h5>{genres}</h5>
<p>{movie.overview}</p>
<p>Popularity: {movie.popularity}</p>
<p>Budget: ${movie.budget}</p>
</div>
</Loader>
</Dialog>
);
}
}

export default connect(
(state) => ({
isOpen: _.get(state, 'movieBrowser.movieModal.isOpen', false),
movieId: _.get(state, 'movieBrowser.movieModal.movieId'),
movie: _.get(state, 'movieBrowser.movieDetails.res', {}),
isLoading: _.get(state, 'movieBrowser.movieDetails.isLoading', false),
}),
{ closeMovieModal, getMovieDetails }
)(MovieModalContainer);
Oct 21 '20 #1
0 2002

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

2 posts views Thread by Markus Doering | last post: by
3 posts views Thread by Eamonn O'Connell | last post: by
4 posts views Thread by Steve | last post: by
3 posts views Thread by Neter Smith | last post: by
reply views Thread by Michael Boldin via alt email | last post: by
reply views Thread by leo001 | last post: by

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.