Technical Specification: Auth & Integration

Authentication System (RBAC)

Architecture

We use a light-weight, client-side approach for the MVP. Authentication state is persisted in the browser's sessionStorage, meaning the user stays logged in as long as the tab/window remains open.

Storage Key

Key: kiq_role
Values: 'admin' | 'investor'

Protection Logic (`ProtectedRoute.jsx`)

The component wraps any route that requires authorization.

If no kiq_role exists: Redirect to /login (storing the intended destination in router state).
If allowedRoles prop is provided and the current role is not included: Redirect to / (Home).

Credential Matrix

Username	Password	Role	Access Path
`admin`	`testthetestingtesters-2026`	`admin`	`/admin`, `/restricted`
`investor-KIQ`	`testinvestortestingit-2026`	`investor`	`/restricted`

Form Integration (Web3Forms)

Implementation (`AccessRequest.jsx`)

The form uses the https://api.web3forms.com/submit endpoint to send structured JSON data via a POST request.

API Key

Access Key: 5c3d4233-020d-494a-bca6-6336886f6db3 (bound to KIQ@d-hive.de)

Data Payload

The following fields are transmitted:

access_key: Internal API key
subject: Dynamic subject line containing the requester's name/company
from_name: Static label for identification
name, company, role, email, phone, purpose, reason

UX Logic

Validation: Native browser validation (required, type="email") is enforced.
Loading: Submit button changes to "Wird gesendet..." and is disabled during fetch.
Success: Displays a success component and auto-redirects to / after 4 seconds.
Error: Displays an inline banner if the API returns an error or a network timeout occurs.

1.8 KiB Raw Permalink Blame History