SaaS Platform

Sign inSign up

Marvia-21

No page ever feels incomplete

Documentation and product coexist. Every surface is composed from the same thirteen-section contract, so a feature inherits hero, docs, actions, activity and an empty state for free.

Universal page structure

1. Hero
Purpose of the page plus its single key action.
2. Overview
A concise summary of what the feature does.
3. Documentation summary
Quick reference pulled from the documentation runtime.
4. Quick actions
Primary interactions resolved from the command registry.
5. Primary widget
The core functionality of the page as a registered widget.
6. Workspace data
Contextual, workspace-scoped records for the current tenant.
7. Recent activity
User and team updates from the audit and event stream.
8. Related resourcesoptional
Links, tools and references cross-linked from the registry.
9. Related learningoptional
Lessons and guides resolved from the Learning OS.
10. Related extensionsoptional
Marketplace assets that extend this surface.
11. Developer notesoptional
Schemas, events and API references for the page.
12. Empty state
A guided fallback: a page is never blank.
13. Footer links
Navigation, legal and support links.

Rules

  • A page is composed from the registry; sections are never hand-assembled per feature.
  • A required section that has no data renders its empty state, never nothing.
  • Documentation and product coexist: every page links to the doc that explains it.

Deliverables

SaaS frameworkUniversal page layoutDocumentation runtimeWorkspace platformAuthentication and securityBilling and paymentsCredits and walletNotifications and searchCommand paletteHelp centreAdmin platformMonitoring dashboardAPI platformDeveloper portalDeployment architectureSecurity frameworkPerformance frameworkArchitecture and developer docs

Workspace platform

Multi-tenant by construction

Every row, cache key and storage path is workspace-scoped; every operation is role-gated and audited.

createmanageswitchinvitesettingsarchiverestoretransferdelete

Role matrix

owner
create, manage, switch, invite, settings, archive, restore, transfer, delete
admin
manage, switch, invite, settings, archive, restore
manager
manage, switch, invite, settings
member
switch
viewer
switch
guest
switch

Usage tracking

storage
Object storage and snapshot bytes held by the workspace.
credits
Credits consumed this period against the wallet balance.
api-calls
Public API and webhook volume against the plan limit.
seats
Active memberships counted against the subscription.
extensions
Installed marketplace assets and their runtime cost.

Rules

  • Every row is workspace-scoped; a query without a workspace filter is a bug.
  • Archive is reversible, delete is not: delete requires an explicit typed confirmation.
  • Transfer moves ownership and payment responsibility in one audited transaction.
  • Every workspace operation writes an audit log entry with actor, target and diff.

Users and security

Global identity, workspace-scoped authority

Sign-in methods sit behind the auth adapter; tenancy is enforced in the database, not only in the app.

Profile

avatar
Profile image stored in object storage with a signed URL.
language
Interface language, BCP-47, with fallback to the workspace default.
timezone
IANA timezone driving every rendered timestamp.
theme
Light, dark or system, persisted per user.
notifications
Per-category channel preferences.

Organization roles

owneradminmanagermemberviewerguest

Account security

sessions
Active sessions with device, location and revoke.
connected-accounts
Linked OAuth identities and their scopes.
login-history
Recent sign-in attempts with outcome.
personal-access-tokens
Scoped API tokens with expiry and last use.
trusted-devicesplanned
Remembered devices that skip a step-up challenge.
ssh-keysplanned
Public keys for CLI and git-based workflows.

Authentication

google
Managed Google sign-in.
github
Managed GitHub sign-in for creators.
magic-linkplanned
Passwordless email link.
email-passwordplanned
Classic credentials with breach checks.
ssoplanned
SAML/OIDC single sign-on for organizations.
passkeysplanned
WebAuthn passkeys as a primary factor.
2faplanned
TOTP second factor with recovery codes.

Security framework

