Skip to content

[Feature] Support multiple files with tab interface #4

@kom50

Description

@kom50

Summary

Allow users to work on multiple files within the same room.

Requirements

  • Tab bar below header
  • Add new file button (+)
  • Rename file (double-click tab)
  • Close file (x button on tab)
  • Sync file changes across all users
  • Each file has independent language mode
  • Maximum 10 files per room

UI/UX

  • Horizontal scrolling tab bar
  • Active tab highlighted
  • Unsaved indicator (dot) on tab
  • Confirm dialog before closing

Data Structure

{
  roomId: "room-abc123",
  files: [
    { id: "file-1", name: "index.js", language: "javascript", content: "..." },
    { id: "file-2", name: "styles.css", language: "css", content: "..." }
  ],
  activeFile: "file-1"
}

Acceptance Criteria

  • Users can create, rename, delete files
  • Switching tabs shows correct content
  • All users see file changes in real-time
  • File state syncs for new users joining

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions