summaryrefslogtreecommitdiff
path: root/src/pages/shop/brands.js
diff options
context:
space:
mode:
authorRafi Zadanly <zadanlyr@gmail.com>2023-01-24 15:54:48 +0700
committerRafi Zadanly <zadanlyr@gmail.com>2023-01-24 15:54:48 +0700
commitee4297280c1305c7e03bedd4df63ccf136c28c6c (patch)
tree62eb00777f42542a37c63687dd1536f8f56df894 /src/pages/shop/brands.js
parent23b31aa10302cc990f3fb083b8189233b2e9e08d (diff)
Merapihkan struktur folder
Diffstat (limited to 'src/pages/shop/brands.js')
-rw-r--r--src/pages/shop/brands.js79
1 files changed, 0 insertions, 79 deletions
diff --git a/src/pages/shop/brands.js b/src/pages/shop/brands.js
deleted file mode 100644
index d82fc31d..00000000
--- a/src/pages/shop/brands.js
+++ /dev/null
@@ -1,79 +0,0 @@
-import Header from "../../components/Header";
-import apiOdoo from "../../helpers/apiOdoo";
-import InfiniteScroll from "react-infinite-scroll-component";
-import { useEffect, useState } from "react";
-import Spinner from "../../components/Spinner";
-import Layout from "../../components/Layout";
-import ManufactureCard from "../../components/ManufactureCard";
-import Footer from "../../components/Footer";
-
-export async function getServerSideProps() {
- let initialManufactures = await apiOdoo('GET', '/api/v1/manufacture?limit=31');
- return {props: {initialManufactures}};
-}
-
-export default function Brands({ initialManufactures }) {
- const [manufactures, setManufactures] = useState(initialManufactures.manufactures);
- const [hasMoreManufacture, setHasMoreManufacture] = useState(true);
- const [manufactureStartwith, setManufactureStartWith] = useState('');
-
- const alpha = Array.from(Array(26)).map((e, i) => i + 65);
- const alphabets = alpha.map((x) => String.fromCharCode(x));
-
- const getMoreManufactures = async () => {
- const name = manufactureStartwith != '' ? `${manufactureStartwith}%` : '';
- const result = await apiOdoo('GET', `/api/v1/manufacture?limit=30&offset=${manufactures.length}&name=${name}`);
- setHasMoreManufacture(manufactures.length + 30 < result.manufacture_total)
- setManufactures((manufactures) => [...manufactures, ...result.manufactures]);
- };
-
- const filterManufactureStartWith = (character) => {
- setManufactures([]);
- if (manufactureStartwith == character) {
- setManufactureStartWith('');
- } else {
- setManufactureStartWith(character);
- }
- };
-
- useEffect(() => {
- getMoreManufactures();
- }, [manufactureStartwith]);
-
- return (
- <>
- <Header title='Semua Brand di Indoteknik' />
- <Layout>
- <div className="p-4">
- <h1>Semua Brand di Indoteknik</h1>
- <div className="flex overflow-x-auto gap-x-2 py-2">
- {alphabets.map((alphabet, index) => (
- <button key={index} className={"p-2 py-1 border bg-white border-gray_r-6 rounded w-10 flex-shrink-0" + (manufactureStartwith == alphabet ? ' bg-yellow_r-9 border-yellow_r-9 ' : '')} onClick={() => filterManufactureStartWith(alphabet)}>
- {alphabet}
- </button>
- ))}
- </div>
- <InfiniteScroll
- dataLength={manufactures.length}
- next={getMoreManufactures}
- hasMore={hasMoreManufacture}
- className="grid grid-cols-4 gap-4 mt-6 !overflow-x-hidden"
- loader={
- <div className="flex justify-center items-center border border-gray-300 p-2 rounded h-14">
- <Spinner className="w-6 h-6 text-gray-600 fill-gray-900"/>
- </div>
- }
- >
- {manufactures?.map((manufacture, index) => (
- manufacture.name ? (
- <ManufactureCard data={manufacture} key={index} />
- ) : ''
- ))}
- </InfiniteScroll>
- </div>
-
- <Footer />
- </Layout>
- </>
- )
-} \ No newline at end of file