Infrastructure Documentation

Customer Share &
Service Portal

Complete infrastructure diagrams and data flow documentation for the TYP Customer Portal. All systems, all integrations, all data paths.

Version 1.0
Date June 2026
Classification Internal
Stack Next.js · Supabase · Vercel
01 — ARCHITECTURE

Technology Stack

Every layer of the portal stack with its role, cost tier, and integration surface.

NX
Next.js 14
App Router, React Server Components, API routes. Deployed as serverless functions on Vercel.
Frontend + Backend
SB
Supabase
Auth (JWT), Postgres database with RLS, file storage buckets. Free tier → Pro at $25/mo.
Auth · DB · Storage
VC
Vercel
CI/CD, hosting, edge middleware for auth-gating, environment variable management.
Hosting · Deploy
HS
HubSpot
Sales Hub + Service Hub Professional. CRM, Commerce Hub payments, Service Portal, workflows.
CRM · Commerce
ST
Stripe
Payment processing, Checkout sessions, webhook events. Connected via HubSpot Commerce Hub.
Payments
LM
Lu.ma
Event and course management. API access requires Plus subscription. Webhooks sync to portal.
Events · Courses
PM
Postmark
Existing account. SMTP for Supabase Auth emails. Transactional email via Make.com scenarios.
Email
MK
Make.com
Existing account. Automation glue between all systems. 5 core scenarios for data sync.
Automation
GH
GitHub
Repository with 3-branch strategy: main (prod), staging, develop. Branch protection on main.
Version Control
02 — PROCESS DIAGRAM

End-to-End User Journey

From landing page through account creation, authentication, and all primary user outcomes. Click any node for details.

user-journey.flow · v1.0
ENTRY AUTH HOME ACTIONS OUTCOMES Portal landing page public · unauthenticated new user returning Register account Email + password Login Email + password Email confirmation Postmark → verify link Active session JWT issued · 1hr expiry Home dashboard My Files · My Items · Catalog My Files Browse folders My Items Purchased content Catalog Browse & purchase Settings Account · Support File operations Preview · download Access item Doc · tool · event Checkout Stripe · Commerce Hub Manage account Password · email File delivered Signed URL · CDN Content rendered Browser or local app Access granted Item in My Items Changes saved Supabase + HubSpot MAKE.COM AUTOMATION LAYER HubSpot CRM Stripe + Lu.ma Auth & files Content Commerce Account Outcomes Click nodes for details
Auth & files
Content
Commerce
Account
Outcomes
Async sync
03 — DATA FLOW

Data Flow & Lifecycle

Where data enters, how it moves between systems, and where it exits or is archived. Filter by data type to trace a specific flow.

data-flow.diagram · v1.0
DATA IN PORTAL CORE EXTERNAL DATA OUT Registration Email + password Login Auth credentials File upload Any file type Purchase Card via Stripe Event signup Via Lu.ma page Settings Email · pw · theme Admin assign Manual · Studio Supabase Auth JWT · RLS · sessions Supabase Postgres Structured data · RLS Supabase Storage Per-user file buckets Next.js API Webhooks · logic Make.com Automation glue HubSpot CRM Contacts · deals Stripe Payments · invoices Lu.ma Events · courses Postmark Email delivery User inbox File download Invoice PDF Item access DATA LIFECYCLE EXIT Account archived Deletion request Legal retention Security incident User data Payments Email Events Async Exit point Click nodes for details
User / auth data
Payment data
Email flow
Event data
Background / async
04 — INTEGRATIONS

System Integration Map

All Make.com automation scenarios and API integration points between systems.

User registration confirmed
Supabase Auth → Make.com →
Create HubSpot Contact · create /{user_id}/ storage folder · send welcome email via Postmark
Purchase completed
Stripe webhook → Next.js API → Make.com →
Create HubSpot Deal · insert user_items row · log order in Postgres · send purchase confirmation
Event registration (Lu.ma)
Lu.ma webhook → Next.js API → Make.com →
Match email to portal user · create user_items (type: Event) · update HubSpot Contact activity
Admin item assignment
Supabase Studio → Make.com →
Detect new user_items row inserted by admin · send item assignment notification email to user
Settings email change
Portal → Supabase Auth → Make.com →
After email confirmed · update HubSpot Contact email · log change in audit trail
Catalog sync
HubSpot Product Library → Make.com →
Sync product changes to Supabase items table · catalog page always reads from local Postgres (not HubSpot API directly)
05 — DATA MATRIX

