Error: Minified React error #321 on deployment next.js

import React , { useState, useEffect } from 'react';
import 'bootstrap/dist/css/bootstrap.min.css';
import { Container, Row, Col, Button, Nav, NavItem, NavLink } from 'reactstrap';
import Link from 'next/link';
import Router from 'next/router';
import Welcome from '../components/navbar';
import fetch from 'isomorphic-unfetch';
import ReactMarkdown from 'react-markdown';
import {MDXProvider} from '@mdx-js/react';
import initialGA from '../components/analytics';
import PaginationProp from '../components/pagination';

initialGA("blog");


function Home ({posts})  {

    const [currentPage, setCurrentPage] = useState(1);
    const [postsPerPage] = useState(3);
    const paginate = pageNumber => setCurrentPage(pageNumber);
    const indexOfLastPost = currentPage * postsPerPage;
    const indexOfFirstPost = indexOfLastPost - postsPerPage;
    const currentPosts = posts.slice(indexOfFirstPost, indexOfLastPost);
    
  return <div >
        
     <img className="d-none d-sm-block logo" src="/logo.png" alt="my image" />
  <div className="div1">
    
    <div className="d-none d-sm-block">
    <Welcome ></Welcome>
    </div>
    <div className="d-block d-sm-none">
    <Welcome ></Welcome>
    </div>
    
   
    <Container className="ust1">
    {currentPosts.map(posts => (
    <Row className="ust justify-content-lg-center">
    <Col lg="4" >
    <Link href={posts.slug}>
    <Container className="kart img-fluid">
    <div className="postfoto ">
    <img className="postfoto2 img-fluid" src={posts.photo} alt="my image" />
    </div>
    <p className="tarih">{posts.date}</p>
    <h4 className="butonyazı">{posts.title}</h4>
    <p className="butonyazı2"><ReactMarkdown source={posts.details} /></p>
    </Container>
    </Link>
    </Col>
    </Row> 
))}
    <Row className="justify-content-center ust5">
    <PaginationProp
        postsPerPage={postsPerPage}
        totalPosts={posts.length}
        paginate={paginate}
      />
    </Row>
    </Container>




    </div>    

  

    <style global jsx>{`
.......

`}</style>

    
</div>
 
 
};


export async function getStaticProps() {
  const res = await fetch('https://..../api/posts');
  const json = await res.json();
  return {
    props: {
      posts: json.posts,
  }
}
}


export default Home;