title: React - Imported array of objects not reversing
body: <p>I'm trying to reverse an array of objects that I import from a js file. Right now it only works when I put the array straight in my component where I want to display that data, not when I import it from another file. I can't figure out what the issue is, please let me know if I need to provide some additional information!</p>
  <p>I have data constructed like this in a js file:</p>
  <pre><code>const projects = [
    {
      id: 1,
      title: &quot;React Tv-show App&quot;,
      url: &quot;url&quot;,
      image: &quot;image&quot;,
    },
    {
      id: 2,
      title: &quot;React Landing Page&quot;,
      url: &quot;url&quot;,
      image: &quot;image&quot;,
    },
  etc..]
  
  export default projects;
  </code></pre>
  <p>My component where I want to display and reverse that data looks like this:</p>
  <pre><code>import data from &quot;./projects&quot;;
  
  export default function ProjectsView() {
  
    const projects = data.reverse();
  
    return (
      &lt;div className=&quot;projectsView&quot;&gt;
        &lt;h1 className=&quot;projectsTitle&quot;&gt;Projects&lt;/h1&gt;
        &lt;div className=&quot;projectsRow&quot;&gt;
          {projects.map((project) =&gt; {
            return (
              &lt;Project
                key={project.id}
                title={project.title}
                url={project.url}
                image={project.image}
              /&gt;
            );
          })}
        &lt;/div&gt;
      &lt;/div&gt;
    );
  }
  </code></pre>
  <p>I also tried projects.reverse().map() in the render but that didn't work either.</p>