Skip to content

Fork enhancements: project management, themes, Google Drive, viewer tools#1477

Draft
MarkusSteinbrecher wants to merge 40 commits intobldrs-ai:mainfrom
MarkusSteinbrecher:main
Draft

Fork enhancements: project management, themes, Google Drive, viewer tools#1477
MarkusSteinbrecher wants to merge 40 commits intobldrs-ai:mainfrom
MarkusSteinbrecher:main

Conversation

@MarkusSteinbrecher
Copy link
Contributor

Summary

Comprehensive set of enhancements built on top of the Share fork, including:

Project & Model Management

  • Company/Project/Model hierarchy with IndexedDB storage
  • Model versioning (V1, V2, V3) with OPFS file storage
  • ProjectSelector breadcrumb in TopBar with reload button
  • Settings panel (right-side overlay) replacing popup dialog
  • Seed data export/import for deployment
  • View state persistence per model (camera position)

Theme System

  • 3 themes (Green/Yello/Blue) × light/dark modes
  • CSS custom properties applied globally
  • Theme picker in Settings panel
  • Scene background matches theme (no more pure black)
  • All icon colors use CSS vars

Google Drive Integration

  • OAuth 2.0 sign-in flow with Google Identity Services
  • Custom file browser using Drive API (no Picker iframe needed)
  • Download private files with OAuth token
  • Shareable URLs via /v/g/{fileId} with sign-in gate
  • .env auto-loader for API credentials

Viewer Tools

  • Element filter toolbar: type + storey chips with toggle visibility
  • Search moved to viewer toolbar with inline results and rich result cards
  • Section plane controls: inline sub-bar with draggable X/Y/Z handles
  • Section planes use renderer-based clipping (Conway-compatible)

UI Polish

  • NavSphere: dark grey wireframe, Lucide chevron arrows
  • Left nav: instant expand via DOM manipulation (no React re-render)
  • Springy hover animations on all icons (cubic-bezier)
  • Mobile: TopBar + ViewerToolbar visible
  • Floor plan: toggle button, title bar, mutual exclusion with other panels
  • Standardized font sizes (13px body, 11px captions)

Infrastructure

  • GH Pages deployment with hostname-based path detection
  • COOP/COEP headers adjusted for Google OAuth popups
  • MessageChannel extensions for widget apps (getProjectContext, loadAppData, saveAppData)
  • Build versioning (060)

Test plan

  • Load IFC model on localhost
  • Switch themes (Green/Yello/Blue × light/dark)
  • Create company/project, add model, upload new version
  • Load model from project via reload button
  • Search elements in viewer toolbar
  • Toggle element filters (type, storey)
  • Section planes (X/Y/Z drag handles)
  • Google Drive: sign in, browse, select and load model
  • Mobile: verify TopBar and ViewerToolbar visible
  • GH Pages deployment

🤖 Generated with Claude Code

Markus Steinbrecher and others added 30 commits March 17, 2026 17:25
- Fix updateLoadedFileInfo to accept filepath param and handle URL objects
- Add getFileData MessageChannel handler that reads from OPFS cache
  instead of re-fetching, solving CORS issues for GitHub/uploaded models
- Rename widget from kpi-dashboard to dashboard-app
- Deploy dashboard-app widget to public/widgets/dashboard-app/

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Absolute path /widgets/... breaks on GitHub Pages where the site
is served from a /Share/ subpath.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Dynamically detect /share/ or /Share/ base path for both CSS and JS
loading, so assets resolve correctly on GitHub Pages.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Detect github.io hostname to set installPrefix, so SPA routing
works with any repo name case (/share/ or /Share/).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Use github.io hostname detection instead of hardcoded /Share path
check in 404.html and proxy.js serveNotFound handler.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Use appPrefix to construct absolute iframe src so the widget URL
resolves from the site root, not the current page path.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Set basename on BrowserRouter to strip the repo name prefix,
eliminating the need for double /share/share/ in URLs.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
BrowserRouter basename conflicts with the app's /share route prefix
when the repo is also named share. Use installPrefix detection instead.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Restore upstream index.html, 404.html, BaseRoutes.jsx, and proxy.js.
Netlify serves from root / so no subpath handling is needed.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Subscribe to selectedElement store changes and send the GlobalId
to the iframe so the dashboard can show element properties live.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
The store doesn't use subscribeWithSelector middleware, so use
the basic subscribe form with manual previous-value tracking.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Replace hardcoded 1200px limit with window.innerWidth.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Disable pointer-events on iframes during drag so mouse events
reach the parent window for proper mouseup detection.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- New CutPlaneGizmo: semi-transparent orange plane with border edges
- Replaces the ugly green double-headed arrow
- Better hover states: opacity changes on highlight
- Grab cursor during drag interaction
- Gizmo auto-sizes to model bounding sphere

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Reverted CutPlaneMenu, GlbClipper, CutPlaneArrowHelper to upstream.
Removed CutPlaneGizmo. Kept drawer full-width and iframe
pointer-events fix during resize.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
These are upstream test fixtures that shouldn't be in the fork.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
…ctly

