mirror of
https://github.com/mauriceboe/TREK.git
synced 2026-06-19 21:31:46 +00:00
Maurice
fc7d8b5d12
Brownfield strangler migration of the backend onto NestJS modules (auth, trips, days, places, assignments, packing, todo, budget, reservations, collab, files, photos, journey, share, settings, backup, oidc, oauth, admin, atlas, vacay, weather, airports, maps, categories, tags, notifications, system-notices) served through a per-prefix dispatcher, keeping the existing SQLite/better-sqlite3 DB and JWT httpOnly cookie auth, with behavioural parity for every route. Client: React 19 upgrade, "page = wiring container + data hook" pattern across all pages, per-domain Zustand stores bound to @trek/shared contracts, and decomposition of the large components (DayPlanSidebar, PackingListPanel, CollabNotes, FileManager, MemoriesPanel, PlacesSidebar, CollabChat, SystemNoticeModal, BudgetPanel, PlaceFormModal, ...) into focused render units backed by in-file hooks. Apply the shared global request pipeline (helmet/CSP, CORS, HSTS, forced HTTPS, the global MFA policy and request logging) to the NestJS instance as well, so a migrated route is protected identically to the legacy fallback rather than bypassing it.
34 lines
1.2 KiB
TypeScript
34 lines
1.2 KiB
TypeScript
import React from 'react'
|
|
|
|
interface SpinnerProps {
|
|
/**
|
|
* Tailwind classes controlling size + colours of the ring. Callers keep full
|
|
* control so adopting the component never changes a spinner's appearance.
|
|
* Defaults to the app's most common page-loader ring.
|
|
*/
|
|
className?: string
|
|
}
|
|
|
|
/** The bare spinning ring used throughout the app (`rounded-full animate-spin`). */
|
|
export function Spinner({ className = 'w-6 h-6 border-2 border-zinc-300 border-t-zinc-900' }: SpinnerProps): React.ReactElement {
|
|
return <div className={`${className} rounded-full animate-spin`} />
|
|
}
|
|
|
|
interface PageSpinnerProps extends SpinnerProps {
|
|
/** Wrapper classes for the centring container. */
|
|
wrapperClassName?: string
|
|
wrapperStyle?: React.CSSProperties
|
|
}
|
|
|
|
/**
|
|
* A full-area centred loading spinner — the repeated "flex items-center
|
|
* justify-center" loader that page loading-guards render while data resolves.
|
|
*/
|
|
export function PageSpinner({ className, wrapperClassName = 'flex items-center justify-center', wrapperStyle }: PageSpinnerProps): React.ReactElement {
|
|
return (
|
|
<div className={wrapperClassName} style={wrapperStyle}>
|
|
<Spinner className={className} />
|
|
</div>
|
|
)
|
|
}
|