devsyncwrld/backspace
1
0
Fork 0
Code Issues Pull Requests Actions 31 Packages Projects Releases Wiki Activity

feat: Electron screen share picker, instance selector, and system audio loopback

Browse Source 
- Custom screen share picker for Electron (ScreenSharePicker.tsx) with
  Aether Drift design: glass-bubble footer, adaptive grid, pill tabs,
  border-based selection (avoids overflow clipping), hover brightness
- Instance URL picker so Electron connects to any Backspace server
- System audio loopback on Windows/Linux via desktopCapturer callback
- macOS: video-only callback (OS blocks system audio capture)
- IPC bridge for screen source enumeration and selection
- Purge stale service worker caches on Electron launch
This commit is contained in:
Jannis Braun
2026-03-16 03:50:07 +01:00
parent 8ae3ffc912
commit 95ec3ff952
20 changed files with 1042 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/web/src/components/JoinPage.tsx
+3 -3
View File
@@ -197,7 +197,7 @@ export function JoinPage() {
// Loading state
if (isLoadingPreview) {
return (
<div className="min-h-screen flex items-center justify-center bg-surface-base relative">
<div className="min-h-full flex items-center justify-center bg-surface-base relative">
<div className="absolute inset-0 bg-[radial-gradient(ellipse_at_top,rgba(124,108,246,0.06)_0%,transparent_50%)]" />
<div className="text-center relative z-10">
<svg className="animate-spin w-10 h-10 text-accent-primary mx-auto mb-4" viewBox="0 0 24 24" fill="none">
@@ -213,7 +213,7 @@ export function JoinPage() {
// Error state — invalid/expired invite
if (previewError || !preview) {
return (
<div className="min-h-screen flex items-center justify-center bg-surface-base relative">
<div className="min-h-full flex items-center justify-center bg-surface-base relative">
<div className="absolute inset-0 bg-[radial-gradient(ellipse_at_top,rgba(124,108,246,0.06)_0%,transparent_50%)]" />
<div className="w-full max-w-[480px] bg-surface-elevated rounded-md p-8 shadow-elevation-high relative z-10 text-center">
<div className="w-16 h-16 mx-auto mb-4 rounded-full bg-accent-rose/10 flex items-center justify-center">
@@ -247,7 +247,7 @@ export function JoinPage() {
// Main invite page
return (
<div className="min-h-screen flex items-center justify-center bg-surface-base relative">
<div className="min-h-full flex items-center justify-center bg-surface-base relative">
<div className="absolute inset-0 bg-[radial-gradient(ellipse_at_top,rgba(124,108,246,0.06)_0%,transparent_50%)]" />
<div className="w-full max-w-[480px] bg-surface-elevated rounded-md p-8 shadow-elevation-high relative z-10">
{/* Space preview */}