update

.gitignore

@@ -1,5 +1,6 @@
 # build output
 dist/
+.vercel/
 
 # generated types
 .astro/
@@ -15,6 +16,7 @@ pnpm-debug.log*
 
 # environment variables
 .env
+.env.production
 
 # macOS-specific files
 .DS_Store

README.md

@@ -0,0 +1,63 @@
+## Setting Up Supabase
+### Selfhosting
+This section is optional on wheather or not you want to either use Supabase Cloud or selfhost.
+
+Run:
+```bash
+# Get the code using git sparse checkout
+git clone --filter=blob:none --no-checkout https://github.com/supabase/supabase
+cd supabase
+git sparse-checkout set --cone docker && git checkout master
+
+# Go to the docker folder
+cd docker
+
+# Copy the fake env vars
+cp .env.example .env
+
+# Pull the latest images
+docker compose pull
+
+# Start the services (in detached mode)
+docker compose up -d
+```
+> Source: https://supabase.com/docs/guides/self-hosting/docker
+
+In the `.env` file that've you copied from `.env.example, you'll need to change some things to adapt it to this project.
+
+ - Change `SITE_URL` to `http://localhost:4321`
+ - Setup SMTP (Project was tested with [Resend](https://resend.com))
+
+For production use, make sure to follow all instructions needed from https://supabase.com/docs/guides/self-hosting/docker.
+
+### Allowing Account Deletion
+When an end-user wants to delete their account, they'll be directed to `/api/account/delete`. This API requires that a function already exist in your Supabase project called `delete_user()`. 
+
+In the SQL Editor, enter the following and click Run:
+```sql
+CREATE or replace function delete_user()
+	returns void
+LANGUAGE SQL SECURITY DEFINER
+AS $$
+	delete from auth.users where id = auth.uid();
+$$;
+```
+> Source: https://github.com/orgs/supabase/discussions/250#discussioncomment-5361165
+
+### Table Creation
+For this project, two tables need to exist and that is both `channels` and `subs`.
+
+For the `channels` portion, you can import the premade CSV file made for this project.
+
+For the `subs` portion, enter the following in the SQL Editor and click Run:
+```sql
+create table
+  public.usersubslist (
+    "Id" text not null,
+    "UserSubscribed" text null,
+    "Platform" text null,
+    "Subscribed" boolean not null default false
+  ) tablespace pg_default;
+```
+
+> Project was tested with RLS disabled on all tables

astro.config.mjs

@@ -1,12 +1,9 @@
-import { defineConfig } from "astro/config";
+import { defineConfig } from "astro/config"
-import node from "@astrojs/node";
+import node from "@astrojs/node"
 
 export default defineConfig({
   output: "server",
   adapter: node({
-    mode: "standalone",
+    mode: "standalone"
-  }),
+  })
-  security: {
+})
-    checkOrigin: true
-  }
-});

channels_rows.csv

@@ -0,0 +1,4 @@
+creator,followers,id
+" ColdFusion",4850000,UC4QZ_LsYcvcq7qOsOhpAX4A
+" Veritasium",15000000,UCHnyfMqiRRG1u-2MsSQLbXA
+Vsause,22000000,C6nSFpj9HTCZ5t-N3Rm3-HA

package.json

@@ -1,25 +1,14 @@
 {
-  "name": "server-side-rendering",
+  "name": "astro-supabase",
   "type": "module",
   "version": "0.0.1",
   "scripts": {
-    "dev": "astro dev",
+    "start": "astro dev"
-    "start": "astro dev",
-    "build": "astro check && astro build",
-    "preview": "astro preview",
-    "astro": "astro"
   },
   "dependencies": {
-    "@appwrite.io/pink": "^0.3.0",
+    "@astrojs/node": "^8.3.2",
-    "@appwrite.io/pink-icons": "^0.3.0",
+    "@supabase/supabase-js": "^2.44.4",
-    "@astrojs/check": "^0.4.1",
-    "@astrojs/node": "^8.1.0",
-    "appwrite": "15.0.0",
     "astro": "^4.11.5",
-    "node-appwrite": "^12.0.0",
-    "typescript": "^5.3.3"
-  },
-  "devDependencies": {
     "sass": "^1.77.8"
   }
 }

src/env.d.ts

@@ -1,18 +1,7 @@
 /// <reference types="astro/client" />
