removed hard coded api key

This commit is contained in:
andres alcocer
2020-05-15 15:02:57 -04:00
parent 3faffa603a
commit 50d2c1dfad
15 changed files with 29 additions and 37 deletions

View File

@@ -18,7 +18,7 @@ export default class MovieGenre extends Component {
render() {
let netflixUrl = false;
if (this.props.url === "/discover/tv?api_key=224ce27b38a3805ecf6f6c36eb3ba9d0&with_networks=213") {
if (this.props.url === `/discover/tv?api_key=${process.env.API_KEY}&with_networks=213`) {
netflixUrl = true;
}

View File

@@ -5,7 +5,7 @@ export default function MovieGenreImage(props) {
if (
props.url ===
'https://api.themoviedb.org/3/discover/tv?api_key=224ce27b38a3805ecf6f6c36eb3ba9d0&with_networks=213'
`https://api.themoviedb.org/3/discover/tv?api_key=${process.env.API_KEY}&with_networks=213`
) {
netflixUrl = true;
}

View File

@@ -15,8 +15,7 @@ class ActionMovies extends Component {
// Call getMoviesRows function only when we get the data back
// from the API through redux
if (this.props.actionMovies.data) {
const url =
'/discover/movie?api_key=224ce27b38a3805ecf6f6c36eb3ba9d0&with_genres=28';
const url = `/discover/movie?api_key=${process.env.API_KEY}&with_genres=28`;
movies = getMovieRows(this.props.actionMovies.data, url);
}
return (

View File

@@ -15,8 +15,7 @@ class ComedyMovies extends Component {
// Call getMoviesRows function only when we get the data back
// from the API through redux
if (this.props.movies.data) {
const url =
'/discover/tv?api_key=224ce27b38a3805ecf6f6c36eb3ba9d0&with_genres=35';
const url = `/discover/tv?api_key=${process.env.API_KEY}&with_genres=35`;
movies = getMovieRows(this.props.movies.data, url);
}
return (

View File

@@ -15,8 +15,7 @@ class Documentaries extends Component {
// Call getMoviesRows function only when we get the data back
// from the API through redux
if (this.props.movies.data) {
const url =
'/discover/tv?api_key=224ce27b38a3805ecf6f6c36eb3ba9d0&with_genres=99';
const url = `/discover/tv?api_key=${process.env.API_KEY}&with_genres=99`;
movies = getMovieRows(this.props.movies.data, url);
}
return (

View File

@@ -15,8 +15,7 @@ class HorrorMovies extends Component {
// Call getMoviesRows function only when we get the data back
// from the API through redux
if (this.props.movies.data) {
const url =
'/discover/tv?api_key=224ce27b38a3805ecf6f6c36eb3ba9d0&with_genres=27';
const url = `/discover/tv?api_key=${process.env.API_KEY}&with_genres=27`;
movies = getMovieRows(this.props.movies.data, url);
}
return (

View File

@@ -1,5 +1,5 @@
import React, { Component } from 'react';
import axios from "axios";
import axios from "../axios-movies";
import Navbar from './Navbar';
import MainContent from './MainContent';
@@ -22,7 +22,7 @@ class Layout extends Component {
/** Make API call as soon as the user starts typing. */
makeAipCall = (searchItem) => {
const url = `https://api.themoviedb.org/3/search/multi?api_key=9ea839ec7891591994ec0f540b4b199f&language=en-US&include_adult=false&query=${searchItem}`;
const url = `/search/multi?api_key=${process.env.API_KEY}&language=en-US&include_adult=false&query=${searchItem}`;
axios.get(url)
.then(res => {
@@ -82,11 +82,11 @@ class Layout extends Component {
/** Make the appropriate API call to get the details for a single movie or tv show. */
if (movie.media_type === "movie") {
const movieId = movie.id;
url = `https://api.themoviedb.org/3/movie/${movieId}?api_key=224ce27b38a3805ecf6f6c36eb3ba9d0`;
url = `https://api.themoviedb.org/3/movie/${movieId}?api_key=${process.env.API_KEY}`;
} else if (movie.media_type === "tv") {
const tvId = movie.id
url = `https://api.themoviedb.org/3/tv/${tvId}?api_key=224ce27b38a3805ecf6f6c36eb3ba9d0`;
url = `https://api.themoviedb.org/3/tv/${tvId}?api_key=${process.env.API_KEY}`;
}
axios.get(url)

View File

@@ -8,8 +8,6 @@ import NetflixOriginals from './NetflixOriginals';
import TopRated from './TopRated';
import ActionMovies from './ActionMovies';
import ComedyMovies from './ComedyMovies';
import HorrorMovies from './HorrorMovies';
import RomanceMovies from './RomanceMovies';
import Documentaries from './Documentaries';
@@ -29,7 +27,7 @@ class MainContent extends Component {
/** Movie Id for the Narcos series */
const movieId = 63351;
/** Make Api call to retrieve the details for a single movie */
const url = `https://api.themoviedb.org/3/tv/${movieId}?api_key=224ce27b38a3805ecf6f6c36eb3ba9d0`;
const url = `https://api.themoviedb.org/3/tv/${movieId}?api_key=${process.env.API_KEY}`;
axios
.get(url)
.then(res => {
@@ -51,7 +49,6 @@ class MainContent extends Component {
<TopRated />
<ActionMovies />
<ComedyMovies />
{/* <HorrorMovies /> */}
<Documentaries />
</div>
<Footer />

View File

@@ -15,8 +15,7 @@ class NetflixOriginals extends Component {
// Call getMoviesRows function only when we get the data back
// from the API through redux
if (this.props.movies.data) {
const url =
'/discover/tv?api_key=224ce27b38a3805ecf6f6c36eb3ba9d0&with_networks=213';
const url = `/discover/tv?api_key=${process.env.API_KEY}&with_networks=213`;
movies = getMovieRows(this.props.movies.data, url);
}
return (

View File

@@ -15,8 +15,7 @@ class RomanceMovies extends Component {
// Call getMoviesRows function only when we get the data back
// from the API through redux
if (this.props.movies.data) {
const url =
'/discover/tv?api_key=224ce27b38a3805ecf6f6c36eb3ba9d0&with_genres=10749';
const url = `/discover/tv?api_key=${process.env.API_KEY}&with_genres=10749`;
movies = getMovieRows(this.props.movies.data, url);
}
return (

View File

@@ -15,8 +15,7 @@ class TopRated extends Component {
// Call getMoviesRows function only when we get the data back
// from the API through redux
if (this.props.topRated.data) {
const url =
'/movie/top_rated?api_key=224ce27b38a3805ecf6f6c36eb3ba9d0&language=en-US';
const url = `/movie/top_rated?api_key=${process.env.API_KEY}&language=en-US`;
movies = getMovieRows(this.props.topRated.data, url);
}
return (

View File

@@ -15,8 +15,7 @@ class TrendingMovies extends Component {
// Call getMoviesRows function only when we get the data back
// from the API through redux
if (this.props.trending.data) {
const url =
'/trending/all/week?api_key=224ce27b38a3805ecf6f6c36eb3ba9d0&language=en-US';
const url = `/trending/all/week?api_key=${process.env.API_KEY}&language=en-US`;
movies = getMovieRows(this.props.trending.data, url);
}
return (

View File

@@ -6,8 +6,7 @@ export function getMovieRows(movies, url) {
let movieImageUrl =
'https://image.tmdb.org/t/p/w500/' + movie.backdrop_path;
if (
url ===
'/discover/tv?api_key=224ce27b38a3805ecf6f6c36eb3ba9d0&with_networks=213'
url === `/discover/tv?api_key=${process.env.API_KEY}&with_networks=213`
) {
movieImageUrl =
'https://image.tmdb.org/t/p/original/' + movie.poster_path;

View File

@@ -12,6 +12,12 @@ import './static/sass/style.scss';
const createStoreWithMiddleware = applyMiddleware(promise)(createStore);
// TODO
// - fix styling issue
// - implemented debouncing
// - implement carousel
// - fix modal backdrop bug
// - add routing and 404 page
const app = (
<Provider store={createStoreWithMiddleware(reducers)}>
<BrowserRouter>

View File

@@ -9,11 +9,9 @@ export const FETCH_HORROR_MOVIES = 'FETCH_HORROR_MOVIES';
export const FETCH_ROMANCE_MOVIES = 'FETCH_ROMANCE_MOVIES';
export const FETCH_DOCUMENTARIES = 'FETCH_DOCUMENTARIES';
const API_KEY = '224ce27b38a3805ecf6f6c36eb3ba9d0';
export function fetchTrending() {
const request = axios.get(
`/trending/all/week?api_key=${API_KEY}&language=en-US`
`/trending/all/week?api_key=${process.env.API_KEY}&language=en-US`
);
return {
@@ -35,7 +33,7 @@ export function fetchNetflixOriginals() {
export function fetchTopRated() {
const request = axios.get(
`/movie/top_rated?api_key=${API_KEY}&language=en-US`
`/movie/top_rated?api_key=${process.env.API_KEY}&language=en-US`
);
return {
@@ -46,7 +44,7 @@ export function fetchTopRated() {
export function fetchActionMovies() {
const request = axios.get(
`/discover/movie?api_key=${API_KEY}&with_genres=28`
`/discover/movie?api_key=${process.env.API_KEY}&with_genres=28`
);
return {
@@ -57,7 +55,7 @@ export function fetchActionMovies() {
export function fetchComedyMovies() {
const request = axios.get(
`/discover/movie?api_key=${API_KEY}&with_genres=35`
`/discover/movie?api_key=${process.env.API_KEY}&with_genres=35`
);
return {
@@ -68,7 +66,7 @@ export function fetchComedyMovies() {
export function fetchHorrorMovies() {
const request = axios.get(
`/discover/movie?api_key=${API_KEY}&with_genres=27`
`/discover/movie?api_key=${process.env.API_KEY}&with_genres=27`
);
return {
@@ -79,7 +77,7 @@ export function fetchHorrorMovies() {
export function fetchRomanceMovies() {
const request = axios.get(
`/discover/movie?api_key=${API_KEY}&with_genres=10749`
`/discover/movie?api_key=${process.env.API_KEY}&with_genres=10749`
);
return {
@@ -90,7 +88,7 @@ export function fetchRomanceMovies() {
export function fetchDocumentaries() {
const request = axios.get(
`/discover/movie?api_key=${API_KEY}&with_genres=99`
`/discover/movie?api_key=${process.env.API_KEY}&with_genres=99`
);
return {