add cookie fixed banner

components/core/Layout/Layout.tsx

@@ -1,9 +1,10 @@
-import { FC } from 'react'
+import { FC, useState } from 'react'
 import cn from 'classnames'
 import type { Page } from '@lib/bigcommerce/api/operations/get-all-pages'
 import { CommerceProvider } from '@lib/bigcommerce'
 import { Navbar, Featurebar, Footer } from '@components/core'
 import { Container, Sidebar } from '@components/ui'
+import Button from '@components/ui/Button'
 import { CartSidebarView } from '@components/cart'
 import { useUI } from '@components/ui/context'
 import s from './Layout.module.css'
@@ -16,14 +17,11 @@ interface Props {
 
 const Layout: FC<Props> = ({ children, pageProps }) => {
   const { displaySidebar, closeSidebar } = useUI()
+  const [acceptedCookies, setAcceptedCookies] = useState(false)
 
   return (
     <CommerceProvider locale="en-us">
       <div className={cn(s.root)}>
-        <Featurebar
-          title="Free Standard Shipping on orders over $99.99"
-          description="Due to COVID-19, some orders may experience processing and delivery delays."
-        />
         <Container>
           <Navbar />
         </Container>
@@ -32,6 +30,16 @@ const Layout: FC<Props> = ({ children, pageProps }) => {
         <Sidebar show={displaySidebar} close={closeSidebar}>
           <CartSidebarView />
         </Sidebar>
+        <Featurebar
+          title="This site uses cookies to improve your experience."
+          description="By clicking, you agree to our Privacy Policy."
+          action={
+            <Button className="mx-5" onClick={() => setAcceptedCookies(true)}>
+              Accept cookies
+            </Button>
+          }
+          className={cn({ 'translate-y-full': acceptedCookies })}
+        />
       </div>
     </CommerceProvider>
   )