score:0

can you try this one i think you forgot the data key in your response, but i can't be sure as i don't have getresponse() function?

import react from 'react';
import getresponse from '../handler/getresponse.jsx';
import spinner from '../spinner/spinner.jsx';

import './modal.css';

 const modal = ({close, item}) => {
    const r = getresponse(item);
    const response = r.data;

    console.log(response);


    // you can check if it is string with this one;
   if (typeof response.image === 'string' && response.image !== '') {
     console.log('string exists and is not empty')
   }

    return (
        <div>
           {response === null &&(<spinner/>)}
            {response &&(
                <div classname='modal'>
                <div classname='popup'>
                    <h1>{response.result.name}</h1>
                    <h5>{response.result.description}</h5>
                    {(response.image === "error") &&(
                        <p classname="text">{response.result.detaileddescription.articlebody}</p>
                    )}
                   {response.image && (response.image !== "error") &&(
                     <div classname="container">
                                <div classname="left">{response.result.detaileddescription.articlebody}</div>
                        <div classname="right"><img classname="image" alt="image" src={response.image}/></div>
                     </div>
                   )}
                   {response.result.image &&(
                     <div classname="container">
                        <div classname="left">{response.result.detaileddescription.articlebody}</div>
                        <div classname="right"><img classname="image" alt="image" src={response.result.image.contenturl}/></div>
                     </div>
                   )}
                   <button onclick={ () => { close(false) }}>close me</button>
                </div>
              </div>
            )}
        </div>
   );
}

export default modal;

Related Query

More Query from same tag