From e858abf335e2deb63f346824b8dc5f5ac69ca861 Mon Sep 17 00:00:00 2001
From: Matthew O'Riordan <matthew.oriordan@gmail.com>
Date: Mon, 12 Jan 2026 07:01:58 +0100
Subject: [PATCH] chore: remove legacy CookieMessage component

The CookieMessage component was used for the classic cookie consent
banner on the Ably website. The website now exclusively uses OneTrust
for cookie consent management, making this component unused.

Companion change: ably/website#chore/remove-classic-cookie-consent
---
 .storybook/styles.css                         |  1 -
 src/core/CookieMessage.tsx                    | 57 -------------------
 .../CookieMessage/CookieMessage.stories.tsx   | 12 ----
 src/core/CookieMessage/component.css          | 15 -----
 4 files changed, 85 deletions(-)
 delete mode 100644 src/core/CookieMessage.tsx
 delete mode 100644 src/core/CookieMessage/CookieMessage.stories.tsx
 delete mode 100644 src/core/CookieMessage/component.css

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<HTMLDivElement>(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 (
-    <div className="ui-cookie-message" ref={ref}>
-      <p className="ui-text-p2 pr-8">
-        <a href={absUrl("/privacy")} className="underline">
-          How we use cookies
-        </a>{" "}
-        to improve your experience.
-      </p>
-      <button
-        className="ui-btn-secondary mt-3 sm:mt-0 whitespace-nowrap"
-        onClick={handleClose}
-      >
-        Accept and close
-      </button>
-    </div>
-  );
-};
-
-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;
-  }
-}