Problems have appeared when raising the back and the front to production


I have problems that I am not able to solve, frontity is going to kill me :frowning:

My website is the following: so you can see the problems on the console.

I have these two components:

const Projects = ({ state }) => {
    const data = state.source.get('/');

    return ( data.isReady &&
        <section className="projects-cont">
            <StylePortfolio />
            <div className="projects">
          { id }) => {
                        const post =[id];

                        return (
                                <div className="article_cont">

                                    <article className="projects__article" key={id}>
                                        <Link link={} >
                                            <BsEye className="eye-portfolio" />

                                    <Link link={}>
                                            dangerouslySetInnerHTML={{ __html: post.title.rendered }}

export default connect(Projects);
import { connect } from 'frontity';

const Featured = ({state, imgID, element}) => {
    const media = state.source.attachment[imgID];
    const data = state.source.get('/');

    return ( data.isReady &&
            { element === "post" &&
export default connect(Featured);

As you can see on the console: Cannot read property ‘media_details’ of undefined

but if I pass a console.log () in the same component, this correctly prints the information


I do not know what could be causing all this, I can give access to repository so that I can see the code better.

Thank you.

try visit this page directly

there are no attachments in the state.
(go to your console and type frontity.state.source and you will see)

I suggest fixing that first

There is already response when querying with frontity.state.source.

but the error persists.

look at this line in the original mars theme

const FeaturedMedia = ({ state, id }) => {
  const media = state.source.attachment[id];

  if (!media) return null;  // <= stops it breaking

you need to allow the data time to finish loading. Remember react re-renders when incoming data changes.

I would probably also swap these 2 lines around

  const media = state.source.attachment[imgID];
  const data = state.source.get('/');

although I’m assuming the attachments get populated from the index page