hello sir i have issue that my cards are not showing result of a specific country it will show the global result but does not show specific country report

[priyanshisharma-21]

No description provided.

[priyanshisharma-21]

app.js code
import React from 'react';
import{ Cards,Chart, CountryPicker} from './components';
import styles from './App.module.css';
import {fetchData} from './api/';
// import styles from './Chart.module.css';

class App extends React.Component{
state = {
data:{},
country: '',
}
async componentDidMount(){
const fetchedData =await fetchData();
this.setState({data: fetchedData });
}

handleCountryChange = async (country) =>{
    const fetchedData =await fetchData(country);
    // console.log(fetchedData);
    this.setState({ data: fetchedData, country: country});
    
}
render()

{
const {data} = this.state;
return(

{/* */}

    </div>
);

}
}
export default App;

[SohamDave08]

Can you send api/index.js file? I faced the same issue but recovered from it.

[priyanshisharma-21]

api/index.js

import axios from 'axios';

const url='https://covid19.mathdro.id/api';
export const fetchData = async (country) => {
let changeableUrl =url;
if(country){
changeableUrl = 'https://covid19.mathdro.id/api/countries/country';
}
try{
const {data:{confirmed, recovered, deaths, lastUpdate}} = await axios.get(url);

    return {confirmed, recovered, deaths, lastUpdate};
}catch (error){
     console.log(error);
     
}

}
export const fetchDailyData = async ()=> {
try{
const {data} = await axios.get(url('https://covid19.mathdro.id/api/daily'));
const modifiedData = data.map((dailyData)=> ({
confirmed: dailyData.confirmed.total,
deaths: dailyData.deaths.total,
date: dailyData.reportDate,
}));
return modifiedData;
}catch (error){}

}
export const fetchCountries = async () => {

try{
    const {data: {countries}}=  await axios.get('https://covid19.mathdro.id/api/countries ');
   
    return countries.map((country) => country.name);

}catch(error){
    console.log(error);
    
}

};

[SohamDave08]

api/index.js

import axios from 'axios';

const url='https://covid19.mathdro.id/api';
export const fetchData = async (country) => {
let changeableUrl =url;
if(country){
changeableUrl = 'https://covid19.mathdro.id/api/countries/country';
}
try{
const {data:{confirmed, recovered, deaths, lastUpdate}} = await axios.get(url);

    return {confirmed, recovered, deaths, lastUpdate};
}catch (error){
     console.log(error);
     
}

}
export const fetchDailyData = async ()=> {
try{
const {data} = await axios.get(url('https://covid19.mathdro.id/api/daily'));
const modifiedData = data.map((dailyData)=> ({
confirmed: dailyData.confirmed.total,
deaths: dailyData.deaths.total,
date: dailyData.reportDate,
}));
return modifiedData;
}catch (error){}

}
export const fetchCountries = async () => {

try{
    const {data: {countries}}=  await axios.get('https://covid19.mathdro.id/api/countries ');
   
    return countries.map((country) => country.name);

}catch(error){
    console.log(error);
    
}

};

Got you error, you changed the new URL in changeableUrl but didn't pass that to API for fetching, made changes in code, and attached below. Hope it helped you :)

`export const fetchData = async (country) => {
let changeableUrl =url;
if(country){
changeableUrl = 'https://covid19.mathdro.id/api/countries/country';
}
try{
const {data:{confirmed, recovered, deaths, lastUpdate}} = await axios.get(changeableUrl);

return {confirmed, recovered, deaths, lastUpdate};

}catch (error){
console.log(error);

}
}`

[Phimanshu07]

i am getting same error

{"error":{"message":"Country country not found in JHU database"}}