Add dashboard activity feed and project member role editing

This commit is contained in:
Abhimanyu Saharan
2026-02-01 23:51:40 +05:30
parent f0e065abcd
commit 7efe2429ed
6 changed files with 346 additions and 52 deletions

View File

@@ -64,7 +64,7 @@ def add_project_member(project_id: int, payload: ProjectMember, session: Session
entity_type="project_member",
entity_id=member.id,
verb="added",
payload={"project_id": project_id, "employee_id": member.employee_id},
payload={"project_id": project_id, "employee_id": member.employee_id, "role": member.role},
)
session.commit()
return member
@@ -87,3 +87,27 @@ def remove_project_member(project_id: int, member_id: int, session: Session = De
)
session.commit()
return {"ok": True}
@router.patch("/{project_id}/members/{member_id}", response_model=ProjectMember)
def update_project_member(project_id: int, member_id: int, payload: ProjectMember, session: Session = Depends(get_session)):
member = session.get(ProjectMember, member_id)
if not member or member.project_id != project_id:
raise HTTPException(status_code=404, detail="Project member not found")
if payload.role is not None:
member.role = payload.role
session.add(member)
session.commit()
session.refresh(member)
log_activity(
session,
actor_employee_id=None,
entity_type="project_member",
entity_id=member.id,
verb="updated",
payload={"project_id": project_id, "role": member.role},
)
session.commit()
return member

View File

@@ -960,3 +960,162 @@ export const useRemoveProjectMemberProjectsProjectIdMembersMemberIdDelete = <
queryClient,
);
};
/**
* @summary Update Project Member
*/
export type updateProjectMemberProjectsProjectIdMembersMemberIdPatchResponse200 =
{
data: ProjectMember;
status: 200;
};
export type updateProjectMemberProjectsProjectIdMembersMemberIdPatchResponse422 =
{
data: HTTPValidationError;
status: 422;
};
export type updateProjectMemberProjectsProjectIdMembersMemberIdPatchResponseSuccess =
updateProjectMemberProjectsProjectIdMembersMemberIdPatchResponse200 & {
headers: Headers;
};
export type updateProjectMemberProjectsProjectIdMembersMemberIdPatchResponseError =
updateProjectMemberProjectsProjectIdMembersMemberIdPatchResponse422 & {
headers: Headers;
};
export type updateProjectMemberProjectsProjectIdMembersMemberIdPatchResponse =
| updateProjectMemberProjectsProjectIdMembersMemberIdPatchResponseSuccess
| updateProjectMemberProjectsProjectIdMembersMemberIdPatchResponseError;
export const getUpdateProjectMemberProjectsProjectIdMembersMemberIdPatchUrl = (
projectId: number,
memberId: number,
) => {
return `/projects/${projectId}/members/${memberId}`;
};
export const updateProjectMemberProjectsProjectIdMembersMemberIdPatch = async (
projectId: number,
memberId: number,
projectMember: ProjectMember,
options?: RequestInit,
): Promise<updateProjectMemberProjectsProjectIdMembersMemberIdPatchResponse> => {
return customFetch<updateProjectMemberProjectsProjectIdMembersMemberIdPatchResponse>(
getUpdateProjectMemberProjectsProjectIdMembersMemberIdPatchUrl(
projectId,
memberId,
),
{
...options,
method: "PATCH",
headers: { "Content-Type": "application/json", ...options?.headers },
body: JSON.stringify(projectMember),
},
);
};
export const getUpdateProjectMemberProjectsProjectIdMembersMemberIdPatchMutationOptions =
<TError = HTTPValidationError, TContext = unknown>(options?: {
mutation?: UseMutationOptions<
Awaited<
ReturnType<
typeof updateProjectMemberProjectsProjectIdMembersMemberIdPatch
>
>,
TError,
{ projectId: number; memberId: number; data: ProjectMember },
TContext
>;
request?: SecondParameter<typeof customFetch>;
}): UseMutationOptions<
Awaited<
ReturnType<
typeof updateProjectMemberProjectsProjectIdMembersMemberIdPatch
>
>,
TError,
{ projectId: number; memberId: number; data: ProjectMember },
TContext
> => {
const mutationKey = [
"updateProjectMemberProjectsProjectIdMembersMemberIdPatch",
];
const { mutation: mutationOptions, request: requestOptions } = options
? options.mutation &&
"mutationKey" in options.mutation &&
options.mutation.mutationKey
? options
: { ...options, mutation: { ...options.mutation, mutationKey } }
: { mutation: { mutationKey }, request: undefined };
const mutationFn: MutationFunction<
Awaited<
ReturnType<
typeof updateProjectMemberProjectsProjectIdMembersMemberIdPatch
>
>,
{ projectId: number; memberId: number; data: ProjectMember }
> = (props) => {
const { projectId, memberId, data } = props ?? {};
return updateProjectMemberProjectsProjectIdMembersMemberIdPatch(
projectId,
memberId,
data,
requestOptions,
);
};
return { mutationFn, ...mutationOptions };
};
export type UpdateProjectMemberProjectsProjectIdMembersMemberIdPatchMutationResult =
NonNullable<
Awaited<
ReturnType<
typeof updateProjectMemberProjectsProjectIdMembersMemberIdPatch
>
>
>;
export type UpdateProjectMemberProjectsProjectIdMembersMemberIdPatchMutationBody =
ProjectMember;
export type UpdateProjectMemberProjectsProjectIdMembersMemberIdPatchMutationError =
HTTPValidationError;
/**
* @summary Update Project Member
*/
export const useUpdateProjectMemberProjectsProjectIdMembersMemberIdPatch = <
TError = HTTPValidationError,
TContext = unknown,
>(
options?: {
mutation?: UseMutationOptions<
Awaited<
ReturnType<
typeof updateProjectMemberProjectsProjectIdMembersMemberIdPatch
>
>,
TError,
{ projectId: number; memberId: number; data: ProjectMember },
TContext
>;
request?: SecondParameter<typeof customFetch>;
},
queryClient?: QueryClient,
): UseMutationResult<
Awaited<
ReturnType<typeof updateProjectMemberProjectsProjectIdMembersMemberIdPatch>
>,
TError,
{ projectId: number; memberId: number; data: ProjectMember },
TContext
> => {
return useMutation(
getUpdateProjectMemberProjectsProjectIdMembersMemberIdPatchMutationOptions(
options,
),
queryClient,
);
};

