From 3dbdc79b54c7126e9e9c5f9b8730bef00019c765 Mon Sep 17 00:00:00 2001
From: Peisong Xiao <peisong.xiao.xps@gmail.com>
Date: Sat, 17 Jan 2026 15:53:33 -0500
Subject: [PATCH] added move to top button for task presets

---
 .gitignore                          |  1 +
 wwcompanion-extension/manifest.json |  2 +-
 wwcompanion-extension/settings.css  |  9 +-------
 wwcompanion-extension/settings.js   | 32 +++++++++++++++++++++--------
 4 files changed, 27 insertions(+), 17 deletions(-)

diff --git a/.gitignore b/.gitignore
index a3eaf91..510b87c 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,4 @@
 AGENTS.md
 **/*.crx
 **/*.pem
+**/*.zip
diff --git a/wwcompanion-extension/manifest.json b/wwcompanion-extension/manifest.json
index eb63dc3..c0fd612 100644
--- a/wwcompanion-extension/manifest.json
+++ b/wwcompanion-extension/manifest.json
@@ -1,7 +1,7 @@
 {
   "manifest_version": 3,
   "name": "WWCompanion",
-  "version": "0.2.2",
+  "version": "0.2.3",
   "description": "AI companion for WaterlooWorks job postings.",
   "permissions": ["storage", "activeTab"],
   "host_permissions": ["https://waterlooworks.uwaterloo.ca/*"],
diff --git a/wwcompanion-extension/settings.css b/wwcompanion-extension/settings.css
index 9dd8b1d..67ded54 100644
--- a/wwcompanion-extension/settings.css
+++ b/wwcompanion-extension/settings.css
@@ -209,13 +209,6 @@ button:active {
   justify-content: flex-end;
 }
 
-.icon-btn {
-  width: 34px;
-  padding: 6px 0;
-  font-weight: 700;
-  line-height: 1;
-}
-
-.icon-btn.delete {
+.task-actions .delete {
   color: #c0392b;
 }
diff --git a/wwcompanion-extension/settings.js b/wwcompanion-extension/settings.js
index 39f0de1..c382a45 100644
--- a/wwcompanion-extension/settings.js
+++ b/wwcompanion-extension/settings.js
@@ -70,22 +70,28 @@ function buildTaskCard(task) {
 
   const actions = document.createElement("div");
   actions.className = "task-actions";
+  const moveTopBtn = document.createElement("button");
+  moveTopBtn.type = "button";
+  moveTopBtn.className = "ghost move-top";
+  moveTopBtn.textContent = "Top";
+  moveTopBtn.setAttribute("aria-label", "Move task to top");
+  moveTopBtn.setAttribute("title", "Move to top");
   const moveUpBtn = document.createElement("button");
   moveUpBtn.type = "button";
-  moveUpBtn.className = "ghost icon-btn move-up";
-  moveUpBtn.textContent = "↑";
+  moveUpBtn.className = "ghost move-up";
+  moveUpBtn.textContent = "Up";
   moveUpBtn.setAttribute("aria-label", "Move task up");
   moveUpBtn.setAttribute("title", "Move up");
   const moveDownBtn = document.createElement("button");
   moveDownBtn.type = "button";
-  moveDownBtn.className = "ghost icon-btn move-down";
-  moveDownBtn.textContent = "↓";
+  moveDownBtn.className = "ghost move-down";
+  moveDownBtn.textContent = "Down";
   moveDownBtn.setAttribute("aria-label", "Move task down");
   moveDownBtn.setAttribute("title", "Move down");
   const addBelowBtn = document.createElement("button");
   addBelowBtn.type = "button";
-  addBelowBtn.className = "ghost icon-btn add-below";
-  addBelowBtn.textContent = "＋";
+  addBelowBtn.className = "ghost add-below";
+  addBelowBtn.textContent = "Add";
   addBelowBtn.setAttribute("aria-label", "Add task below");
   addBelowBtn.setAttribute("title", "Add below");
   const duplicateBtn = document.createElement("button");
@@ -96,11 +102,18 @@ function buildTaskCard(task) {
   duplicateBtn.setAttribute("title", "Duplicate");
   const deleteBtn = document.createElement("button");
   deleteBtn.type = "button";
-  deleteBtn.className = "ghost icon-btn delete";
-  deleteBtn.textContent = "🗑";
+  deleteBtn.className = "ghost delete";
+  deleteBtn.textContent = "Delete";
   deleteBtn.setAttribute("aria-label", "Delete task");
   deleteBtn.setAttribute("title", "Delete");
 
+  moveTopBtn.addEventListener("click", () => {
+    const first = tasksContainer.firstElementChild;
+    if (!first || first === card) return;
+    tasksContainer.insertBefore(card, first);
+    updateTaskControls();
+  });
+
   moveUpBtn.addEventListener("click", () => {
     const previous = card.previousElementSibling;
     if (!previous) return;
@@ -137,6 +150,7 @@ function buildTaskCard(task) {
     updateTaskControls();
   });
 
+  actions.appendChild(moveTopBtn);
   actions.appendChild(moveUpBtn);
   actions.appendChild(moveDownBtn);
   actions.appendChild(addBelowBtn);
@@ -153,8 +167,10 @@ function buildTaskCard(task) {
 function updateTaskControls() {
   const cards = [...tasksContainer.querySelectorAll(".task-card")];
   cards.forEach((card, index) => {
+    const moveTopBtn = card.querySelector(".move-top");
     const moveUpBtn = card.querySelector(".move-up");
     const moveDownBtn = card.querySelector(".move-down");
+    if (moveTopBtn) moveTopBtn.disabled = index === 0;
     if (moveUpBtn) moveUpBtn.disabled = index === 0;
     if (moveDownBtn) moveDownBtn.disabled = index === cards.length - 1;
   });