feat: configure the subdomain router (#49)

Author: cybercoder-naj

Dockerfile

@@ -5,5 +5,5 @@ COPY package.json bun.lockb ./
 RUN bun install --production
 COPY . .
 
-RUN bun --bun run build
-CMD ["bun", "run", "index.js"]
+RUN bun run build
+CMD ["bun", "run", ".output/server/index.mjs"]

README.md

@@ -4,110 +4,35 @@ Every application or package built to support IC Hack'25 tech.
 
 ## What is in this?
 
+This is a gigantic single running Nuxt4 application. The 3 main frontend applications are separated under subdomain routing.
+
 - [Server (Perry)](./server/) - First time custom backend server built.
-- [Admin (Ferb)](./app) - An insider website that manages users, teams, announcements... admin stuff - tbd to be app/pages/admin or something. update before merge.
+- [Admin (Ferb)](./app/pages/$admin/) - An admin dashboard website that manages users, teams, announcements.
+- [Internal (Phineas)](./app/pages/$my/) - The Internal Website used by hackers, volunteers, etc.
+- [Landing Page (Isabella)](./app/pages/$www/) - A static landing page.
 
 ## Before you start
 
 1. You must read this README in full.
 1. Read relevant portions of the documentation.
 
 > [!note]
-> All ichack related systems every year are **private**. Feel free to fork this repository but keep it private. You could make your repo public after IC Hack is over, but make sure there are no senstive information in the repository.
+> All ichack related systems every year are **private**. A public **port** (not _fork_) of the repository is allowed but all sensitive information must be deleted from all commit history.
 
 ## Documentation
 
 This is the first time IC Hack tech systems will have extensive documentation. Open [the docs folder](./documentation/) as an [Obsidian Vault](https://obsidian.md).
 
+1. Install [Obsidian](https://obsidian.md/).
+2. Open the path `./documentation` as an Obsidian Vault.
+
 > [!important]
 > The documentation started authoring from 4th July 2024. The contributors will try to document this code as much as possible and encourage the future volunteers to do so as well. However, it may not be the case that everything is documented perfectly.
 >
 > As a result, some or most of the pages here will be incomplete. Over time, we will do our best that it does not happen.
 >
 > The tense used in the documentation will be confusing depending on the date it was written and the event that was spoken about.
 
-## How to run?
-
-### Pre-setup
-
-You'll need Docker, bun, and psql installed.
-
-### Environment Variables
-
-Without setting environment variables, your code will not execute or behave correctly. Copy the `.env.template` file into `.env.local` and `.env.test` and fill it appriorately.
-
-#### Dev setup
-
-```env
-PGUSER=admin
-PGPASSWORD=rootpasswd
-PGDB=postgres
-PGHOST=0.0.0.0
-PGPORT=5432
-
-DISCORD_CLIENT_ID=anything, you'll know if you're testing this
-DISCORD_SERVER_ID=see above
-DISCORD_CLIENT_SECRET=see above
-```
-
-#### Test setup
-
-```env
-PGUSER=test
-PGPASSWORD=test
-PGDB=postgres
-PGHOST=0.0.0.0
-PGPORT=5432
-PGCA=
-
-DISCORD_CLIENT_ID=
-DISCORD_SERVER_ID=
-DISCORD_CLIENT_SECRET=
-```
-
-### Docker Compose
-
-> [!important]
-> If you use windows, please try working on WSL2 since our codebase works best inside a Unix/Linux environment.
-
-In the root directory of the project, execute:
-
-```bash
-bun install
-bun reset-db
-bun run dev
-```
-
-You can visit the admin page at `localhost:3000`. This will be updated to `admin.localhost:3000` soon:tm:.
-
-The api routes can be accessed from `localhost:3000/api`, as expected.
-
-To stop the containers from running, simply use CTRL+C.
-
-To add yourself as a god user for testing, edit and execute `bun run scripts/seed.ts`.
-
-If you ran the project headless, execute (in the same root directory)
-
-```bash
-docker compose down
-```
-
-Refer to [Docker](./documentation/Techologies/Docker.md) to learn about how we containerised it and used compose.
-
-#### Common Docker error
-
-If you get the error
-
-```
-Error response from daemon: network 91cc91888ed27849c518f6769cf18115ddb56b0ef833e745e764964a6a2586da not found
-```
-
-Run the following command and try again.
-
-```bash
-docker-compose -f dev.docker-compose.yaml down --remove-orphans
-```
-
 ## Development rules
 
 ### Working on issues
@@ -134,7 +59,7 @@ You should create a PR **as soon as** you create a branch.
 1. The actual commit messages within your PR **does not follow** any conventional naming pattern. However, your PR title must follow `type: description` format, similar to your branch name.
 1. If any of the repo admins approve your PR and you need to need to update your branch, consider rebase to avoid making another commit for the admins to review again.
 
-#### PR <--> ClickUp Integration
+#### PR <> ClickUp Integration
 
 1. When you create a comment, in the description include the following text: `Link CU-86bzr6uwe`, you will find your taskId in the ClickUp Card you are working.
 1. You can use special commit messages to change the status of your card. E.g. a commit message can be, `updated the readme #86bzr6uwe[in review]`.

app/.dockerignore

@@ -0,0 +1,26 @@
+import type { RouterOptions } from 'nuxt/schema';
+
+export default <RouterOptions>{
+  routes(_routes) {
+    const { ssrContext } = useNuxtApp();
+    let subdomain = '';
+
+    if (import.meta.server)
+      subdomain = ssrContext?.event.context.subdomain ?? 'www';
+    else {
+      const { host } = useRequestURL();
+      const config = useRuntimeConfig();
+      if (!config.public.mainDomain.includes(host))
+        subdomain = host.match(/^[^.]*/g)?.[0] ?? 'www';
+      else subdomain = 'www';
+    }
+
+    const subdomainRoutes = _routes
+      .filter(({ path }) => path.startsWith(`/$${subdomain}`))
+      .map(({ path, ...rest }) => ({
+        ...rest,
+        path: path.replace(`/$${subdomain}`, '')
+      }));
+    return subdomainRoutes;
+  }
+};

app/.gitignore

@@ -18,8 +18,12 @@ services:
       - '3000:3000'
     depends_on:
       - postgres
-    env_file:
-      - .env.local
+    environment:
+      - PGUSER=admin
+      - PGPASSWORD=rootpasswd
+      - PGDB=postgres
+      - PGHOST=posgres
+      - PGPORT=5432
 
 volumes:
   postgres_data:

app/README.md

@@ -1,18 +1,30 @@
-[
-  "file-explorer",
-  "global-search",
-  "switcher",
-  "graph",
-  "backlink",
-  "outgoing-link",
-  "tag-pane",
-  "properties",
-  "page-preview",
-  "note-composer",
-  "command-palette",
-  "editor-status",
-  "bookmarks",
-  "outline",
-  "word-count",
-  "file-recovery"
-]
+{
+  "file-explorer": true,
+  "global-search": true,
+  "switcher": true,
+  "graph": true,
+  "backlink": true,
+  "canvas": false,
+  "outgoing-link": true,
+  "tag-pane": true,
+  "properties": true,
+  "page-preview": true,
+  "daily-notes": false,
+  "templates": false,
+  "note-composer": true,
+  "command-palette": true,
+  "slash-command": false,
+  "editor-status": true,
+  "bookmarks": true,
+  "markdown-importer": false,
+  "zk-prefixer": false,
+  "random-note": false,
+  "outline": true,
+  "word-count": true,
+  "slides": false,
+  "audio-recorder": false,
+  "workspaces": false,
+  "file-recovery": true,
+  "publish": false,
+  "sync": false
+}

app/router.options.ts

@@ -3,9 +3,19 @@ created: 2024-07-04
 authors: 
  - Nishant
 ---
+## Version 1 (Deprecated)
 
 The monorepo is a big TypeScript project with multiple projects included here.
 - `apps/*` directory contains all the projects for the front-end websites.
 - `packages/*` directory contains [[Nuxt]] layers and packages that make the building block of the applications.
 - `server` directory is a [[Hono]] application that deals with... the server.
-- `nginx` directory contains the configuration file for [[Nginx]] reverse proxy.  
+- `nginx` directory contains the configuration file for [[Nginx]] reverse proxy.  
+
+> [!note]
+> This directory structure has been resigned. Check out [[The Fresh Architecture]]
+
+## Version 2
+The monorepo is a big TypeScript project with multiple projects included here.
+- `app` directory contains all the projects for the front-end websites. This is achieved via [[Subdomain Routing]].
+- `layers/*` directory contains [[Nuxt]] layers that make the building block of the applications.
+- `server` directory is a [[Hono]] application that deals with the server.

docker-compose.yaml

@@ -1,5 +1,5 @@
 ---
-created: 2024-07-08
+created: 2024-11-30
 authors:
   - Nishant
 ---

documentation/.obsidian/core-plugins.json

@@ -0,0 +1,10 @@
+---
+created: 2024-11-30
+authors:
+  - Nishant
+---
+The application runs in the Server-side rendering (SSR) mode. This means the HTML document is rendered on the server, and sent to the browser. The JavaScript files soon follow along and the JavaScript code then renders it again on the client side, giving the page the interactivity. 
+
+In the server side, when the requrest comes to render a page, a middleware is executed, more specifically `./server/middleware/subdomain.ts`. In this middleware, we analyse the hostname and extract the subdomain from it. The subdomain is then attached to the `ssrContext`, which is sent to the browser as a payload. Now that the middleware is executed and we have have the subdomain used (undefined if no subdomain was used), Nitro now understands that it isn't an API route, it is a page route. The handler is given to Nuxt to render the initial HTML render of the page.
+
+When Nuxt is given the control from Nitro, it is intercepted by `app/router.options.ts` that returns a modified list of routes. This uses the subdomain to filter and map the existing list of routes. Nuxt finds the component function to render the page in the modified list of routes to render the page. In more detail, the `router.options.ts` has the payload from the server in the `ssrContext`. This also protects from any cross-domain access.