feat: ccpa

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>