diff --git a/.storybook/styles.css b/.storybook/styles.css index 858b01324..5d6c5bff0 100644 --- a/.storybook/styles.css +++ b/.storybook/styles.css @@ -6,7 +6,6 @@ @import "../src/core/fonts/manrope.css"; @import "../src/core/styles.css"; @import "../src/core/Code/component.css"; -@import "../src/core/CookieMessage/component.css"; @import "../src/core/Flash/component.css"; @import "../src/core/Notice/component.css"; @import "../src/core/Slider/component.css"; diff --git a/src/core/CookieMessage.tsx b/src/core/CookieMessage.tsx deleted file mode 100644 index 4985367c4..000000000 --- a/src/core/CookieMessage.tsx +++ /dev/null @@ -1,57 +0,0 @@ -import React, { useRef, useEffect, useState } from "react"; -import Cookie from "js-cookie"; - -import _absUrl from "./url-base"; - -const COOKIE_EXPIRY = 365; - -type CookieMessageProps = { - cookieId: string; - urlBase: string; -}; - -const CookieMessage = ({ cookieId, urlBase }: CookieMessageProps) => { - const ref = useRef(null); - const [hideCookieMessage, setHideCookieMessage] = useState(() => - Cookie.get(cookieId) ? true : false, - ); - - useEffect(() => { - const isCookieSet = Cookie.get(cookieId) ? true : false; - if (hideCookieMessage !== isCookieSet) { - setHideCookieMessage(isCookieSet); - } - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [cookieId]); - - const handleClose = () => { - Cookie.set(cookieId, "1", { expires: COOKIE_EXPIRY }); - - ref.current?.classList.add("bottom-px", "opacity-0"); - setTimeout(() => setHideCookieMessage(true), 500); - }; - - const absUrl = (path: string) => _absUrl(path, urlBase); - - // Presume the message is hidden by default - if (hideCookieMessage) return null; - - return ( -
-

- - How we use cookies - {" "} - to improve your experience. -

- -
- ); -}; - -export default CookieMessage; diff --git a/src/core/CookieMessage/CookieMessage.stories.tsx b/src/core/CookieMessage/CookieMessage.stories.tsx deleted file mode 100644 index fd64859a2..000000000 --- a/src/core/CookieMessage/CookieMessage.stories.tsx +++ /dev/null @@ -1,12 +0,0 @@ -import CookieMessage from "../CookieMessage"; - -export default { - title: "Components/Cookie Message", - component: CookieMessage, - args: { - cookieId: "cookie-namespace", - noticeId: "cookie-message", - }, -}; - -export const Default = {}; diff --git a/src/core/CookieMessage/component.css b/src/core/CookieMessage/component.css deleted file mode 100644 index e6c9d43a7..000000000 --- a/src/core/CookieMessage/component.css +++ /dev/null @@ -1,15 +0,0 @@ -@layer components { - .ui-cookie-message { - @apply rounded-lg bg-white font-sans; - @apply justify-between items-center; - @apply opacity-100 z-50 bottom-0 fixed sm:flex; - @apply p-4 mb-4 ml-4; - max-width: 70vw; - box-shadow: 0px 24px 32px 0px #0000000d; - border: 1px solid var(--color-mid-grey); - border-left: 0.5rem solid var(--color-electric-cyan); - transition: - bottom 250ms ease-out, - opacity 150ms ease-out; - } -}