Add peer-to-peer file transfer in browser mode

Implements both pull (browse & download from a shared folder) and push
(send a file directly to a peer) using the yaw2 file protocol over WebRTC
DataChannels.

- PeerConn: handle browse/files/get/file-offer/file-accept/file-done
  control messages; stream files in 64KB chunks over f:xid binary
  DataChannels; auto-accept incoming offers (push and pull)
- PeerConn.sendFilePush(): initiate an outbound file transfer without
  requiring the peer to browse first
- BrowserAdapter: sharedFiles map, setSharedFiles(), requestBrowse(),
  requestGet(), sendFileTo() — propagates share map to all active peers
- Store: activeFilePeer, setActiveFilePeer, setSharedFiles, browseFiles,
  sendFileTo; file_complete handler triggers browser download automatically
- FileBrowser component: third-column panel listing a peer's shared files
  with name, size, and a download button
- FolderPicker component: webkitdirectory input in the sidebar (browser
  mode only) for selecting a local folder to share
- Sidebar: 📎 send-file button on peer rows (hover) with inline file picker
- App.tsx: use browser mode when WASTE_CONFIG.signalURL is set, even on
  localhost — allows testing browser mode via npm run dev with config.js
- deploy-daemon.sh: kill existing daemon before scp to avoid upload failure
  when the binary is locked; remove duplicate kill block in restart step

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Fredrik Johansson
2026-06-25 20:29:54 +02:00
parent ea66e2eb58
commit 91b7406d01
8 changed files with 317 additions and 18 deletions

View File

@@ -0,0 +1,43 @@
import { useRef, useState } from 'react'
import { useWaste } from '../store'
export function FolderPicker() {
const { setSharedFiles } = useWaste()
const inputRef = useRef<HTMLInputElement>(null)
const [label, setLabel] = useState<string | null>(null)
function onChange(e: React.ChangeEvent<HTMLInputElement>) {
const fileList = e.target.files
if (!fileList || fileList.length === 0) return
const map = new Map<string, File>()
for (let i = 0; i < fileList.length; i++) {
const f = fileList[i]
map.set(f.name, f)
}
setSharedFiles(map)
const first = fileList[0]
const parts = (first.webkitRelativePath || first.name).split('/')
setLabel(`${parts[0]} (${map.size} file${map.size !== 1 ? 's' : ''})`)
}
return (
<div className="folder-picker">
<input
ref={inputRef}
type="file"
// @ts-expect-error webkitdirectory is non-standard
webkitdirectory=""
multiple
style={{ display: 'none' }}
onChange={onChange}
/>
<button
className="folder-picker-btn"
onClick={() => inputRef.current?.click()}
title="Share a folder with peers"
>
{label ?? '+ Share folder'}
</button>
</div>
)
}