CodeForPhilly / CodeForPhilly/balancer-main

[Insighy extractor] Feature: Resizable Right-Hand Panel

Open
#375 0 comments 0 reactions 0 assignees View on GitHub
Good for newcomers
Dominant language
TypeScript
Stars
21
Forks
19
PR merge metrics
No merged PRs in 30d

Description

### 🎨 Feature: Resizable Right-Hand Panel

**User Story**
As a user, I want to be able to drag and resize the right-hand panel (chat/insights panel) so I can adjust how much space the PDF vs. the chat takes up, depending on my workflow.

---

### 📝 Current Behavior
- The right-hand panel has a fixed width.
- Users cannot resize it.
- On smaller screens, the panel can take up too much space or not enough.

---

### 🎯 Expected Behavior
- Right-hand panel should be **resizable by dragging its left border**.
- Default size remains as it is now.
- Users can drag to make it wider or narrower.
- The PDF/content area should automatically adjust to fill the remaining space.
- The chosen width should persist during the session (optional: save in local storage for user preference).

---

### ✅ Acceptance Criteria
- [ ] User can click and drag the divider between PDF and chat panel.
- [ ] Panel smoothly resizes without breaking layout.
- [ ] Panel width stays within sensible min/max limits (e.g., min 250px, max 50% of screen).
- [ ] Resizing works across all supported browsers.
- [ ] Resizing works across different screen sizes (desktop, tablet).
- [ ] (Optional) Width preference persists per user session.

---

### 🔨 Task Breakdown
- [ ] **Frontend**
- Add draggable divider between PDF viewer and chat panel.
- Implement resize logic with min/max constraints.
- Update layout to re-render dynamically as width changes.
- (Optional) Save width to local storage and reload on next visit.

Image

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.