- GlbClipper now works for ALL model types (IFC + GLB)
- For IFC: calls context.addClippingPlane() + updateMaterials() directly
  No IfcPlane objects, no hidden controls, no dead code
- CutPlaneGizmo: translucent orange plane with border edges
- CutPlaneMenu: removed all IFC/GLB branching
- Added docs-internal/ with architecture and xeokit analysis

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- NavCube: orientation cube in bottom-left, syncs with camera,
  click face to fly to that view
- IFC Inspector: new widget app for IFC file analysis
- Apps listing: compact icon+label rows instead of heavy MUI cards
- AppEntry: uses appName field, shows icon + description inline

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Reverted theme, typography, colors, components, styles, settings
page back to upstream. Kept appName field fix and vertical grid
layout for apps listing.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- viewer.js: disposeViewer() cleans up Three.js scene, geometries,
  materials, textures, renderer before creating new viewer.
  Window event handlers use addEventListener/removeEventListener.
- CutPlaneGizmo.ts: add dispose() for geometries and materials
- GlbClipper.js: call gizmo.dispose() when deleting planes
- NavCube.jsx: dispose cube geometry, textures, materials on unmount
- AppsMessagesHandler.js: add dispose() to unsubscribe Zustand,
  close MessageChannel port
- AppIFrame.jsx: dispose previous channel on iframe reload/unmount
- Outlined MUI icons for thinner appearance
- Left toolbar: full-height, no dividers, Bldrs logo at bottom
- Onboarding popup disabled, cache-busting headers, SW unregister

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Test Models tab: 5 categories of IFC test models from testdata/
  with accordion layout and compact chips
- Recent Models tab: tracks opened models in localStorage
- Proxy serves /testdata/ files from disk for local dev
- Outlined MUI icons for thinner appearance
- Left toolbar: full-height with expand/collapse and Bldrs logo
- Section plane gizmo: grey grid pattern
- Build version indicator, onboarding disabled, SW unregister
- Memory leak fixes: viewer disposal, GPU cleanup, event handlers

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Renamed ifc-creator to architect agent
- 1500-line knowledge base: walls, doors, windows, stairs,
  slabs, roofs, columns, spaces, property sets, multi-storey
- Exact IFC STEP syntax for all element types

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- FloorPlanControl: toggle button in left toolbar
- FloorPlanManager: orthographic top-down view with floor isolation
- FloorPlan hash state persistence
- FloorPlanSlice: Zustand state for floor plan mode

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Replaced 14 MUI Material icons with Lucide React equivalents
- Lucide: stroke-only, strokeWidth 1.75, size 18 — matches HQ/Insight
- Profile icon: User, FloorPlan: Layers, Section: Scissors, etc.
- Fixed Bldrs logo: use img tag instead of SvgIcon wrapper
- Icons 18px, buttons 2em, border-radius 6px
- Added lucide-react dependency

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- TopBar with build version, profile, help, light toggle
- LeftToolbar: PanelLeft toggle, CSS width transition, individual app icons
- All icons switched to Lucide React (thin strokes, 16-18px)
- Nav tree: compact 13px font, hover-to-show hide icons, Lucide chevrons
- Selected icons turn bldrs green with transparent background
- Transparent panel/drawer backgrounds, thin resizer line
- Open dialog: consistent compact list style, wider dialog
- Light/shadow toggle with directional light + shadow ground plane
- BLDRS Skyline IFC model
- z-index hierarchy: TopBar(10) > SideDrawer(2) > LeftToolbar(1)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
AppShell flex refactor caused blank page — reverted CadView,
ViewerContainer, RootLandscape, SideDrawer, LeftToolbar, TopBar,
Share.jsx all back to working commit 0d9b0fa.

