feat: gitpod setup (#91)

* Add setup tasks for gitpod

* chore: updating image name

* chore: update image to workspace-full

* chore: update all instances of workspace:* to file:*

* chore: remove workspaces section on package.json

* chore: update supabase command to use npx

* chore: update gitpod file to use brew to install supabase cli

* revert: all instances of file:* to workspace:*

* chore: consolidate tasks into two steps

* chore: update main to command

* Update 20231115082347_remote_schema.sql

* check if column exists before creating

* Update .gitpod.yml with Supabase setup and project
start commands

* docs: add gitpod setup to readme

* combine all commands

* enable gitpod prebuild

* remove gitpod prebuild & move dep setup to init

* add prebuilds back to config

* complete setup gitpod instructions

* docs: add docs for gitpod setup

---------

Co-authored-by: Obakeng <60041842+obakeng-develops@users.noreply.github.com>

.gitpod.yml

@@ -0,0 +1,44 @@
+image: gitpod/workspace-full
+
+tasks:
+  - name: Setup all projects
+    init: |
+      pnpm i &&
+      cd apps/classroomio-com &&
+      cp .env.example .env &&
+      cd ../dashboard &&
+      cp .env.example .env &&
+      cd ../.. &&
+      pnpm supabase start
+    command: |
+      SUPABASE_ANON_KEY=$(pnpm supabase status | grep "anon key" | awk '{print $3}' | tr -d '\\n') &&
+      cd apps/dashboard &&
+      sed -i "s/PUBLIC_SUPABASE_ANON_KEY=.*/PUBLIC_SUPABASE_ANON_KEY=$SUPABASE_ANON_KEY/g" .env &&
+      cd ../.. &&
+      pnpm dev
+
+ports:
+  - port: 3000
+    visibility: public
+    onOpen: open-browser
+  - port: 5173
+    visibility: public
+    onOpen: open-browser
+  - port: 5174
+    visibility: public
+    onOpen: open-browser
+  - port: 54321
+    visibility: public
+    onOpen: ignore
+  - port: 54323
+    visibility: public
+    onOpen: ignore
+  - port: 54324
+    visibility: public
+    onOpen: ignore
+
+github:
+  prebuilds:
+    master: true
+    pullRequests: true
+    addComment: true

README.md

@@ -79,7 +79,15 @@ This repo is a mono repo that consists of 3 projects:
 
 ## Development
 
-### Setup
+### Gitpod Setup
+
+1. Click the button below to open this project in Gitpod.
+
+2. This will open a fully configured workspace in your browser with all the necessary dependencies already installed.
+
+[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/rotimi-best/classroomio)
+
+### Local Setup
 
 1. Fork the repo, then clone it using the following command (remember to replace the url with the url from your forked repo)
 
@@ -109,12 +117,12 @@ This repo is a mono repo that consists of 3 projects:
 
    You also need to have pnpm installed, you can find the installation guide [here](https://pnpm.io/installation#using-npm)
 
-5. Set up your `.env` file
+4. Set up your `.env` file
 
    - Go to `apps/classroomio-com` and `apps/dashboard`
    - Duplicate the `.env.example` file and rename it to `.env`
 
-6. Setup Supabase.
+5. Setup Supabase.
 
    - Make sure you've downloaded the [Supabase cli](https://github.com/supabase/cli)
    - Install and Start [docker](https://docs.docker.com/engine/install/)
@@ -149,24 +157,25 @@ This repo is a mono repo that consists of 3 projects:
 
    - To view the Supabase studio, open the Studio URL from the result of `pnpm supabase start`
 
-7. Install the required dependencies
+6. Install the required dependencies
 
    ```bash
    pnpm i
    ```
 
-8. Run all projects (in development mode)
+7. Run all projects (in development mode)
 
    ```bash
    pnpm dev
    ```
 
-9. All projects should start running
+8. All projects should start running
+
    - `classroomio-com`: [http://localhost:5173](http://localhost:5173)
    - `dashboard`: [http://localhost:5174](http://localhost:5174)
    - `docs`: [http://localhost:3000](http://localhost:3000)
 
-10. Running a specific project
+9. Running a specific project
    - **classroomio-com**: `pnpm dev --filter=classroomio-com`
    - **dashboard**: `pnpm dev --filter=dashboard`
-   - **docs**: `pnpm dev --filter=docs` 
+   - **docs**: `pnpm dev --filter=docs`

apps/dashboard/src/routes/+layout.svelte

@@ -80,7 +80,7 @@
     const { user: authUser } = session || {};
     console.log('Get user', authUser);
 
-    if (!authUser && !isPublicRoute($page.url.pathname)) {
+    if (!authUser && !isPublicRoute($page.url?.pathname)) {
       return goto('/login?redirect=/' + path);
     }
 
@@ -185,7 +185,7 @@
       }
     }
 
-    if (!profileData && !isPublicRoute($page.url.pathname)) {
+    if (!profileData && !isPublicRoute($page.url?.pathname)) {
       goto('/login?redirect=/' + path);
     }
   }
@@ -220,7 +220,7 @@
 
     handleResize();
 
-    if (!isSupabaseTokenInLocalStorage() && !isPublicRoute($page.url.pathname)) {
+    if (!isSupabaseTokenInLocalStorage() && !isPublicRoute($page.url?.pathname)) {
       console.log('No auth token and is not a public route, redirect to login', path);
       return goto('/login?redirect=/' + path);
     }
@@ -300,10 +300,10 @@
         </div>
       </Backdrop>
     {/if}
-    {#if !hideNavByRoute($page.url.pathname)}
+    {#if !hideNavByRoute($page.url?.pathname)}
-      {#if isOrgPage($page.url.pathname) || $page.url.pathname.includes('profile') || isCoursesPage(path)}
+      {#if isOrgPage($page.url?.pathname) || $page.url?.pathname.includes('profile') || isCoursesPage(path)}
         <OrgNavigation bind:title={$course.title} isCoursePage={isCoursesPage(path)} />
-      {:else if isLMSPage($page.url.pathname)}
+      {:else if isLMSPage($page.url?.pathname)}
         <LMSNavigation />
       {:else}
         <LandingNavigation
@@ -316,17 +316,17 @@
     {/if}
 
     <div class="flex justify-between">
-      {#if isOrgPage($page.url.pathname)}
+      {#if isOrgPage($page.url?.pathname)}
         <AddOrgModal />
         <div class="org-root w-full flex items-center justify-between">
-          {#if !isQuizPage($page.url.pathname)}
+          {#if !isQuizPage($page.url?.pathname)}
             <OrgSideBar />
           {/if}
           <div class="org-slot bg-white dark:bg-black w-full">
             <slot />
           </div>
         </div>
-      {:else if isLMSPage($page.url.pathname)}
+      {:else if isLMSPage($page.url?.pathname)}
         <div class="org-root w-full flex items-center justify-between">
           <LMSSideBar />
           <div class="org-slot bg-white dark:bg-black w-full">

apps/docs/pages/contributorguides/gitpod.mdx

@@ -1,5 +1,9 @@
-import { Callout } from 'nextra/components';
-
 # Gitpod Setup
 
-<Callout emoji="🚨">This page is a work in progress. Help us expand it by contributing!</Callout>
+## One Click Setup
+
+- This will open a fully configured workspace in your browser with all the necessary dependencies already installed.
+
+- Click the button below to open this project in Gitpod.
+
+[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/rotimi-best/classroomio)

supabase/migrations/20231115082347_remote_schema.sql

@@ -1258,11 +1258,42 @@ INSERT INTO "public"."question_type" (label, created_at, updated_at, typename) V
 INSERT INTO "public"."question_type" (label, created_at, updated_at, typename) VALUES ('Paragraph', '2021-08-07 18:49:46.246529+00', '2021-08-15 00:57:38.634665+00', 'TEXTAREA');
 
 
-alter table "storage"."buckets" drop constraint "buckets_owner_fkey";
+-- First, let's check if the constraint 'buckets_owner_fkey' exists before trying to drop it.
+DO $$
+BEGIN
+    IF EXISTS (SELECT 1 FROM information_schema.constraint_column_usage 
+               WHERE table_schema = 'storage' 
+               AND table_name = 'buckets' 
+               AND constraint_name = 'buckets_owner_fkey') THEN
+        ALTER TABLE "storage"."buckets" DROP CONSTRAINT "buckets_owner_fkey";
+    END IF;
+END
+$$;
 
-alter table "storage"."buckets" add column "owner_id" text;
+-- Now, we check if the column 'owner_id' exists in 'buckets' before trying to add it.
+DO $$
+BEGIN
+    IF NOT EXISTS (SELECT 1 FROM information_schema.columns 
+                   WHERE table_schema = 'storage' 
+                   AND table_name = 'buckets' 
+                   AND column_name = 'owner_id') THEN
+        ALTER TABLE "storage"."buckets" ADD COLUMN "owner_id" text;
+    END IF;
+END
+$$;
+
+-- Similarly, check if 'owner_id' exists in 'objects' before adding it.
+DO $$
+BEGIN
+    IF NOT EXISTS (SELECT 1 FROM information_schema.columns 
+                   WHERE table_schema = 'storage' 
+                   AND table_name = 'objects' 
+                   AND column_name = 'owner_id') THEN
+        ALTER TABLE "storage"."objects" ADD COLUMN "owner_id" text;
+    END IF;
+END
+$$;
 
-alter table "storage"."objects" add column "owner_id" text;
 
 create policy "Anyone can update an avatar. 1oj01fe_0"
 on "storage"."objects"