row-level-security
Every table enforces tenancy in the database, not only in the app.
permission-checks
Server-side permission evaluation on every mutation and read path.
workspace-isolation
No query, cache key or storage path crosses a workspace boundary.
secret-management
Secrets live in the vault; runtime code receives references only.
audit-logs
Hash-chained, append-only records for every privileged action.
rate-limiting
Per-identity and per-workspace limits on API, auth and AI routes.
bot-protection
Challenge on sign-up, public forms and unauthenticated endpoints.
  • Sessions use a sliding window and are revocable from the profile surface.
  • Elevation to a privileged console requires a fresh authentication.
  • A permission change takes effect on the next request, never at next login.

Billing, credits and notifications

One financial surface, many providers

Providers sit behind one adapter contract; credits are estimated, reserved, metered and settled with automatic refunds.

Billing surfaces

subscriptions
Plan, seats, renewal date, upgrade, downgrade and cancellation.
invoices
Issued invoices with PDF export and tax breakdown.
transactions
Every charge, refund and adjustment on the account.
wallet
Credit balance, top-ups and reserved amounts.
coupons
Discount codes with eligibility and expiry.
tax
Jurisdiction-aware tax handling on every charge.
payment-history
Settled, failed and pending payments per provider.
revenue
Recognised revenue and marketplace share for creators.

Payment providers

telegram-manual
Manual settlement flow with operator confirmation.
paddle
Merchant of record for global card and tax handling.
duitku
Indonesian payment channels and virtual accounts.
stripeplanned
Card and wallet payments.
paypalplanned
PayPal balance and card payments.
midtransplanned
Alternative Indonesian gateway.
xenditplanned
Southeast Asian payment coverage.
  • Providers sit behind one adapter contract; no provider type reaches product code.
  • Money is stored in minor units with an explicit currency, never as a float.
  • A webhook is only trusted after signature verification and idempotency checks.
  • Cancellation keeps access until the paid period ends; refunds are ledger entries.

Credit consumers

ai
Prompt runtime, planning and command execution.
reports
Report generation, comparison and export.
snapshots
Extraction pipeline runs and refreshes.
marketplace
Paid installs and metered assets.
learning-packs
Practice validation against real workspace data.
extensions
Metered capability executions.
automation
Scheduled and queued workflow runs.

Wallet

balancemonthly-usagetop-uptrends

Notifications

in-app
The notification centre inbox in the shell.
emailplanned
Transactional email per category preference.
telegramplanned
Operator and billing alerts.
webhookplanned
Signed delivery to a workspace endpoint.
pushplanned
Browser and mobile push.
billingworkspacemarketplacelearningsecurityai
  • Credits are estimated, reserved, metered and settled; a failed run is refunded automatically.
  • A low-balance notification fires before a capability is blocked, never after.

Documentation and developer experience

Documentation-driven development

The doc ships with the feature. Eight sections per feature, generated references, and the same public API the product itself calls.

overviewarchitectureworkflowexamplesapi-referenceschemapatternsbest-practices

Documentation standards

markdown-first
Source of truth is Markdown rendered by the content engine.
component-based
Docs compose the same registered components the product uses.
versioned
Every doc version is immutable and tied to a platform version.
cross-linked
Concepts link to schemas, patterns, APIs and lessons.
searchable
Docs are one scope inside universal search and the palette.
dark-mode
Docs inherit the product theme; no separate doc site theme.
  • Documentation-driven development: the doc is written with the feature, not after it.
  • API references and schemas are generated from source, never hand-synced.
  • A feature without its eight sections fails the architecture gate.

Developer tools

cli
Scaffold, develop, validate and publish from the terminal.
sdk
The typed public integration surface, versioned with the platform.
playground
Run SDK calls against emulators with live output.
sandbox
Isolated execution that never touches tenant data.
registry-explorer
Browse widgets, commands, capabilities, schemas and patterns.
examples
Runnable examples generated from the starter templates.

API platform

rest
Versioned REST endpoints described by a generated OpenAPI document.
webhooks
Signed, retried event delivery with a replay window.
api-keys
Workspace-scoped keys with granular scopes and rotation.
rate-limits
Documented per-plan limits returned in response headers.
sdk-versioning
Semantic versioning with a deprecation window per major.
graphqlplanned
A GraphQL surface over the same resolvers.
  • The public API is the same surface the product uses; there is no private fast path.
  • A breaking change ships behind a new version with a documented migration.