-
 declare namespace App {
-  interface Locals {
+    interface Locals {
-    user?: import("node-appwrite").Models.User <import("node-appwrite").Models.Preferences<{}>>;
+      email: string;
-    users?: import("node-appwrite").Service.UserList <import("node-appwrite").Service.getPrefs<{}>>;
+    }
   }
-}
   
-interface ImportMetaEnv {
-  readonly PUBLIC_APPWRITE_ENDPOINT: string;
-  readonly PUBLIC_APPWRITE_PROJECT_ID: string;
-  readonly APPWRITE_KEY: string;
-}
-
-interface ImportMeta {
-  readonly env: ImportMetaEnv;
-}

src/styles/root.scss

@@ -0,0 +1,164 @@
+body {
+    background: #1c1c1c;
+    color: #fdfdfd;
+    max-width: 600px;
+    margin: auto;
+    padding: 0px 24px;
+    font-family: Arial, Helvetica, sans-serif;
+    ::selection {
+        background: #3ecf8e;
+        color: whitel;
+    }
+}
+
+a {
+    color: white;
+}
+
+button {
+    color: color;
+    color: white;
+    font-size: 12px;
+    text-decoration: none;
+    margin-right: 6px;
+    background: #cbddbe5e;
+    padding: 6px;
+    border-radius: 4px;
+    border: none;
+    cursor: pointer;
+    &:hover {
+        filter: brightness(0.8)
+    }
+}
+
+header {
+    background: #232323;
+    border: 1px #2e2e2e solid;
+    transition: 1.3s border;
+    border-radius: 6px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 12px;
+    margin-top: 24px;
+    &:hover {
+        border-color: #3ecf8e;
+        transition: 1.3s border;
+    }
+    h2 {
+        margin: 0px;
+        font-size: 14px;
+    }
+    .header-end {
+        display: flex;
+        align-items: center;
+        a {
+            color: color;
+            color: white;
+            font-size: 12px;
+            text-decoration: none;
+            margin-left: 6px;
+            background: #cbddbe5e;
+            padding: 6px;
+            border-radius: 4px;
+            &:hover {
+                filter: brightness(0.8)
+            }
+        }
+        img {
+            height: 24px;
+            border-radius: 6px;
+            border: 2px #2e2e2e solid;
+        }
+    }
+}
+
+.landing {
+    text-align: center;
+    margin-top: 124px;
+    .cta a {
+        color: color;
+        color: white;
+        font-size: 12px;
+        text-decoration: none;
+        margin-left: 6px;
+        background: #cbddbe5e;
+        padding: 6px 12px;
+        border-radius: 4px;
+        &:hover {
+            filter: brightness(0.8)
+        }
+    }
+}
+
+.content {
+    background: #232323;
+    border: 1px #2e2e2e solid;
+    border-radius: 6px;
+    padding: 12px;
+    margin-top: 12px;
+}
+
+.form-field {
+    display: flex;
+    flex-direction: column;
+    margin: 12px 0px;
+    input {
+        background: #121212;
+        border: none;
+        border-radius: 4px;
+        color: white;
+        padding: 6px 12px;
+        margin-top: 6px;
+        &:focus {
+            outline: none
+        }
+    }
+}
+
+.oauth-grid {
+    display: grid;
+    grid-auto-flow: column;
+    grid-gap: 6px;
+    button {
+        background: #494949;
+        border: none;
+        color: white;
+        padding: 6px 12px;
+        border-radius: 6px;
+        cursor: pointer;
+        &:hover {
+            filter: brightness(0.8)
+        }
+    }
+}
+
+.dummies {
+    display: inline-block;
+    height: 28px;
+    position: relative;
+    overflow: hidden;
+    background-color: #2e3733;
+    border-radius: 6px;
+}
+
+.message-in {
+    font-size: 12px;
+    background: #61685c;
+    color: white;
+    padding: 6px 12px;
+    border-radius: 2px;
+}
+
+.welcome {
+    display: flex;
+    align-items: center;
+    h2 {
+        font-size: 16px;
+    }
+    img {
+        width: 64px;
+        border-radius: 2rem;
+        margin-right: 16px;
+    }
+}

tsconfig.json

@@ -1,3 +1,12 @@
 {
-  "extends": "astro/tsconfigs/strict"
+  "extends": "astro/tsconfigs/strictest",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@layouts/*": ["src/layouts/*"],
+      "@components/*": ["src/components/*"],
+      "@styles/*": ["src/styles/*"],
+      "@library/*": ["src/library/*"]
+    }
+  }
 }