Add gallery loading indicators and recover from WebGL context loss.

- Show loading markers while the catalog, portrait thumbnails, and 3D
  halls load so users know loading is still in progress.
- Recover the 3D hall from a lost WebGL context by remounting the canvas
  with a fresh context instead of leaving a permanent dark window, and
  guard the HDR environment map behind an error boundary.
- Show movement streams whose span overlaps the view even when their
  artists lived outside the visible time range.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Danila Khodjaef
2026-07-07 12:31:56 +03:00
co-authored by Cursor
parent 99b8559607
commit 1408811948
5 changed files with 300 additions and 31 deletions
@@ -0,0 +1,35 @@
import './GalleryLoadingMarker.css';
interface Props {
message?: string;
/** Full-area overlay (dims background). */
overlay?: boolean;
/** Compact strip along the bottom — does not block interaction. */
banner?: boolean;
className?: string;
}
export default function GalleryLoadingMarker({
message = 'Loading…',
overlay = false,
banner = false,
className = '',
}: Props) {
const modeClass = overlay
? ' gallery-loading-marker-overlay'
: banner
? ' gallery-loading-marker-banner'
: '';
return (
<div
className={`gallery-loading-marker${modeClass}${className ? ` ${className}` : ''}`}
role="status"
aria-live="polite"
aria-busy="true"
>
<div className="gallery-loading-marker-spinner" aria-hidden />
<p>{message}</p>
</div>
);
}