From 0674112df6c85b9a33428f6a88e43927b7c063df Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tr=C3=A8sAbhi?= <43380238+tresabhi@users.noreply.github.com>
Date: Thu, 10 Oct 2024 15:39:50 -0500
Subject: [PATCH] fix: better ccpa

---
 packages/website/src/components/Footer.astro  |  2 +-
 .../_index.tsx                                | 20 +++++++++-----
 .../website/src/pages/legal/ccpa/index.astro  | 26 +++++++++++++++++++
 .../index.astro                               | 22 ----------------
 4 files changed, 41 insertions(+), 29 deletions(-)
 rename packages/website/src/pages/legal/{do-not-sell-my-personal-information => ccpa}/_index.tsx (54%)
 create mode 100644 packages/website/src/pages/legal/ccpa/index.astro
 delete mode 100644 packages/website/src/pages/legal/do-not-sell-my-personal-information/index.astro

diff --git a/packages/website/src/components/Footer.astro b/packages/website/src/components/Footer.astro
index de5f09988..18465fb7c 100644
--- a/packages/website/src/components/Footer.astro
+++ b/packages/website/src/components/Footer.astro
@@ -116,7 +116,7 @@ const gameDefinitions = await fetchGameDefinitions();
           >
             Ad settings
           </Link>
-          <Link href="/legal/do-not-sell-my-personal-information" color="gray">
+          <Link href="/legal/ccpa" color="gray">
             Do not sell my personal information
           </Link>
         </Flex>
diff --git a/packages/website/src/pages/legal/do-not-sell-my-personal-information/_index.tsx b/packages/website/src/pages/legal/ccpa/_index.tsx
similarity index 54%
rename from packages/website/src/pages/legal/do-not-sell-my-personal-information/_index.tsx
rename to packages/website/src/pages/legal/ccpa/_index.tsx
index bdef2df68..5a6f0fe77 100644
--- a/packages/website/src/pages/legal/do-not-sell-my-personal-information/_index.tsx
+++ b/packages/website/src/pages/legal/ccpa/_index.tsx
@@ -1,9 +1,9 @@
-import { Flex, Switch, Text } from '@radix-ui/themes';
+import { RadioGroup } from '@radix-ui/themes';
 import Cookies from 'js-cookie';
 import { useEffect, useState } from 'react';
 import { App } from '../../../stores/app';
 
-export function Toggles() {
+export function Options() {
   return (
     <App.Provider>
       <Content />
@@ -27,9 +27,17 @@ function Content() {
   }, [doNotSell]);
 
   return (
-    <Flex gap="2" align="center">
-      <Text>Do not sell my personal information</Text>
-      <Switch checked={doNotSell} onCheckedChange={setDoNotSell} />
-    </Flex>
+    <RadioGroup.Root
+      value={`${doNotSell}`}
+      onValueChange={(value) => setDoNotSell(value === 'true')}
+    >
+      <RadioGroup.Item value="false">
+        My personal information may be used for the purposes defined in the
+        privacy policy.
+      </RadioGroup.Item>
+      <RadioGroup.Item value="true">
+        Do not sell my personal information.
+      </RadioGroup.Item>
+    </RadioGroup.Root>
   );
 }
diff --git a/packages/website/src/pages/legal/ccpa/index.astro b/packages/website/src/pages/legal/ccpa/index.astro
new file mode 100644
index 000000000..55c5db2e1
--- /dev/null
+++ b/packages/website/src/pages/legal/ccpa/index.astro
@@ -0,0 +1,26 @@
+---
+import { Flex, Heading, Link, Text } from '@radix-ui/themes';
+import { PageWrapper } from '../../../components/PageWrapper';
+import RootLayout from '../../../layouts/RootLayout.astro';
+import { Options } from './_index';
+---
+
+<title>California Consumer Privacy Act (CCPA)</title>
+
+<RootLayout>
+  <PageWrapper justify="center">
+    <Flex direction="column">
+      <Heading>California Consumer Privacy Act (CCPA)</Heading>
+      <Text color="gray" mb="4">Do not sell my personal information</Text>
+      <Text>
+        If you are a resident of California, you have the right under the CCPA
+        to opt out of the sale of personal information to third parties. Use the
+        options below to exercise this right, and please review our <Link
+          href="/docs/legal/privacy-policy">privacy policy</Link
+        > for complete information on how your data is used and stored.
+      </Text>
+    </Flex>
+
+    <Options client:load />
+  </PageWrapper>
+</RootLayout>
diff --git a/packages/website/src/pages/legal/do-not-sell-my-personal-information/index.astro b/packages/website/src/pages/legal/do-not-sell-my-personal-information/index.astro
deleted file mode 100644
index 8046d8185..000000000
--- a/packages/website/src/pages/legal/do-not-sell-my-personal-information/index.astro
+++ /dev/null
@@ -1,22 +0,0 @@
----
-import { Flex, Heading, Text } from '@radix-ui/themes';
-import { PageWrapper } from '../../../components/PageWrapper';
-import RootLayout from '../../../layouts/RootLayout.astro';
-import { Toggles } from './_index';
----
-
-<RootLayout>
-  <PageWrapper justify="center">
-    <Flex direction="column" gap="1">
-      <Heading>Do not sell my personal information</Heading>
-      <Text>
-        BlitzKit does not sell any of your personal information. However,
-        third-party party services may use your personal information to enhance
-        your experience and to collect analytics. You can stop the sale of your
-        personal data using the option below.
-      </Text>
-    </Flex>
-
-    <Toggles client:load />
-  </PageWrapper>
-</RootLayout>