From d038116de57873ba7bfbb237d95c7da21807d8f0 Mon Sep 17 00:00:00 2001
From: khannurien <yo@vincentlannurien.com>
Date: Sun, 21 Jun 2026 19:37:47 +0000
Subject: [PATCH] v3: allow users to edit dump thumbnail, fixed some linter
 errors in the frontend

---
 api/services/follow-service.ts   |  2 +-
 api/services/playlist-service.ts |  2 +-
 src/App.css                      | 17 +++++++++++++++++
 src/components/CommentThread.tsx | 24 +++++++++++++-----------
 4 files changed, 32 insertions(+), 13 deletions(-)

diff --git a/api/services/follow-service.ts b/api/services/follow-service.ts
index 7a29dc3..550a0e9 100644
--- a/api/services/follow-service.ts
+++ b/api/services/follow-service.ts
@@ -24,7 +24,7 @@ import {
 // Mirrors dump-service SELECT_COLS_ALIASED — kept local to avoid circular imports
 const SELECT_COLS_ALIASED =
   "d.id, d.kind, d.title, d.slug, d.comment, d.user_id, d.created_at, d.updated_at, d.url, d.rich_content, " +
-  "d.file_name, d.file_mime, d.file_size, d.vote_count, d.is_private," +
+  "d.file_name, d.file_mime, d.file_size, d.vote_count, d.is_private, d.custom_thumbnail_mime," +
   " (SELECT COUNT(*) FROM comments WHERE dump_id = d.id AND deleted = 0) as comment_count";
 
 // ── Follow / unfollow a user ──────────────────────────────────────────────────
diff --git a/api/services/playlist-service.ts b/api/services/playlist-service.ts
index fc344f3..6bf46cc 100644
--- a/api/services/playlist-service.ts
+++ b/api/services/playlist-service.ts
@@ -29,7 +29,7 @@ import { makeSlug, UUID_RE } from "../lib/slugify.ts";
 import { linkAttachments } from "./attachment-service.ts";
 
 const DUMP_SELECT_COLS =
-  "id, kind, title, slug, comment, user_id, created_at, updated_at, url, rich_content, file_name, file_mime, file_size, vote_count, is_private";
+  "id, kind, title, slug, comment, user_id, created_at, updated_at, url, rich_content, file_name, file_mime, file_size, vote_count, is_private, custom_thumbnail_mime";
 
 const PLAYLIST_SELECT = `p.*, u.username as owner_username,
    (SELECT COUNT(*) FROM playlist_dumps pd WHERE pd.playlist_id = p.id) as dump_count
diff --git a/src/App.css b/src/App.css
index 63ed939..1b52107 100644
--- a/src/App.css
+++ b/src/App.css
@@ -3753,6 +3753,23 @@ body.has-player .fab-new {
   cursor: default;
 }
 
+.comment-cancel-btn {
+  background: transparent;
+  border: 1.5px solid var(--color-border-subtle);
+  border-radius: 6px;
+  padding: 0.4rem 1rem;
+  font-family: inherit;
+  font-size: 0.82rem;
+  color: var(--color-text);
+  opacity: 0.6;
+  cursor: pointer;
+  transition: opacity 0.15s;
+}
+
+.comment-cancel-btn:hover {
+  opacity: 1;
+}
+
 .comment-node-inner--deleted {
   opacity: 0.35;
 }
diff --git a/src/components/CommentThread.tsx b/src/components/CommentThread.tsx
index 1963601..8851c5b 100644
--- a/src/components/CommentThread.tsx
+++ b/src/components/CommentThread.tsx
@@ -276,7 +276,7 @@ function CommentNode({
                   </button>
                   <button
                     type="button"
-                    className="comment-action-btn"
+                    className="comment-cancel-btn"
                     onClick={() => {
                       setEditOpen(false);
                       setEditBody("");
@@ -290,14 +290,16 @@ function CommentNode({
             )
             : <Markdown className="comment-body">{comment.body}</Markdown>}
           <div className="comment-actions">
-            <LikeButton
-              commentId={comment.id}
-              count={likeCounts[comment.id] ?? comment.likeCount}
-              liked={myLikes.has(comment.id)}
-              disabled={!currentUser}
-              onLike={castCommentLike}
-              onUnlike={removeCommentLike}
-            />
+            {!editOpen && (
+              <LikeButton
+                commentId={comment.id}
+                count={likeCounts[comment.id] ?? comment.likeCount}
+                liked={myLikes.has(comment.id)}
+                disabled={!currentUser}
+                onLike={castCommentLike}
+                onUnlike={removeCommentLike}
+              />
+            )}
             {currentUser && !editOpen && (
               <button
                 type="button"
@@ -376,7 +378,7 @@ function CommentNode({
                 </button>
                 <button
                   type="button"
-                  className="comment-action-btn"
+                  className="comment-cancel-btn"
                   onClick={() => {
                     setReplyOpen(false);
                     setReplyBody("");
@@ -514,7 +516,7 @@ export function CommentThread({
                 {topLevelBody.trim() && (
                   <button
                     type="button"
-                    className="comment-action-btn"
+                    className="comment-cancel-btn"
                     onClick={() => {
                       setTopLevelBody("");
                       setTopLevelError(null);