From f49b4a57fd539670d98351bee28df31753b80275 Mon Sep 17 00:00:00 2001 From: Daniel Cortes Date: Wed, 24 Jun 2020 01:12:50 -0400 Subject: [PATCH] Issue #20 Solucionados errores mostrados por consola --- src/components/Auth.jsx | 18 ++++----- src/components/Comments.jsx | 6 +-- src/components/EntityList.jsx | 14 +++---- src/services/State.jsx | 5 +-- src/services/auth_service.js | 1 - src/services/entity_service.js | 69 ++++++++++++++++++++-------------- src/views/Recomended.jsx | 6 +-- 7 files changed, 64 insertions(+), 55 deletions(-) diff --git a/src/components/Auth.jsx b/src/components/Auth.jsx index 859e77c..bfc0404 100644 --- a/src/components/Auth.jsx +++ b/src/components/Auth.jsx @@ -5,8 +5,8 @@ import queryString from "query-string"; import {auth, logout} from "../services/auth_service"; import {useStateValue} from "../services/State"; -export const AuthMiddleware = (props) => { - const match = useRouteMatch('*') +export const AuthMiddleware = () => { + useRouteMatch('*'); return null; } @@ -20,8 +20,6 @@ export const AuthLogin = (props) => { const params = queryString.parse(props.location.search); auth(params).then((response) => { - console.debug(response, window.localStorage); - if(response.status === 'redirect_to_code'){ // Se va o ya se redirigió hacia la pagina que obtiene el código, no hay nada que hacer. return null; @@ -42,16 +40,16 @@ export const AuthLogin = (props) => { return null; } -export const AuthLogout = (props) => { +export const AuthLogout = () => { const [context, dispatch] = useStateValue(); + if (!context.user.auth) { - return + return ; } - logout(context.user.access_token).then(result => { - console.log(result); + logout(context.user.access_token).then(() => { + dispatch({type: 'logout', user: {auth: false}}) }); - dispatch({type: 'logout', user: {auth: false}}) - return + return ; } diff --git a/src/components/Comments.jsx b/src/components/Comments.jsx index b7ef58b..db06eab 100644 --- a/src/components/Comments.jsx +++ b/src/components/Comments.jsx @@ -6,14 +6,14 @@ import Faker from 'faker'; import './Comments.scss' const Comment = (props) => ( -
-
+
+
Avatar
{props.user}

{props.text}