Data Object Reference

Every primary data object, where it lives, who owns it, and its retention policy.

Data object Primary store Synced to Sensitivity Retention
User account Supabase auth.users HubSpot Contact HIGH Until deletion + 30-day archive
User profile Supabase user_profiles HubSpot Contact MED Until deletion
Files (metadata) Supabase files table MED Until user deletes
File contents Supabase Storage bucket MED Until user deletes
Catalog items Supabase items HubSpot Products LOW Indefinite
User items (access) Supabase user_items HubSpot Deal MED Until revoked
Orders Supabase orders HubSpot Deal + Stripe HIGH 10 years (Swiss law)
Payment data Stripe (only) Portal stores Stripe IDs only HIGH Per Stripe compliance
Event registrations Lu.ma + user_items HubSpot Contact activity MED Until deletion
Auth logs Supabase Auth logs HIGH 90 days then purge
CRM contact records HubSpot MED Per HubSpot GDPR policy
06 — SECURITY

Security Controls

Critical security requirements per system. All items must be completed before go-live.

Supabase
RLS enabled on every table in public schema
Storage bucket set to private (not public)
service_role key only in server-side code
JWT expiry 1 hour, refresh rotation enabled
Auth rate limits configured
Email confirmation enabled (Postmark SMTP)
Stripe
Live keys only in Production Vercel environment
Webhook signature validation implemented
Test keys never in production env vars
No raw card data in database (Stripe IDs only)
MFA on all Stripe admin accounts
GitHub & Vercel
No secrets committed to any branch
.env files in .gitignore, verified
Main branch protection rules enabled
Vercel secrets marked Sensitive
Deployment protection on Preview URLs
Production/staging use separate credentials
Email & Accounts
DKIM DNS record verified in Postmark
DMARC record added (p=none → quarantine → reject)
MFA on all admin accounts (all platforms)
All credentials in password manager only
Offboarding process documented
GDPR deletion flow implemented
07 — ROADMAP

Build Phases

Recommended development sequence. Each phase is independently deployable and testable.

01
ACTIVE
Foundation & DevOps
  • GitHub repo · 3-branch strategy · branch protection
  • Supabase projects (prod + staging) · RLS schema
  • Vercel project · CI/CD pipeline · env vars
  • Postmark SMTP integration · email confirmation
  • Next.js scaffold · auth pages · file browser
  • Supabase Storage bucket · per-user folder creation
02
PLANNED
My Items & Catalog
  • Items table · user_items junction table
  • Catalog page with type filters
  • My Items dashboard with item type cards
  • Manual item assignment via Supabase Studio
  • HubSpot product library sync via Make.com
03
PLANNED
Payments
  • Stripe Checkout + HubSpot Commerce Hub integration
  • Webhook handler with signature validation
  • Orders table · invoice generation
  • Make.com: payment confirmed → user_items → HubSpot Deal
  • Purchase confirmation email via Postmark
04
PLANNED
Lu.ma Event Integration
  • Lu.ma Plus subscription required for API access
  • Webhook receiver: event signup → user_items
  • Catalog event listings pulled from Lu.ma API
  • Make.com: event registration → HubSpot Contact activity
  • Reconciliation: Lu.ma registrations for users without portal accounts
05
PLANNED
Settings, Dark Mode & Support
  • Settings page: password, email change, dark/light mode
  • HubSpot Service Hub ticket portal link
  • Make.com: email change → HubSpot Contact update
  • GDPR deletion flow
  • Account archival cron job
06
PLANNED
Hardening & Launch
  • Full RLS audit (SQL verification query → 0 rows unprotected)
  • Stripe webhook validation end-to-end test
  • DKIM/DMARC enforcement (p=reject)
  • Vercel Deployment Protection on all Preview URLs
  • Load test · error boundary coverage · mobile responsiveness
  • Security checklist sign-off (see Section 06)