From f99e0aba70efad0deb907d8e27f09fc9f527c8a4 Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Fri, 17 Feb 2023 17:07:50 +0700 Subject: Refactor --- src/components/layouts/AppBar.js | 47 -------- src/components/layouts/Footer.js | 91 -------------- src/components/layouts/Header.js | 253 --------------------------------------- src/components/layouts/Layout.js | 20 ---- 4 files changed, 411 deletions(-) delete mode 100644 src/components/layouts/AppBar.js delete mode 100644 src/components/layouts/Footer.js delete mode 100644 src/components/layouts/Header.js delete mode 100644 src/components/layouts/Layout.js (limited to 'src/components/layouts') diff --git a/src/components/layouts/AppBar.js b/src/components/layouts/AppBar.js deleted file mode 100644 index fe74c940..00000000 --- a/src/components/layouts/AppBar.js +++ /dev/null @@ -1,47 +0,0 @@ -import { Bars3Icon, ChevronLeftIcon, HomeIcon, ShoppingCartIcon } from "@heroicons/react/24/outline"; -import Head from "next/head"; -import { useRouter } from "next/router"; -import Link from "../elements/Link"; - -const AppBar = ({ title }) => { - const router = useRouter(); - - const handleBackButtonClick = (event) => { - event.currentTarget.disabled = true; - router.back(); - } - - return ( - <> - - { title } - Indoteknik - -
- {/* --- Start Title */} -
- -

{ title }

-
- {/* --- End Title */} - - {/* --- Start Icons */} -
- - - - - - - - - -
- {/* --- End Icons */} -
- - ); -}; - -export default AppBar; \ No newline at end of file diff --git a/src/components/layouts/Footer.js b/src/components/layouts/Footer.js deleted file mode 100644 index d173a525..00000000 --- a/src/components/layouts/Footer.js +++ /dev/null @@ -1,91 +0,0 @@ -import { - PhoneIcon, - DevicePhoneMobileIcon, - EnvelopeIcon -} from "@heroicons/react/24/outline"; -import Image from "next/image"; -import InstagramIcon from "@/icons/instagram.svg"; -import LinkedinIcon from "@/icons/linkedin.svg"; -import Link from "../elements/Link"; - -export default function Footer() { - return ( -
-
-
-

Kantor Pusat

-

- Jl. Bandengan Utara 85A No. 8-9 RT.3/RW.16, Penjaringan, Kec. Penjaringan -

- -

Layanan Informasi

-
- - - (021) 2933-8828 - - {'/'} - - 29 - -
-
- - - 0812-8080-622 - -
-
- - - sales@indoteknik.com - -
- -

Panduan Pelanggan

-
- FAQ - Kebijakan Privasi - Pengajuan Tempo - Garansi Produk - Online Quotation - Pengiriman - Pembayaran - Syarat & Ketentuan - -
-
-
-

Jam Operasional

-

- Senin - Jumat: 08:30 - 17:00 -

-

- Sabtu: 08:30 - 14:00 -

- -

Temukan Kami

-
- - -
- -

Pembayaran

-
- BCA Payment - BCA Payment - BCA Payment - BCA Payment - BCA Payment - BCA Payment - BCA Payment - BCA Payment -
- - {/*

Pengiriman

*/} -
-
-
PT. Indoteknik Dotcom Gemilang
-
- ); -} \ No newline at end of file diff --git a/src/components/layouts/Header.js b/src/components/layouts/Header.js deleted file mode 100644 index 23fda642..00000000 --- a/src/components/layouts/Header.js +++ /dev/null @@ -1,253 +0,0 @@ -import Image from "next/image"; -import { Fragment, useCallback, useEffect, useRef, useState } from "react"; -import Head from "next/head"; -import { useRouter } from "next/router"; -import axios from "axios"; -import { - MagnifyingGlassIcon, - Bars3Icon, - ShoppingCartIcon, - ChevronRightIcon, - Cog6ToothIcon, - HeartIcon, - ChevronDownIcon, - ChevronUpIcon -} from "@heroicons/react/24/outline"; - -// Helpers -import { useAuth } from "@/core/utils/auth"; -// Components -import Link from "../elements/Link"; -// Images -import Logo from "@/images/logo.png"; -import greeting from "@/core/utils/greeting"; -import apiOdoo from "@/core/utils/apiOdoo"; - -const menus = [ - { name: 'Semua Brand', href: '/shop/brands' }, - { name: 'Blog Indoteknik', href: '/' }, - { name: 'Tentang Indoteknik', href: '/' }, - { name: 'Pusat Bantuan', href: '/' }, -]; - -export default function Header({ title }) { - const router = useRouter(); - const { q = '' } = router.query; - const [searchQuery, setSearchQuery] = useState(q != '*' ? q : ''); - const [suggestions, setSuggestions] = useState([]); - const searchQueryRef = useRef(); - const [isMenuActive, setIsMenuActive] = useState(false); - const [auth] = useAuth(); - - useEffect(() => { - if (q) { - searchQueryRef.current.blur(); - setSuggestions([]); - }; - }, [q]); - - const clickSuggestion = (value) => { - router.push(`/shop/search?q=${value}`, undefined, { scroll: false }); - }; - - const getSuggestion = useCallback(async () => { - if (searchQuery.trim().length > 0) { - let result = await axios(`${process.env.SELF_HOST}/api/shop/suggest?q=${searchQuery.trim()}`); - setSuggestions(result.data.suggest.mySuggester[searchQuery.trim()].suggestions); - } else { - setSuggestions([]); - } - }, [searchQuery]); - - useEffect(() => { - if (document.activeElement == searchQueryRef.current) getSuggestion(); - }, [getSuggestion]); - - const openMenu = () => setIsMenuActive(true); - const closeMenu = () => setIsMenuActive(false); - - const searchSubmit = (e) => { - e.preventDefault(); - if (searchQuery.length > 0) { - router.push(`/shop/search?q=${searchQuery}`, undefined, { scroll: false }); - } else { - searchQueryRef.current.focus(); - } - } - - const [ isOpenCategory, setOpenCategory ] = useState(false); - const [ categories, setCategories ] = useState([]); - - useEffect(() => { - const loadCategories = async () => { - if (isOpenCategory && categories.length == 0) { - let dataCategories = await apiOdoo('GET', '/api/v1/category/tree'); - dataCategories = dataCategories.map((category) => { - category.childs = category.childs.map((child1Category) => { - return { - ...child1Category, - isOpen: false - } - }) - return { - ...category, - isOpen: false - } - }); - setCategories(dataCategories); - } - } - loadCategories(); - }, [ isOpenCategory, categories ]); - - const toggleCategories = (id = 0) => { - let newCategories = categories.map((category) => { - category.childs = category.childs.map((child1Category) => { - return { - ...child1Category, - isOpen: id == child1Category.id ? !child1Category.isOpen : child1Category.isOpen - } - }) - return { - ...category, - isOpen: id == category.id ? !category.isOpen : category.isOpen - } - }); - setCategories(newCategories); - } - - return ( - <> - - - {title} - - -
-
- { auth && ( - -
-

{ greeting() },

-

{auth.name}

-
-
- -
- - ) } - - { !auth && ( - <> - Masuk - Daftar - - ) } -
-
- { menus.map((menu, index) => ( - - { menu.name } -
- -
- - )) } -
setOpenCategory(!isOpenCategory)}> - Kategori -
- { !isOpenCategory && } - { isOpenCategory && } -
-
- { isOpenCategory && categories.map((category) => ( - -
- - { category.name } - -
toggleCategories(category.id)}> - { !category.isOpen && } - { category.isOpen && } -
-
- { category.isOpen && category.childs.map((child1Category) => ( - -
- - { child1Category.name } - - { child1Category.childs.length > 0 && ( -
toggleCategories(child1Category.id)}> - { !child1Category.isOpen && } - { child1Category.isOpen && } -
- ) } -
- { child1Category.isOpen && child1Category.childs.map((child2Category) => ( - - { child2Category.name } - - )) } -
- )) } -
- )) } -
-
- - -
-
- - Logo Indoteknik - -
- - - - - - - -
-
-
- setSearchQuery(e.target.value)} - onFocus={getSuggestion} - value={searchQuery} - className="form-input rounded-r-none border-r-0 focus:border-gray_r-7" - placeholder="Ketikan nama, merek, part number" - autoComplete="off" - /> - - - - {suggestions.length > 1 && ( -
- {suggestions.map((suggestion, index) => ( -

clickSuggestion(suggestion.term)} className="w-full p-2" key={index}>{suggestion.term}

- ))} -
- )} -
-
- - {suggestions.length > 1 && ( -
setSuggestions([])}>
- )} - - ) -} \ No newline at end of file diff --git a/src/components/layouts/Layout.js b/src/components/layouts/Layout.js deleted file mode 100644 index fd507963..00000000 --- a/src/components/layouts/Layout.js +++ /dev/null @@ -1,20 +0,0 @@ -import { motion } from 'framer-motion'; - -export default function Layout({ children, ...pageProps }) { - const transition = { - ease: 'easeOut', - duration: 0.3 - }; - - return children && ( - - {children} - - ); -} \ No newline at end of file -- cgit v1.2.3