diff options
Diffstat (limited to 'src-migrate/common/components/elements')
| -rw-r--r-- | src-migrate/common/components/elements/Modal.tsx | 90 | ||||
| -rw-r--r-- | src-migrate/common/components/elements/ReCaptcha.tsx | 17 | ||||
| -rw-r--r-- | src-migrate/common/components/elements/Seo.tsx | 34 |
3 files changed, 0 insertions, 141 deletions
diff --git a/src-migrate/common/components/elements/Modal.tsx b/src-migrate/common/components/elements/Modal.tsx deleted file mode 100644 index c9c621e0..00000000 --- a/src-migrate/common/components/elements/Modal.tsx +++ /dev/null @@ -1,90 +0,0 @@ -import { XMarkIcon } from "@heroicons/react/24/outline"; -import { AnimatePresence, motion } from "framer-motion" -import { useRouter } from "next/router"; -import { useEffect, useState } from "react"; -import ReactDOM from "react-dom"; -import { useWindowSize } from "usehooks-ts"; -import clsxm from "~/common/libs/clsxm"; - - -type Props = { - children: React.ReactNode - active: boolean - title?: string - close?: () => void, - className?: string, - mode?: "mobile" | "desktop" -} - -const Modal = ({ - children, - active = false, - title, - close, - className, - mode -}: Props) => { - const router = useRouter() - const { width } = useWindowSize() - const [rendered, setRendered] = useState<boolean>(false) - - mode = mode || width >= 768 ? "desktop" : "mobile" - - useEffect(() => { - setRendered(true) - }, []) - - const modalClassNames = clsxm( - "fixed bg-white max-h-[80vh] overflow-auto p-4 pt-0 z-[60] border-gray_r-6", - { - "left-1/2 -translate-x-1/2 translate-y-1/2 bottom-1/2 w-11/12 md:w-[500px] border rounded-xl": mode === 'desktop', - "left-0 w-full border-t bottom-0 rounded-t-xl": mode === 'mobile' - }, - className - ) - - const variant = { - initial: { bottom: mode === 'desktop' ? '45%' : '-100%', opacity: 0 }, - animate: { bottom: mode === 'desktop' ? '50%' : 0, opacity: 1 }, - exit: { bottom: mode === 'desktop' ? '55%' : '-100%', opacity: 0 }, - transition: { ease: 'linear', duration: 0.25 } - } - - return rendered && ReactDOM.createPortal( - <AnimatePresence key={router.asPath}> - {active && ( - <motion.div - className="overlay" - initial={{ opacity: 0 }} - animate={{ opacity: 1 }} - exit={{ opacity: 0 }} - onClick={close} - /> - )} - - {active && ( - <motion.div - {...variant} - className={modalClassNames} - > - <div className='flex justify-between py-5 sticky top-0 '> - <div className='font-semibold text-h-sm md:text-title-sm'> - {title} - </div> - {close && ( - <button className="rounded-full h-10 w-10 flex justify-center items-center bg-white" type='button' onClick={close}> - <XMarkIcon className='w-5 h-5 ' /> - </button> - )} - </div> - - {children} - </motion.div> - )} - - </AnimatePresence>, - document.querySelector('body')! - ) -} - -export default Modal
\ No newline at end of file diff --git a/src-migrate/common/components/elements/ReCaptcha.tsx b/src-migrate/common/components/elements/ReCaptcha.tsx deleted file mode 100644 index 1bc31d90..00000000 --- a/src-migrate/common/components/elements/ReCaptcha.tsx +++ /dev/null @@ -1,17 +0,0 @@ -import ReCAPTCHA, { ReCAPTCHAProps } from "react-google-recaptcha" - -const GOOGLE_RECAPTCHA_KEY = process.env.NEXT_PUBLIC_RECAPTCHA_GOOGLE || '' - -type Props = Omit<ReCAPTCHAProps, 'sitekey'> & { - sitekey?: string; -} - -const ReCaptcha = (props: Props) => { - const { sitekey, ...rest } = props - - return ( - <ReCAPTCHA sitekey={sitekey || GOOGLE_RECAPTCHA_KEY} {...rest} /> - ) -} - -export default ReCaptcha
\ No newline at end of file diff --git a/src-migrate/common/components/elements/Seo.tsx b/src-migrate/common/components/elements/Seo.tsx deleted file mode 100644 index 2245663a..00000000 --- a/src-migrate/common/components/elements/Seo.tsx +++ /dev/null @@ -1,34 +0,0 @@ -import { useRouter } from 'next/router' -import React from 'react' -import { NextSeo } from "next-seo" -import { MetaTag, NextSeoProps } from 'next-seo/lib/types'; - -const Seo = (props: NextSeoProps) => { - const router = useRouter() - - const additionalMetaTags: MetaTag[] = [ - { - property: 'fb:app_id', - content: '270830718811' - }, - { - property: 'fb:page_id', - content: '101759953569' - }, - ] - - if (!!props.additionalMetaTags) additionalMetaTags.push(...props.additionalMetaTags) - - return ( - <NextSeo - defaultTitle='Indoteknik.com: B2B Industrial Supply & Solution' - canonical={process.env.NEXT_PUBLIC_SELF_HOST + router.asPath} - description={props.title} - {...props} - openGraph={{ siteName: 'Indoteknik.com', ...props.openGraph }} - additionalMetaTags={additionalMetaTags} - /> - ) -} - -export default Seo
\ No newline at end of file |
