cesnimda/Inboxintel
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

feat: folder view — clicking sidebar items shows filtered email list

Browse Source 
- New FolderView page at /app/folder/:slug renders a paginated email table
- Sidebar links now route to their respective folder views
- Extended SearchRequestDto with IsInInbox, IsStarred, IsTrashed, GmailLabel, Category, MinSizeBytes
- SearchService applies the new filters; GmailLabel does a label-id lookup (SENT/DRAFT/SPAM)
- Frontend folderToRequest() maps every slug to the correct search payload
- Email rows show sender, subject+snippet, attachment icon, size, date; bold for unread
- Pagination controls for large folders

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
cesnimda
2026-06-30 19:59:01 +02:00
parent ca02f40841
commit 20d51b2c15
6 changed files with 218 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/styles.css
+29
View File
@@ -200,6 +200,35 @@ input, select { background: var(--panel-2); border: 1px solid #2c3550; color: va
.closing h2 { font-size: 28px; margin-bottom: 18px; }
.landing-footer { display: flex; align-items: center; gap: 12px; justify-content: center; margin-top: 40px; padding-top: 20px; border-top: 1px solid #2c3550; }
/* ── Folder view ── */
.folder-view { max-width: 960px; }
.folder-view-head { display: flex; align-items: baseline; gap: 12px; margin-bottom: 16px; }
.folder-view-title { margin: 0; font-size: 20px; font-weight: 700; }
.folder-view-count { color: var(--muted); font-size: 13px; }
.fv-loading, .fv-empty { color: var(--muted); font-size: 14px; padding: 32px 0; }
.fv-error { color: var(--danger); font-size: 14px; padding: 12px 0; }
.email-list { width: 100%; border-collapse: collapse; font-size: 13px; }
.email-row { border-bottom: 1px solid #2c3550; cursor: default; }
.email-row:hover { background: var(--panel); }
.email-row--unread .el-sender,
.email-row--unread .el-subj-text { font-weight: 700; color: var(--text); }
.el-unread { width: 14px; padding: 10px 4px 10px 0; }
.unread-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); }
.el-sender { width: 180px; padding: 10px 12px 10px 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--muted); }
.el-subject { padding: 10px 8px; overflow: hidden; }
.el-subj-text { color: var(--text); }
.el-snippet { color: var(--muted); }
.el-meta { width: 80px; padding: 10px 8px; text-align: right; white-space: nowrap; }
.el-attach { margin-right: 4px; font-size: 12px; }
.el-size { font-size: 11px; color: var(--muted); }
.el-date { width: 70px; padding: 10px 0 10px 8px; text-align: right; color: var(--muted); white-space: nowrap; font-size: 12px; }
.fv-pagination { display: flex; align-items: center; gap: 14px; margin-top: 16px; font-size: 13px; color: var(--muted); }
.fv-pagination button { background: var(--panel); border: 1px solid #2c3550; color: var(--text); padding: 6px 12px; }
.fv-pagination button:disabled { opacity: 0.35; cursor: default; }
/* ── Sync splash ── */
.splash {
position: fixed; inset: 0; z-index: 1000;