summaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/core/components/elements/Navbar/NavbarDesktop.jsx6
-rw-r--r--src/lib/checkout/components/FinishCheckout.jsx2
-rw-r--r--src/lib/product/components/Product/ProductDesktop.jsx16
-rw-r--r--src/lib/product/components/Product/ProductMobile.jsx10
-rw-r--r--src/lib/video/api/videoApi.js8
-rw-r--r--src/lib/video/hooks/useVideo.js13
-rw-r--r--src/pages/index.jsx26
-rw-r--r--src/pages/video.jsx55
8 files changed, 119 insertions, 17 deletions
diff --git a/src/core/components/elements/Navbar/NavbarDesktop.jsx b/src/core/components/elements/Navbar/NavbarDesktop.jsx
index e06b327a..5d7fe846 100644
--- a/src/core/components/elements/Navbar/NavbarDesktop.jsx
+++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx
@@ -109,6 +109,12 @@ const NavbarDesktop = () => {
>
Blog Indoteknik
</Link>
+ <Link
+ href='/video'
+ className='p-4 flex-1 flex justify-center items-center !text-gray_r-12/80 bg-gray_r-2 hover:bg-gray_r-4 border border-gray_r-6 idt-transition'
+ >
+ Indoteknik TV
+ </Link>
</div>
<div className='w-3/12 flex gap-x-1 relative'>
diff --git a/src/lib/checkout/components/FinishCheckout.jsx b/src/lib/checkout/components/FinishCheckout.jsx
index 33c0d46a..4af39e91 100644
--- a/src/lib/checkout/components/FinishCheckout.jsx
+++ b/src/lib/checkout/components/FinishCheckout.jsx
@@ -2,7 +2,7 @@ import Link from '@/core/components/elements/Link/Link'
const FinishCheckout = ({ query }) => {
return (
- <div className='p-4'>
+ <div className='mx-auto container p-4 md:p-0 mt-0 md:mt-10'>
<div className='rounded-xl bg-yellow_r-4 text-center border border-yellow_r-7'>
<div className='px-4 py-6 text-yellow_r-12'>
<p className='font-semibold mb-2'>Terima Kasih atas Pembelian Anda</p>
diff --git a/src/lib/product/components/Product/ProductDesktop.jsx b/src/lib/product/components/Product/ProductDesktop.jsx
index 79e7bb45..2f0ac488 100644
--- a/src/lib/product/components/Product/ProductDesktop.jsx
+++ b/src/lib/product/components/Product/ProductDesktop.jsx
@@ -12,6 +12,7 @@ import useVariantPrice from '@/lib/variant/hooks/useVariantPrice'
import useProductPrice from '../../hooks/useProductPrice'
import PriceSkeleton from '@/core/components/elements/Skeleton/PriceSkeleton'
import { useRouter } from 'next/router'
+import { createSlug } from '@/core/utils/slug'
const ProductDesktop = ({ product, wishlist, toggleWishlist }) => {
const router = useRouter()
@@ -38,7 +39,8 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => {
if (!validQuantity(quantity)) return
updateItemCart({
productId: variantId,
- quantity
+ quantity,
+ selected: true
})
toast.success('Berhasil menambahkan ke keranjang')
}
@@ -92,7 +94,15 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => {
<div className='w-1/4 text-gray_r-12/70'>Manufacture</div>
<div className='w-3/4'>
{product.manufacture?.name ? (
- <Link href='/'>{product.manufacture?.name}</Link>
+ <Link
+ href={createSlug(
+ '/shop/brands/',
+ product.manufacture?.name,
+ product.manufacture?.id
+ )}
+ >
+ {product.manufacture?.name}
+ </Link>
) : (
<div>-</div>
)}
@@ -181,7 +191,7 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => {
{product.variants.map((variant) => (
<tr key={variant.id}>
<td>{variant.code}</td>
- <td>{variant.attributes.join(', ')}</td>
+ <td>{variant.attributes.join(', ') || '-'}</td>
<td>
<VariantPrice id={variant.id} />
</td>
diff --git a/src/lib/product/components/Product/ProductMobile.jsx b/src/lib/product/components/Product/ProductMobile.jsx
index 0df22026..e560639c 100644
--- a/src/lib/product/components/Product/ProductMobile.jsx
+++ b/src/lib/product/components/Product/ProductMobile.jsx
@@ -14,6 +14,7 @@ import { toast } from 'react-hot-toast'
import useVariantPrice from '@/lib/variant/hooks/useVariantPrice'
import PriceSkeleton from '@/core/components/elements/Skeleton/PriceSkeleton'
import useProductPrice from '../../hooks/useProductPrice'
+import { createSlug } from '@/core/utils/slug'
const ProductMobile = ({ product, wishlist, toggleWishlist }) => {
const router = useRouter()
@@ -79,7 +80,8 @@ const ProductMobile = ({ product, wishlist, toggleWishlist }) => {
if (!validAction()) return
updateItemCart({
productId: activeVariant.id,
- quantity
+ quantity,
+ selected: true
})
toast.success('Berhasil menambahkan ke keranjang')
}
@@ -106,7 +108,11 @@ const ProductMobile = ({ product, wishlist, toggleWishlist }) => {
<div className='p-4'>
<div className='flex items-end mb-2'>
{product.manufacture?.name ? (
- <Link href='/'>{product.manufacture?.name}</Link>
+ <Link
+ href={createSlug('/shop/brands/', product.manufacture?.name, product.manufacture?.id)}
+ >
+ {product.manufacture?.name}
+ </Link>
) : (
<div>-</div>
)}
diff --git a/src/lib/video/api/videoApi.js b/src/lib/video/api/videoApi.js
new file mode 100644
index 00000000..d1031dab
--- /dev/null
+++ b/src/lib/video/api/videoApi.js
@@ -0,0 +1,8 @@
+import odooApi from '@/core/api/odooApi'
+
+const videoApi = async ({ limit, offset }) => {
+ const dataVideos = await odooApi('GET', `/api/v1/video_content?limit=${limit}&offset=${offset}`)
+ return dataVideos
+}
+
+export default videoApi
diff --git a/src/lib/video/hooks/useVideo.js b/src/lib/video/hooks/useVideo.js
new file mode 100644
index 00000000..6086f9aa
--- /dev/null
+++ b/src/lib/video/hooks/useVideo.js
@@ -0,0 +1,13 @@
+import { useQuery } from 'react-query'
+import videoApi from '../api/videoApi'
+
+const useVideo = ({ limit, offset }) => {
+ const fetchVideo = async () => await videoApi({ limit, offset })
+ const video = useQuery(`video-${limit}-${offset}`, fetchVideo, {
+ refetchOnWindowFocus: false
+ })
+
+ return { video }
+}
+
+export default useVideo
diff --git a/src/pages/index.jsx b/src/pages/index.jsx
index c6737037..99f94ee1 100644
--- a/src/pages/index.jsx
+++ b/src/pages/index.jsx
@@ -1,10 +1,10 @@
import dynamic from 'next/dynamic'
-import Seo from '@/core/components/Seo'
import ImageSkeleton from '@/core/components/elements/Skeleton/ImageSkeleton'
import PopularProductSkeleton from '@/lib/home/components/Skeleton/PopularProductSkeleton'
import MobileView from '@/core/components/views/MobileView'
import DesktopView from '@/core/components/views/DesktopView'
import { useRef } from 'react'
+import { NextSeo } from 'next-seo'
const BasicLayout = dynamic(() => import('@/core/components/layouts/BasicLayout'))
@@ -35,19 +35,23 @@ export default function Home() {
return (
<BasicLayout>
- <Seo title='Beranda - Indoteknik' />
+ <NextSeo
+ title='Indoteknik.com: B2B Industrial Supply & Solution'
+ description='Temukan pilihan produk B2B Industri &amp; Alat Teknik untuk Perusahaan, UMKM &amp; Pemerintah dengan lengkap, mudah dan transparan.'
+ canonical={process.env.NEXT_PUBLIC_SELF_HOST}
+ additionalMetaTags={[
+ {
+ property: 'keywords',
+ content:
+ 'indoteknik, indoteknik.com, toko teknik, toko perkakas, jual genset, jual fogging, jual krisbow, harga krisbow, harga alat safety, harga pompa air'
+ }
+ ]}
+ />
<DesktopView>
<div className='container mx-auto'>
- <div
- className='flex h-[360px]'
- ref={wrapperRef}
- onLoad={handleOnLoad}
- >
+ <div className='flex h-[360px]' ref={wrapperRef} onLoad={handleOnLoad}>
<div className='w-3/12'></div>
- <div
- className='w-6/12 px-1'
- ref={bannerRef}
- >
+ <div className='w-6/12 px-1' ref={bannerRef}>
<HeroBanner />
</div>
<div className='w-3/12'>
diff --git a/src/pages/video.jsx b/src/pages/video.jsx
new file mode 100644
index 00000000..c7248da1
--- /dev/null
+++ b/src/pages/video.jsx
@@ -0,0 +1,55 @@
+import Pagination from '@/core/components/elements/Pagination/Pagination'
+import BasicLayout from '@/core/components/layouts/BasicLayout'
+import useVideo from '@/lib/video/hooks/useVideo'
+import { useRouter } from 'next/router'
+
+export default function Video() {
+ const router = useRouter()
+ const limit = 16
+
+ const { page = 1 } = router.query
+ const { video } = useVideo({ limit, offset: limit * (page - 1) })
+
+ const pageCount = Math.ceil(video?.data?.videoTotal / limit)
+
+ return (
+ <BasicLayout>
+ <div className='container mx-auto p-4 md:p-0 my-0 md:my-10'>
+ <h1 className='text-h-sm md:text-title-sm font-semibold mb-6'>Kanal Video Indoteknik</h1>
+ <div className='grid grid-cols-1 md:grid-cols-4 gap-6'>
+ {video.data?.videos?.map((video) => (
+ <div className='shadow bg-white rounded' key={video.id}>
+ <iframe
+ src={`https://www.youtube.com/embed/${video.url.match(/v=([^&]*)/)[1]}`}
+ title='YouTube video player'
+ allow='accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share'
+ allowFullScreen={true}
+ width='100%'
+ height={200}
+ className='rounded'
+ />
+ <div className='p-3'>
+ <a
+ href='https://www.youtube.com/@indoteknikb2bindustriale-c778'
+ className='text-red_r-11 mb-2 block'
+ >
+ {video.channelName}
+ </a>
+ <a href={video.url} className='font-medium leading-6'>
+ {video.name}
+ </a>
+ </div>
+ </div>
+ ))}
+ </div>
+
+ <Pagination
+ currentPage={parseInt(page)}
+ pageCount={pageCount}
+ url={`/video`}
+ className='mt-10'
+ />
+ </div>
+ </BasicLayout>
+ )
+}