update issue assignee full implementation

This commit is contained in:
Oliver Bryan
2026-01-06 15:51:32 +00:00
parent b7a53d2d8a
commit 610cd4199b
7 changed files with 166 additions and 13 deletions

View File

@@ -41,7 +41,10 @@ export async function deleteIssue(id: number) {
return await db.delete(Issue).where(eq(Issue.id, id));
}
export async function updateIssue(id: number, updates: { title?: string; description?: string }) {
export async function updateIssue(
id: number,
updates: { title?: string; description?: string; assigneeId?: number | null },
) {
return await db.update(Issue).set(updates).where(eq(Issue.id, id)).returning();
}

View File

@@ -1,7 +1,8 @@
import type { BunRequest } from "bun";
import { updateIssue } from "../../db/queries";
// /issue/update?id=1&title=Testing&description=Description
// /issue/update?id=1&title=Testing&description=Description&assigneeId=2
// assigneeId can be "null" to unassign
export default async function issueUpdate(req: BunRequest) {
const url = new URL(req.url);
const id = url.searchParams.get("id");
@@ -11,13 +12,24 @@ export default async function issueUpdate(req: BunRequest) {
const title = url.searchParams.get("title") || undefined;
const description = url.searchParams.get("description") || undefined;
if (!title && !description) {
const assigneeIdParam = url.searchParams.get("assigneeId");
// Parse assigneeId: "null" means unassign, number means assign, undefined means no change
let assigneeId: number | null | undefined;
if (assigneeIdParam === "null") {
assigneeId = null;
} else if (assigneeIdParam) {
assigneeId = Number(assigneeIdParam);
}
if (!title && !description && assigneeId === undefined) {
return new Response("no updates provided", { status: 400 });
}
const issue = await updateIssue(Number(id), {
title,
description,
assigneeId,
});
return Response.json(issue);

View File

@@ -278,7 +278,7 @@ function Index() {
</ResizablePanel>
{/* issue detail pane */}
{selectedIssue && (
{selectedIssue && selectedOrganisation && (
<>
<ResizableSeparator />
<ResizablePanel
@@ -291,7 +291,9 @@ function Index() {
<IssueDetailPane
project={selectedProject}
issueData={selectedIssue}
organisationId={selectedOrganisation.Organisation.id}
close={() => setSelectedIssue(null)}
onIssueUpdate={refetchIssues}
/>
</div>
</ResizablePanel>

View File

@@ -1,18 +1,64 @@
import type { IssueResponse, ProjectResponse } from "@issue/shared";
import type { IssueResponse, OrganisationMemberResponse, ProjectResponse } from "@issue/shared";
import { X } from "lucide-react";
import { useEffect, useState } from "react";
import Avatar from "@/components/avatar";
import SmallUserDisplay from "@/components/small-user-display";
import { Button } from "@/components/ui/button";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
import { issue, organisation } from "@/lib/server";
import { issueID } from "@/lib/utils";
export function IssueDetailPane({
project,
issueData,
organisationId,
close,
onIssueUpdate,
}: {
project: ProjectResponse;
issueData: IssueResponse;
organisationId: number;
close: () => void;
onIssueUpdate?: () => void;
}) {
const [members, setMembers] = useState<OrganisationMemberResponse[]>([]);
const [assigneeId, setAssigneeId] = useState<string>(
issueData.Issue.assigneeId?.toString() ?? "unassigned",
);
useEffect(() => {
setAssigneeId(issueData.Issue.assigneeId?.toString() ?? "unassigned");
}, [issueData.Issue.assigneeId]);
useEffect(() => {
organisation.members({
organisationId,
onSuccess: (data) => {
setMembers(data);
},
onError: (error) => {
console.error("error fetching members:", error);
},
});
}, [organisationId]);
const handleAssigneeChange = async (value: string) => {
setAssigneeId(value);
const newAssigneeId = value === "unassigned" ? null : Number(value);
await issue.update({
issueId: issueData.Issue.id,
assigneeId: newAssigneeId,
onSuccess: () => {
onIssueUpdate?.();
},
onError: (error) => {
console.error("error updating assignee:", error);
setAssigneeId(issueData.Issue.assigneeId?.toString() ?? "unassigned");
},
});
};
return (
<div className="flex flex-col">
<div className="flex flex-row items-center justify-end border-b h-[25px]">
@@ -31,12 +77,67 @@ export function IssueDetailPane({
<h1 className="text-md">{issueData.Issue.title}</h1>
<p className="text-sm">{issueData.Issue.description}</p>
{issueData.Assignee && (
<div className="flex items-center gap-2">
Assignee:
<SmallUserDisplay user={issueData.Assignee} />
</div>
)}
<div className="flex items-center gap-2">
<span className="text-sm">Assignee:</span>
<Select value={assigneeId} onValueChange={handleAssigneeChange}>
<SelectTrigger size="sm" className="w-fit">
<SelectValue placeholder="Select assignee">
{assigneeId === "unassigned"
? "Unassigned"
: (() => {
const member = members.find(
(m) => m.User.id.toString() === assigneeId,
);
if (member) {
return (
<>
<Avatar
name={member.User.name}
username={member.User.username}
avatarURL={member.User.avatarURL}
textClass="text-xs"
/>
{member.User.name}
</>
);
}
if (issueData.Assignee) {
return (
<>
<Avatar
name={issueData.Assignee.name}
username={issueData.Assignee.username}
avatarURL={issueData.Assignee.avatarURL}
textClass="text-xs"
/>
{issueData.Assignee.name}
</>
);
}
return null;
})()}
</SelectValue>
</SelectTrigger>
<SelectContent
side="bottom"
position="popper"
className={"data-[side=bottom]:translate-y-1 data-[side=bottom]:translate-x-0.25"}
>
<SelectItem value="unassigned">Unassigned</SelectItem>
{members.map((member) => (
<SelectItem key={member.User.id} value={member.User.id.toString()}>
<Avatar
name={member.User.name}
username={member.User.username}
avatarURL={member.User.avatarURL}
textClass="text-xs"
/>
{member.User.name}
</SelectItem>
))}
</SelectContent>
</Select>
</div>
</div>
<div className="flex items-center gap-2 px-2 py-1 border-t text-sm text-muted-foreground">

View File

@@ -1,2 +1,3 @@
export { byProject } from "@/lib/server/issue/byProject";
export { create } from "@/lib/server/issue/create";
export { update } from "@/lib/server/issue/update";

View File

@@ -0,0 +1,36 @@
import { getAuthHeaders, getServerURL } from "@/lib/utils";
import type { ServerQueryInput } from "..";
export async function update({
issueId,
title,
description,
assigneeId,
onSuccess,
onError,
}: {
issueId: number;
title?: string;
description?: string;
assigneeId?: number | null;
} & ServerQueryInput) {
const url = new URL(`${getServerURL()}/issue/update`);
url.searchParams.set("id", `${issueId}`);
if (title !== undefined) url.searchParams.set("title", title);
if (description !== undefined) url.searchParams.set("description", description);
if (assigneeId !== undefined) {
url.searchParams.set("assigneeId", assigneeId === null ? "null" : `${assigneeId}`);
}
const res = await fetch(url.toString(), {
headers: getAuthHeaders(),
});
if (!res.ok) {
const error = await res.text();
onError?.(error || `failed to update issue (${res.status})`);
} else {
const data = await res.json();
onSuccess?.(data, res);
}
}