View File

@@ -1,66 +1,165 @@
"use client";
import { useState } from "react";
import { Button } from "@/components/ui/button";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
import { Input } from "@/components/ui/input";
import { Select } from "@/components/ui/select";
import { useListProjectsProjectsGet } from "@/api/generated/projects/projects";
import { useCreateProjectProjectsPost, useListProjectsProjectsGet } from "@/api/generated/projects/projects";
import { useCreateDepartmentDepartmentsPost, useListDepartmentsDepartmentsGet } from "@/api/generated/org/org";
import { useCreateEmployeeEmployeesPost, useListEmployeesEmployeesGet } from "@/api/generated/org/org";
import { useListActivitiesActivitiesGet } from "@/api/generated/activities/activities";
export default function Home() {
const projects = useListProjectsProjectsGet();
const departments = useListDepartmentsDepartmentsGet();
const employees = useListEmployeesEmployeesGet();
const activities = useListActivitiesActivitiesGet({ limit: 20 });
const [projectName, setProjectName] = useState("");
const [deptName, setDeptName] = useState("");
const [personName, setPersonName] = useState("");
const [personType, setPersonType] = useState<"human" | "agent">("human");
const createProject = useCreateProjectProjectsPost({
mutation: { onSuccess: () => { setProjectName(""); projects.refetch(); } },
});
const createDepartment = useCreateDepartmentDepartmentsPost({
mutation: { onSuccess: () => { setDeptName(""); departments.refetch(); } },
});
const createEmployee = useCreateEmployeeEmployeesPost({
mutation: { onSuccess: () => { setPersonName(""); employees.refetch(); } },
});
return (
<main className="mx-auto max-w-5xl p-6">
<main className="mx-auto max-w-6xl p-6">
<div className="flex items-start justify-between gap-4">
<div>
<h1 className="text-3xl font-semibold tracking-tight">Company Mission Control</h1>
<p className="mt-2 text-sm text-muted-foreground">
Orval-generated client + React Query + shadcn-style components.
Dashboard overview + quick create. No-auth v1.
</p>
</div>
<Button variant="outline" onClick={() => projects.refetch()} disabled={projects.isFetching}>
<Button variant="outline" onClick={() => { projects.refetch(); departments.refetch(); employees.refetch(); activities.refetch(); }}>
Refresh
</Button>
</div>
<div className="mt-6 grid gap-4 sm:grid-cols-2">
<div className="mt-6 grid gap-4 lg:grid-cols-3">
<Card>
<CardHeader>
<CardTitle>Projects</CardTitle>
<CardDescription>GET /projects</CardDescription>
<CardTitle>Quick create project</CardTitle>
<CardDescription>Projects drive all tasks</CardDescription>
</CardHeader>
<CardContent>
{projects.isLoading ? <div className="text-sm text-muted-foreground">Loading</div> : null}
{projects.error ? (
<div className="text-sm text-destructive">{(projects.error as Error).message}</div>
) : null}
{!projects.isLoading && !projects.error ? (
<ul className="space-y-2">
{projects.data?.map((p) => (
<li key={p.id ?? p.name} className="flex items-center justify-between rounded-md border p-3">
<div className="font-medium">{p.name}</div>
<div className="text-xs text-muted-foreground">{p.status}</div>
</li>
))}
{(projects.data?.length ?? 0) === 0 ? (
<li className="text-sm text-muted-foreground">No projects yet.</li>
) : null}
</ul>
) : null}
<CardContent className="space-y-3">
<Input placeholder="Project name" value={projectName} onChange={(e) => setProjectName(e.target.value)} />
<Button
onClick={() => createProject.mutate({ data: { name: projectName, status: "active" } })}
disabled={!projectName.trim() || createProject.isPending}
>
Create
</Button>
</CardContent>
</Card>
<Card>
<CardHeader>
<CardTitle>API</CardTitle>
<CardDescription>Docs & health</CardDescription>
<CardTitle>Quick create department</CardTitle>
<CardDescription>Organization structure</CardDescription>
</CardHeader>
<CardContent className="space-y-2 text-sm">
<div>
<span className="text-muted-foreground">Docs:</span> <code className="ml-2">/docs</code>
</div>
<div className="text-muted-foreground">
Set <code>NEXT_PUBLIC_API_URL</code> in <code>.env.local</code> (example: http://192.168.1.101:8000).
<CardContent className="space-y-3">
<Input placeholder="Department name" value={deptName} onChange={(e) => setDeptName(e.target.value)} />
<Button
onClick={() => createDepartment.mutate({ data: { name: deptName } })}
disabled={!deptName.trim() || createDepartment.isPending}
>
Create
</Button>
</CardContent>
</Card>
<Card>
<CardHeader>
<CardTitle>Quick add person</CardTitle>
<CardDescription>Employees & agents</CardDescription>
</CardHeader>
<CardContent className="space-y-3">
<Input placeholder="Name" value={personName} onChange={(e) => setPersonName(e.target.value)} />
<Select value={personType} onChange={(e) => setPersonType(e.target.value === "agent" ? "agent" : "human")}
>
<option value="human">human</option>
<option value="agent">agent</option>
</Select>
<Button
onClick={() => createEmployee.mutate({ data: { name: personName, employee_type: personType, status: "active" } })}
disabled={!personName.trim() || createEmployee.isPending}
>
Create
</Button>
</CardContent>
</Card>
</div>
<div className="mt-6 grid gap-4 lg:grid-cols-3">
<Card>
<CardHeader>
<CardTitle>Projects</CardTitle>
<CardDescription>{(projects.data ?? []).length} total</CardDescription>
</CardHeader>
<CardContent>
<ul className="space-y-2">
{(projects.data ?? []).slice(0, 8).map((p) => (
<li key={p.id ?? p.name} className="flex items-center justify-between rounded-md border p-2 text-sm">
<span>{p.name}</span>
<span className="text-xs text-muted-foreground">{p.status}</span>
</li>
))}
{(projects.data ?? []).length === 0 ? (
<li className="text-sm text-muted-foreground">No projects yet.</li>
) : null}
</ul>
</CardContent>
</Card>
<Card>
<CardHeader>
<CardTitle>Departments</CardTitle>
<CardDescription>{(departments.data ?? []).length} total</CardDescription>
</CardHeader>
<CardContent>
<ul className="space-y-2">
{(departments.data ?? []).slice(0, 8).map((d) => (
<li key={d.id ?? d.name} className="flex items-center justify-between rounded-md border p-2 text-sm">
<span>{d.name}</span>
<span className="text-xs text-muted-foreground">id {d.id}</span>
</li>
))}
{(departments.data ?? []).length === 0 ? (
<li className="text-sm text-muted-foreground">No departments yet.</li>
) : null}
</ul>
</CardContent>
</Card>
<Card>
<CardHeader>
<CardTitle>Activity</CardTitle>
<CardDescription>Latest actions</CardDescription>
</CardHeader>
<CardContent>
<ul className="space-y-2">
{(activities.data ?? []).map((a) => (
<li key={String(a.id)} className="rounded-md border p-2 text-xs">
<div className="font-medium">{a.entity_type} · {a.verb}</div>
<div className="text-muted-foreground">id {a.entity_id ?? "—"}</div>
</li>
))}
{(activities.data ?? []).length === 0 ? (
<li className="text-sm text-muted-foreground">No activity yet.</li>
) : null}
</ul>
</CardContent>
</Card>
</div>

View File

@@ -23,16 +23,10 @@ import {
useListProjectMembersProjectsProjectIdMembersGet,
useAddProjectMemberProjectsProjectIdMembersPost,
useRemoveProjectMemberProjectsProjectIdMembersMemberIdDelete,
useUpdateProjectMemberProjectsProjectIdMembersMemberIdPatch,
} from "@/api/generated/projects/projects";
const STATUSES = [
"backlog",
"ready",
"in_progress",
"review",
"done",
"blocked",
] as const;
const STATUSES = ["backlog", "ready", "in_progress", "review", "done", "blocked"] as const;
export default function ProjectDetailPage() {
const params = useParams();
@@ -50,6 +44,9 @@ export default function ProjectDetailPage() {
const removeMember = useRemoveProjectMemberProjectsProjectIdMembersMemberIdDelete({
mutation: { onSuccess: () => members.refetch() },
});
const updateMember = useUpdateProjectMemberProjectsProjectIdMembersMemberIdPatch({
mutation: { onSuccess: () => members.refetch() },
});
const tasks = useListTasksTasksGet({ projectId });
const createTask = useCreateTaskTasksPost({
@@ -161,7 +158,7 @@ export default function ProjectDetailPage() {
<Select onChange={(e) => {
const empId = e.target.value;
if (!empId) return;
addMember.mutate({ projectId, data: { project_id: projectId, employee_id: Number(empId), role: null } });
addMember.mutate({ projectId, data: { project_id: projectId, employee_id: Number(empId), role: "member" } });
e.currentTarget.value = "";
}}>
<option value="">Add member</option>
@@ -171,7 +168,8 @@ export default function ProjectDetailPage() {
</Select>
<ul className="space-y-2">
{projectMembers.map((m) => (
<li key={m.id ?? `${m.project_id}-${m.employee_id}`} className="flex items-center justify-between rounded-md border p-2 text-sm">
<li key={m.id ?? `${m.project_id}-${m.employee_id}`} className="rounded-md border p-2 text-sm">
<div className="flex items-center justify-between gap-2">
<div>{employeeName(m.employee_id)}</div>
<Button
variant="outline"
@@ -179,6 +177,20 @@ export default function ProjectDetailPage() {
>
Remove
</Button>
</div>
<div className="mt-2">
<Input
placeholder="Role (e.g., PM, QA, Dev)"
defaultValue={m.role ?? ""}
onBlur={(e) =>
updateMember.mutate({
projectId,
memberId: Number(m.id),
data: { project_id: projectId, employee_id: m.employee_id, role: e.currentTarget.value || null },
})
}
/>
</div>
</li>
))}
{projectMembers.length === 0 ? <li className="text-sm text-muted-foreground">No members yet.</li> : null}