feat: ccpa

.vscode/settings.json

@@ -31,6 +31,7 @@
     "cacheable",
     "Callouts",
     "Camo",
+    "CCPAOPTOUT",
     "CDON",
     "classname",
     "cleandist",

docs/legal/privacy-policy.md

@@ -8,6 +8,23 @@ We use Your Personal data to provide and improve the Service. By using the Servi
 
 ## Interpretation and Definitions
 
+### California Consumer Privacy Act (CCPA)
+
+If you are a California resident, you have specific rights regarding your personal information under the California Consumer Privacy Act (CCPA). This section describes your CCPA rights and explains how to exercise those rights.
+
+#### Rights under CCPA
+
+Under CCPA, California residents have the following rights:
+
+1. Right to Know: You have the right to request that we disclose certain information to you about our collection and use of your personal information over the past 12 months.
+2. Right to Delete: You have the right to request that we delete any of your personal information that we collected from you and retained, subject to certain exceptions.
+3. Right to Opt-Out of Sale: You have the right to opt-out of the sale of your personal information. Note that we do not sell personal information as defined by the CCPA.
+4. Right to Non-Discrimination: You have the right not to be discriminated against for exercising any of your CCPA rights.
+
+#### Exercising Your CCPA Rights
+
+To exercise your rights under CCPA and to opt-out of the sale of your personal information, you can click on the "Do not sell my personal information" link in the footer of any page on our website.
+
 ### Interpretation
 
 The words of which the initial letter is capitalized have meanings defined under the following conditions. The following definitions shall have the same meaning regardless of whether they appear in singular or in plural.

packages/website/package.json

@@ -22,6 +22,7 @@
     "@vanilla-extract/dynamic": "^2.1.2",
     "compare-versions": "^6.1.1",
     "immer": "^10.1.1",
+    "js-cookie": "^3.0.5",
     "markdown-to-jsx": "^7.5.0",
     "nanostores": "^0.11.3",
     "react": "^18.3.1",
@@ -34,6 +35,7 @@
     "@astrojs/check": "^0.9.3",
     "@astrojs/react": "^3.6.2",
     "@astrojs/vercel": "^7.8.1",
+    "@types/js-cookie": "^3.0.6",
     "@types/react": "^18.3.5",
     "@types/react-dom": "^18",
     "@types/three": "^0.160.0",

packages/website/src/components/Footer.astro

@@ -116,6 +116,9 @@ const gameDefinitions = await fetchGameDefinitions();
           >
             Ad settings
           </Link>
+          <Link href="/legal/do-not-sell-my-personal-information" color="gray">
+            Do not sell my personal information
+          </Link>
         </Flex>
       </Flex>
     </Flex>

packages/website/src/pages/auth/[provider]/_index.tsx

@@ -23,7 +23,15 @@ interface AuthorizeProps {
   provider: AuthProvider;
 }
 
-export function Authorize({ provider }: AuthorizeProps) {
+export function Authorize(props: AuthorizeProps) {
+  return (
+    <App.Provider>
+      <Content {...props} />
+    </App.Provider>
+  );
+}
+
+function Content({ provider }: AuthorizeProps) {
   const mutateApp = App.useMutation();
 
   useEffect(() => {

packages/website/src/pages/legal/do-not-sell-my-personal-information/_index.tsx

@@ -0,0 +1,35 @@
+import { Flex, Switch, Text } from '@radix-ui/themes';
+import Cookies from 'js-cookie';
+import { useEffect, useState } from 'react';
+import { App } from '../../../stores/app';
+
+export function Toggles() {
+  return (
+    <App.Provider>
+      <Content />
+    </App.Provider>
+  );
+}
+
+function Content() {
+  const [doNotSell, setDoNotSell] = useState(false);
+
+  useEffect(() => {
+    setDoNotSell(Cookies.get('CCPAOPTOUT') !== undefined);
+  }, []);
+
+  useEffect(() => {
+    if (doNotSell) {
+      Cookies.set('CCPAOPTOUT', 'true', { sameSite: 'Lax', expires: Infinity });
+    } else {
+      Cookies.remove('CCPAOPTOUT');
+    }
+  }, [doNotSell]);
+
+  return (
+    <Flex gap="2" align="center">
+      <Text>Do not sell my personal information</Text>
+      <Switch checked={doNotSell} onCheckedChange={setDoNotSell} />
+    </Flex>
+  );
+}

packages/website/src/pages/legal/do-not-sell-my-personal-information/index.astro

@@ -0,0 +1,22 @@
+---
+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>