feature : Connect front to backend #1

Merged
BoxOfPandor merged 25 commits from feat/connect-front-to-backend into main 2026-03-19 14:56:19 +01:00
Showing only changes of commit c5a9bd081c - Show all commits

View File

@@ -1,8 +1,7 @@
import { useAuth } from '../../contexts/AuthContext'; import { useAuth } from '../../contexts/AuthContext';
import type { UserRole } from '../../types';
/** /**
* Developer-only overlay to quickly switch user roles for testing. * Developer-only overlay to quickly log in as test accounts.
* Only visible in development mode. * Only visible in development mode.
*/ */
export function DevRoleSwitcher() { export function DevRoleSwitcher() {
@@ -12,9 +11,8 @@ export function DevRoleSwitcher() {
} }
function DevRoleSwitcherInner() { function DevRoleSwitcherInner() {
const { user, isAuthenticated, devSetRole, login, logout } = useAuth(); const { user, isAuthenticated, login, logout } = useAuth();
const ROLES: UserRole[] = ['user', 'dev', 'com'];
const DEV_ACCOUNTS = [ const DEV_ACCOUNTS = [
{ label: 'Dev/Admin (Kestrel)', email: 'kestrel@crowmate.dev' }, { label: 'Dev/Admin (Kestrel)', email: 'kestrel@crowmate.dev' },
{ label: 'Com Staff (Vesper)', email: 'vesper@crowmate.dev' }, { label: 'Com Staff (Vesper)', email: 'vesper@crowmate.dev' },
@@ -48,30 +46,10 @@ function DevRoleSwitcherInner() {
<div style={{ color: 'var(--color-text-muted)', marginBottom: '0.4rem' }}> <div style={{ color: 'var(--color-text-muted)', marginBottom: '0.4rem' }}>
Logged as: <strong style={{ color: 'var(--color-text)' }}>{user?.username}</strong> Logged as: <strong style={{ color: 'var(--color-text)' }}>{user?.username}</strong>
</div> </div>
<div style={{ color: 'var(--color-text-muted)', marginBottom: '0.5rem' }}> <div style={{ color: 'var(--color-text-muted)', marginBottom: '0.75rem' }}>
Role: <strong style={{ color: 'var(--color-green)' }}>{user?.role}</strong> Role: <strong style={{ color: 'var(--color-green)' }}>{user?.role}</strong>
</div> </div>
<div style={{ display: 'flex', gap: '0.3rem', marginBottom: '0.5rem', flexWrap: 'wrap' }}>
{ROLES.map((r) => (
<button
key={r}
onClick={() => devSetRole(r)}
style={{
background: user?.role === r ? 'var(--color-amber)' : 'transparent',
border: '1px solid var(--color-amber)',
color: user?.role === r ? '#000' : 'var(--color-amber)',
padding: '0.1rem 0.4rem',
cursor: 'pointer',
fontFamily: 'var(--font-mono)',
fontSize: '0.65rem',
}}
>
{r}
</button>
))}
</div>
<button <button
onClick={logout} onClick={logout}
style={{ style={{