-
+
diff --git a/src/components/EntityList.jsx b/src/components/EntityList.jsx index e75e13c..c915e06 100644 --- a/src/components/EntityList.jsx +++ b/src/components/EntityList.jsx @@ -13,11 +13,11 @@ const EntityHeader = (props) => { const EntityPlaceholder = (props) => { return (
  • -
    - +
    + {props.cover &&
    }
    -   +    
    @@ -30,16 +30,16 @@ const EntityItem = (props) => { const item = props.item; return (
  • -
    +
    {item.cover && item.cover}
    - {item.title} + {item.title} {item.subtitle}
    { item.widget && -
    +
    {item.widget}
    } @@ -59,7 +59,7 @@ export const EntityList = (props) => { }else{ let mapped = props.list.map(group => { let header = group.header ? : null; - let items = group.items.map(item => ); + let items = group.items.map((item, index) => ); items.unshift(header); return items; }); diff --git a/src/services/State.jsx b/src/services/State.jsx index 3f47b97..361b825 100644 --- a/src/services/State.jsx +++ b/src/services/State.jsx @@ -3,8 +3,6 @@ import React, {createContext, useContext, useReducer} from 'react'; const initialState = {user: {auth: false}}; const reducer = (state, action) => { - console.log(state, action); - switch (action.type) { case 'login': return { @@ -24,9 +22,10 @@ const reducer = (state, action) => { export const StateContext = createContext(null); export const StateProvider = ({children}) => { + const value = useReducer(reducer, initialState); return ( - + {children} ); diff --git a/src/services/auth_service.js b/src/services/auth_service.js index dfa9641..718d47e 100644 --- a/src/services/auth_service.js +++ b/src/services/auth_service.js @@ -68,7 +68,6 @@ export const auth = async (params) => { if (expires > new Date()) { const refresh_token = window.localStorage.getItem('refresh_token'); response = await do_refresh(refresh_token); - console.log('refresh response', response); } } diff --git a/src/services/entity_service.js b/src/services/entity_service.js index fd13f4b..ff0703d 100644 --- a/src/services/entity_service.js +++ b/src/services/entity_service.js @@ -3,56 +3,69 @@ import axios from 'axios'; let baseUrl = `${process.env.REACT_APP_API_SERVER}/api/brainz`; export async function getArtist(mbid) { - const url = `${baseUrl}/artist/${mbid}`; - const response = await axios.get(url) - return response.data + const url = `${baseUrl}/artist/${mbid}`; + const response = await axios.get(url) + return response.data } export async function getArtistDiscs(mbid, page = 1, per_page = 10) { - const url = `${baseUrl}/artist/${mbid}/discs?per_page=${per_page}&page=${page}`; - const response = await axios.get(url); - return response.data + const url = `${baseUrl}/artist/${mbid}/discs?per_page=${per_page}&page=${page}`; + const response = await axios.get(url); + return response.data } export async function getDisc(mbid) { - const url = `${baseUrl}/disc/${mbid}`; - const response = await axios.get(url); - return response.data + const url = `${baseUrl}/disc/${mbid}`; + const response = await axios.get(url); + return response.data } export async function getDiscVersions(mbid, page = 1, per_page = 10) { - const url = `${baseUrl}/disc/${mbid}/releases`; - const response = await axios.get(url); - return response.data + const url = `${baseUrl}/disc/${mbid}/releases`; + const response = await axios.get(url); + return response.data } export async function getRelease(mbid) { - const url = `${baseUrl}/release/${mbid}`; - const response = await axios.get(url); - return response.data + const url = `${baseUrl}/release/${mbid}`; + const response = await axios.get(url); + return response.data } export async function getReleaseSongs(mbid) { - const url = `${baseUrl}/release/${mbid}/recordings`; - const response = await axios.get(url); - return response.data + const url = `${baseUrl}/release/${mbid}/recordings`; + const response = await axios.get(url); + return response.data } export async function getSong(mbid) { - const url = `${baseUrl}/recording/${mbid}`; - const response = await axios.get(url); - console.log(response.data); - return response.data; + const url = `${baseUrl}/recording/${mbid}`; + const response = await axios.get(url); + return response.data; } export async function getDiscCoverArt(mbid) { - const url = `${baseUrl}/disc/${mbid}/coverart`; - const response = await axios.get(url); - return response.data + const url = `${baseUrl}/disc/${mbid}/coverart`; + try{ + const response = await axios.get(url); + return response.data; + } catch (error) { + // 404 es un caso común asi que es ignorado + if(error.response.status !== 404){ + return error; + } + } } export async function getReleaseCoverArt(mbid) { - const url = `${baseUrl}/release/${mbid}/coverart`; - const response = await axios.get(url); - return response.data + const url = `${baseUrl}/release/${mbid}/coverart`; + try{ + const response = await axios.get(url); + return response.data; + } catch (error) { + // 404 es un caso común asi que es ignorado + if(error.response.status !== 404){ + return error; + } + } } diff --git a/src/views/Recomended.jsx b/src/views/Recomended.jsx index 9442f64..f616557 100644 --- a/src/views/Recomended.jsx +++ b/src/views/Recomended.jsx @@ -21,7 +21,7 @@ const PopularArtists = () => { return } else { const items = artists.map((artist) => { - const widget = ( {Math.floor(Math.random() * 1000)}); + const widget = ( {Math.floor(Math.random() * 1000)}); return { 'cover': null, 'link': `/artist/${artist.id}`, @@ -50,7 +50,7 @@ const PopularDiscs = () => { }else { const items = discs.map((disc) => { const cover = (); - const widget = ( {Math.floor(Math.random() * 1000)}) + const widget = ( {Math.floor(Math.random() * 1000)}) return { 'cover': cover, 'link': `/disc/${disc.id}`, @@ -80,7 +80,7 @@ const PopularSongs = () => { return }else { const items = songs.map((song) => { - const widget = ( {Math.floor(Math.random() * 1000)}); + const widget = ( {Math.floor(Math.random() * 1000)}); return { 'cover': null, 'link': `/song/${song.id}`,