title: How to use if statement in array map function with next.js
body: <p>if the remainder from the index number is 0, I want to wrap the code I need to show below and below. How can I do this? I tried like the ones below but it didn't work. I'm getting a syntax error.</p>
  <p>{index% 3 == 0? ...: ...}</p>
  <p>{index% 3 == 0 &amp;&amp; ...}</p>
  <pre><code>export default function UserPosts() {
      // some code...
      return (
          &lt;div className={styles.userPosts}&gt;
              {postsList.map((post, index) =&gt; {
                  return (
                      if (index % 3 == 0) {
                          &lt;div className={styles.userPostsRow}&gt;
                      }
                      &lt;div className={styles.userPostWrapper}&gt;
                          &lt;div className={styles.userPostColumn}&gt;
                              &lt;Link href={`/${username}`}&gt;
                                  &lt;a&gt;
                                      &lt;div className={styles.userPost}&gt;
                                          &lt;img src={post.image} alt=&quot;&quot; /&gt;
                                      &lt;/div&gt;
                                  &lt;/a&gt;
                              &lt;/Link&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      if (index % 3 == 0) {
                          &lt;/div&gt;
                      }
                  )                
              })}
          &lt;/div&gt;
      )
  }
  </code></pre>