The VS Code-style layout needs to be done in an isolated branch
with proper testing before merging.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Markus Steinbrecher and others added 10 commits March 22, 2026 10:32
- Dashboard App: solid dark background (#1e1e1e), grey text (#d0d0d0),
  muted pastel chart colors, no transparency, Roboto font
- Apps drawer: marginTop 40px to clear TopBar
- Iframe: border removed for cleaner app view

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Add floating ViewerToolbar with camera/light/wireframe/projection controls.
Rewrite NavSphere with drag-to-orbit, clickable axis dots, background disc.
Add TerrainControl overlay. Apps drawer defaults to 50% width, viewer canvas
resizes with ResizeObserver. Updated dashboard widget build with Swiss features.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- NavSphere: dark grey wireframe, Lucide chevron arrows, light grey disc
- ViewerToolbar/NavCube: center offset when floor plan or apps drawer open
- Floor plan: toggle button (no dropdown), title bar with floor selector,
  close button matches dashboard, mutual exclusion with apps drawer
- App icons: green highlight when selected, toggle to close
- Company/Project/Model data layer: IndexedDB + OPFS storage,
  ProjectRepository with IndexedDBBackend, ProjectFileStore for model files
- ProjectAdmin dialog: Companies/Projects/Models tabs with full CRUD
- Model version control: add models from local, V1/V2/V3 history in OPFS,
  load any version in viewer via OPFS cache + DnD flow
- ProjectSelector breadcrumb in TopBar with reload button
- MessageChannel extensions: getProjectContext, loadAppData, saveAppData
- Settings icon in TopBar for project management

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Internal analysis docs (xeokit, architecture) should not be public.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- GH Pages: hostname-based detection, fix asset paths, fix model fetch URL
- Remove CNAME (upstream domain), fix 404.html SPA redirect
- Seed data: export to repo (Save to Repository button), import on startup
- Project model files in public/projects/ (Seestrasse, Schependomlaan)
- Model view state: save/restore camera position per model
- Sun compass + elevation slider + rotation in ViewerToolbar
- Room detection modules, design specs

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- TopBar + ViewerToolbar visible on mobile (hide build version, adjust padding)
- Settings icon + Save view icon: localhost-only
- Seed import: re-import when DB is empty, dedupe companies by name

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- 3 themes (Green/Yello/Blue) × light/dark modes with CSS custom properties
- Theme picker in Settings panel (Style tab) with light/dark toggle
- Settings panel: right-side overlay (50vw) replacing popup dialog
- Section planes: inline sub-bar in ViewerToolbar with draggable X/Y/Z handles
- CutPlaneGizmo uses theme primary color, renderer-based clipping (Conway-compatible)
- All icon colors use var(--color-text), active states use var(--color-primary)
- MUI Tab/IconButton/ToggleButton overrides use CSS vars
- Standardized font sizes: 13px body, 11px captions
- Body background follows theme

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Left nav: instant expand via DOM manipulation (no React re-render)
- Left nav: clickable text labels, springy icon hover animations
- Left nav: removed bldrs logo (moved to TopBar)
- TopBar: bldrs logo left-aligned over nav column, app icons moved left
  with separator after project selector, removed separator before floor plan
- Build version moved to bottom-left of viewer pane
- MUI IconButton/ToggleButton: global hover scale(1.12) animation
- Standardized font sizes across all admin components (13px/11px)
- Section plane gizmo uses theme primary color
- GlbClipper: renderer-based clipping for Conway compatibility
- Section planes: inline sub-bar with draggable X/Y/Z handles
- Created 22 GitHub issues for feature backlog

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Element filter toolbar: type + storey chips with toggle visibility
- Search moved from left nav to viewer toolbar with inline results
- Floor plan cleanup: exit properly when Settings/apps open
- NavCube arrows: dark grey matching sphere wireframe
- Panels mutually exclusive (Settings/FloorPlan/Apps)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Google Drive browser: sign in with Google, browse folders, select IFC files
- Google sign-in gate: full-screen prompt when opening shared /v/g/ links
- OAuth token persisted in sessionStorage for page reload survival
- Download private Drive files with OAuth token, load via OPFS/DnD flow
- .env auto-loader in esbuild defines (no manual source needed)
- COOP: same-origin-allow-popups (allows Google OAuth popup)
- COEP: credentialless (allows cross-origin resources)
- Fix esbuild parse() for values starting with digits (Client ID)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@netlify
Copy link

netlify bot commented Mar 24, 2026

👷 Deploy request for bldrs-share-dev pending review.

Visit the deploys page to approve it

Name Link
🔨 Latest commit 172313b

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant