jat-feedback 2.0.1 → 3.0.1

package/package.json

@@ -1,13 +1,14 @@
 {
   "name": "jat-feedback",
-  "version": "2.0.1",
+  "version": "3.0.1",
   "description": "Embeddable feedback widget for bug reports and feature requests. Captures screenshots, console logs, and user context as a web component.",
   "type": "module",
   "main": "dist/jat-feedback.js",
   "module": "dist/jat-feedback.mjs",
   "files": [
     "dist",
-    "supabase"
+    "supabase",
+    "routes"
   ],
   "scripts": {
     "dev": "vite build --watch",

package/routes/README.md

@@ -0,0 +1,45 @@
+# Route Templates
+
+Drop-in SvelteKit route templates for customer-facing task management UI.
+
+## /tasks — Task List & Detail
+
+A customer-facing page that reads from the `project_tasks` Supabase table. Shows tasks with filtering, detail drawer, and comment thread.
+
+### Prerequisites
+
+- jat-feedback v3.0.0+ with `3.0.0_rename_to_project_tasks.sql` migration applied
+- SvelteKit app with Supabase SSR auth (parent layout provides `data.supabase`)
+- DaisyUI + Tailwind CSS v4
+
+### Installation
+
+Copy the route into your SvelteKit app:
+
+```bash
+cp -r node_modules/jat-feedback/routes/tasks/ src/routes/(admin)/account/tasks/
+```
+
+Adjust the destination path to match your route structure. The route must be nested under a layout that:
+1. Creates a Supabase browser client and passes it as `data.supabase`
+2. Handles auth redirects (the page has a fallback redirect to `/login`)
+3. Passes `data.user` with at least an `email` field
+
+### Features
+
+- **Server-side loading** from `project_tasks` via Supabase RLS
+- **URL-based filters** for status, type, and priority
+- **Task detail drawer** with full description, metadata, and labels
+- **Comment thread** with real-time submission (Ctrl+Enter shortcut)
+- **Mobile responsive** — table on desktop, cards on mobile
+- **Status badges** with color coding
+- **Screenshot display** from feedback-captured images
+
+### Customization
+
+The route uses standard DaisyUI classes and inherits your theme. Common customizations:
+
+- **Change redirect path**: Edit the `redirect(303, "/login")` in `+page.server.ts`
+- **Add more statuses**: Edit `statusOptions` array in `+page.svelte`
+- **Customize columns**: Modify the table `<thead>` and `<tbody>` cells
+- **Restrict by source**: Add `.eq("source", "feedback")` to the server query

package/routes/tasks/+page.server.ts

@@ -0,0 +1,55 @@
+import { redirect } from "@sveltejs/kit"
+import type { PageServerLoad } from "./$types"
+
+export const load: PageServerLoad = async ({
+  locals: { supabase, safeGetSession },
+  url,
+}) => {
+  const { user } = await safeGetSession()
+  if (!user) {
+    redirect(303, "/login")
+  }
+
+  // Read filters from URL search params
+  const status = url.searchParams.get("status") || ""
+  const issueType = url.searchParams.get("type") || ""
+  const priority = url.searchParams.get("priority") || ""
+
+  // Build query — RLS ensures users only see their own tasks
+  let query = supabase
+    .from("project_tasks")
+    .select("*, project_tasks_comments(count)")
+    .order("created_at", { ascending: false })
+
+  if (status) {
+    query = query.eq("status", status)
+  }
+  if (issueType) {
+    query = query.eq("issue_type", issueType)
+  }
+  if (priority) {
+    query = query.eq("priority", priority)
+  }
+
+  // Fetch tasks and team members in parallel
+  // NOTE: Customize the role filter for your project's profile roles
+  const [tasksResult, teamResult] = await Promise.all([
+    query.limit(100),
+    supabase
+      .from("profiles")
+      .select("id, full_name, role")
+      .not("full_name", "is", null)
+      .order("full_name"),
+  ])
+
+  if (tasksResult.error) {
+    console.error("Failed to load tasks:", tasksResult.error.message)
+  }
+
+  return {
+    tasks: tasksResult.data ?? [],
+    teamMembers: teamResult.data ?? [],
+    filters: { status, issueType, priority },
+    user,
+  }
+}