DonHuskini

const asyncTryCatch = async (tryer) => {
  try {
    const data = await tryer();
    return [data, null];
  } catch (error) {
    return [null, error];
  }
};

export default async function (req: NextApiRequest, res: NextApiResponse) {

DonHuskini

import styled from "styled-components";

import ProductList from "./components/products/ProductList";
import items from "./assets/items.json";

const S = {};
S.Container = styled.div`
  max-width: 800px;
  margin: 0 auto;
`;

DonHuskini

import { useState } from "react";
import styled from "styled-components";
import { useSpringCarousel } from "react-spring-carousel-js";

import CarouselItem from "./CarouselItem";
import ArrowButton from "./ArrowButton";
import { S as StyledArrowButton } from "./ArrowButton";

const S = {};
S.Carousel = styled.div`

DonHuskini

import styled from "styled-components";

const S = {};
S.CarouselItem = styled.div`
  padding: 0.5rem 0;
  border-bottom: solid 1px;

  img {
    width: 100%;
    height: 100%;

DonHuskini

import styled from "styled-components";
import LeftArrow from "../icons/LeftArrow";
import RightArrow from "../icons/RightArrow";

export const S = {};
S.ArrowButton = styled.button`
  background-color: transparent;
  border: none;
  position: absolute;
  z-index: 999;

DonHuskini

const RightArrow = () => {
  return (
    <svg
      xmlns="http://www.w3.org/2000/svg"
      width="2rem"
      height="2rem"
      fill="currentColor"
      class="bi bi-arrow-right-short"
      viewBox="0 0 16 16"
    >

DonHuskini

const LeftArrow = () => {
  return (
    <svg
      xmlns="http://www.w3.org/2000/svg"
      width="2rem"
      height="2rem"
      fill="currentColor"
      class="bi bi-arrow-left-short"
      viewBox="0 0 16 16"
    >

DonHuskini

import styled from "styled-components";

import Product from "./Product";

const S = {};
S.ProductList = styled.div`
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 1em;
`;

DonHuskini

import styled from "styled-components";
import Carousel from "./../carousel/Carousel";

const S = {};
S.Product = styled.div`
  border: solid 1px;
  font-size: 1.25rem;
`;

S.Details = styled.div`

DonHuskini

[
  {
    "id": 1,
    "name": "Leopard Gaming Chair, High Back PU Leather Office Chair - Black/Blue",
    "price": 189.99,
    "images": [
      "https://images-na.ssl-images-amazon.com/images/I/61vKfuN%2B8TL._AC_SL1500_.jpg",
      "https://images-na.ssl-images-amazon.com/images/I/617ue%2BHuTwL._AC_SL1500_.jpg",
      "https://images-na.ssl-images-amazon.com/images/I/71-UcCz9zoL._AC_SL1500_.jpg",
      "https://images-na.ssl-images-amazon.com/images/I/71Jq7Z11E6L._AC_SL1500_.jpg",