Monitoring and administration

Full observability behind permission gates

Metrics are derived from the event stream; every admin action is audit-logged.

Tracking scope

performance
Latency, edge cache hit rate and render timings per route.
errors
Error rate by surface, capability and extension version.
queues
Depth, age and failure rate per queue.
workers
Invocation count, duration and CPU limits per worker.
api
Public API volume, status codes and rate-limit rejections.
billing
Payment success rate, churn and dunning state.
credits
Consumption by consumer, refunds and reservation leaks.
ai
Provider latency, fallback rate and spend per workspace.
storage
Object and snapshot bytes with growth trend.
usage
Active workspaces, retention and feature adoption.

Analytics surfaces

workspace-analytics
Usage, credits and adoption for one tenant.
platform-analytics
Aggregate health and growth across all tenants.
marketplace-analytics
Installs, revenue and ratings per asset.
creator-analytics
Per-creator adoption, errors and earnings.
learning-analytics
Completion, mastery and certification rates.
billing-analytics
MRR, ARPU, churn and refund ratio.
  • Every admin surface is permission-gated and every action is audit-logged.
  • Metrics are derived from the event stream, never written by feature code.

Admin consoles

dashboard
Platform-wide health, growth and incident summary.
users
Identity lookup, impersonation requests and account actions.
organizations
Organization records, plans and ownership.
workspaces
Tenant inventory, usage and lifecycle state.
marketplace
Listings, review queue and quarantine.
extensions
Installed versions, error rates and rollbacks.
learning
Paths, lessons and credential issuance.
knowledge
Knowledge objects, relations and indexing state.
credits
Ledger inspection, grants and reconciliation.
billing
Subscriptions, invoices and dunning.
payments
Provider transactions, webhooks and disputes.
feature-flags
Targeted rollout by workspace, plan and region.
system-health
Probes, dependencies and incident timeline.
audit-logs
Cross-tenant, hash-chained privileged action history.
support
Tickets, severity and response state.
moderation
Reported assets, content and creator actions.

Operations

Deployment, compliance, support and performance

Every infrastructure dependency sits behind an adapter, so a provider move is a configuration change.

Deployment

edge-runtime
Cloudflare Workers execute SSR and server functions at the edge.
database
PostgreSQL behind the DatabaseProvider interface, with row-level security as the tenancy boundary.
auth
Identity behind the AuthProvider interface; the provider is a configuration value.
storage
R2 for objects and KV for cached, short-lived reads.
queues-cron
Durable Objects and scheduled workers where a job needs coordination.
provider-agnostic
Every dependency sits behind an adapter so a move is a config change.

Legal and compliance

privacy
What is collected, why, and the retention window.
terms
Service terms, acceptable use and liability.
cookies
Cookie categories with a consent record.
licenses
Marketplace licence kinds and creator obligations.
third-party-notices
OSS attributions generated from the dependency tree.
dpa
Data processing agreements for business customers.
vendor-risk
Assessments for payment and AI providers.

Support

documentation
Self-service docs and the help centre.
github
Public issue tracker for bugs and requests.
contact-form
Authenticated contact form with workspace context attached.
discordplanned
Community support and creator channels.
in-app-feedbackplanned
Contextual feedback widget on every page.
  • A bug report captures workspace, route, version and the last events automatically.
  • A feature request is triaged onto the public roadmap with a visible state.

Performance

  • Edge rendering with streaming for the first meaningful paint.
  • Lazy loading for below-the-fold widgets and heavy client libraries.
  • Manual refresh and incremental sync instead of background polling.
  • Snapshot caching keyed by content digest.
  • Queue processing for anything slower than a request budget.
  • Optimistic UI with server reconciliation on every mutation.

Coding standards

Documentation-driven
The doc and the feature ship in the same change.
Registry-driven
Pages, widgets and commands resolve from registries.
Capability-driven
Behaviour is contributed as a declared capability.
Manifest-first
Every asset declares itself before it can load.
Type-safe
Strong types across kernel, SDK and manifests.
Reusable
Components come from the library; no private forks.
No hardcoded logic
Configuration and data, versioned and discoverable.