feat(m4): project & member management with tests and e2e
- ProjectRepository, ProjectMemberRepository, minimal NotificationRepository - ProjectService: create/update/archive/delete project, add/remove member, permission checks (isMember/admin), member-added notification, getDashboard skeleton, getMyProjects, getMemberRole - projectValidator, API services factory - API routes: projects CRUD, members list/add/remove - Screens: dashboard (project list + create form), project overview, members, settings; layout (Header/Sidebar/ProjectNav) and project components - Unit tests (Project/ProjectMember repositories, ProjectService), integration project-member-permission, e2e project-management
This commit is contained in:
Ken Yasue
86
app/projects/[projectId]/members/page.tsx
Normal file
86
app/projects/[projectId]/members/page.tsx
Normal file
@ -0,0 +1,86 @@
|
||||
import { redirect } from 'next/navigation';
|
||||
import { getCurrentUser, toPublicUser } from '@/lib/auth/getCurrentUser';
|
||||
import { createProjectService } from '@/lib/api/services';
|
||||
import { Header } from '@/components/layout/Header';
|
||||
import { ProjectNav } from '@/components/layout/ProjectNav';
|
||||
import { AddMemberForm } from '@/components/project/AddMemberForm';
|
||||
import { RemoveMemberButton } from '@/components/project/RemoveMemberButton';
|
||||
import { ForbiddenError, NotFoundError } from '@/lib/errors';
|
||||
|
||||
export const dynamic = 'force-dynamic';
|
||||
|
||||
const ROLE_LABEL = { admin: '管理者', member: 'メンバー', guest: 'ゲスト' };
|
||||
|
||||
export default async function ProjectMembersPage({
|
||||
params,
|
||||
}: {
|
||||
params: Promise<{ projectId: string }>;
|
||||
}) {
|
||||
const user = await getCurrentUser();
|
||||
if (!user) {
|
||||
redirect('/login');
|
||||
}
|
||||
const { projectId } = await params;
|
||||
|
||||
const service = createProjectService();
|
||||
let project: Awaited<ReturnType<typeof service.getProject>>;
|
||||
let members: Awaited<ReturnType<typeof service.getMembers>>;
|
||||
let canManage: boolean;
|
||||
try {
|
||||
project = service.getProject(user.id, Number(projectId));
|
||||
members = service.getMembers(user.id, Number(projectId));
|
||||
canManage = service.getMemberRole(user.id, Number(projectId)) === 'admin';
|
||||
} catch (error) {
|
||||
if (error instanceof ForbiddenError || error instanceof NotFoundError) {
|
||||
redirect('/dashboard');
|
||||
}
|
||||
throw error;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-gray-50">
|
||||
<Header user={toPublicUser(user)} />
|
||||
<ProjectNav projectId={project.id} active="members" />
|
||||
<main className="mx-auto max-w-3xl space-y-6 p-6">
|
||||
<h1 className="text-2xl font-bold">メンバー管理</h1>
|
||||
|
||||
{canManage && <AddMemberForm projectId={project.id} />}
|
||||
|
||||
<section className="rounded-lg border bg-white shadow-sm">
|
||||
<ul className="divide-y">
|
||||
{members.map((member) => (
|
||||
<li
|
||||
key={member.id}
|
||||
className="flex items-center justify-between p-4"
|
||||
>
|
||||
<div>
|
||||
<p className="font-medium text-gray-800">
|
||||
{member.user.name}
|
||||
{member.userId === user.id && (
|
||||
<span className="ml-2 text-xs text-gray-400">
|
||||
(あなた)
|
||||
</span>
|
||||
)}
|
||||
</p>
|
||||
<p className="text-sm text-gray-500">{member.user.email}</p>
|
||||
</div>
|
||||
<div className="flex items-center gap-3">
|
||||
<span className="text-sm text-gray-600">
|
||||
{ROLE_LABEL[member.role] ?? member.role}
|
||||
</span>
|
||||
{canManage && member.userId !== user.id && (
|
||||
<RemoveMemberButton
|
||||
projectId={project.id}
|
||||
userId={member.userId}
|
||||
label="削除"
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</section>
|
||||
</main>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
79
app/projects/[projectId]/page.tsx
Normal file
79
app/projects/[projectId]/page.tsx
Normal file
@ -0,0 +1,79 @@
|
||||
import { redirect } from 'next/navigation';
|
||||
import { getCurrentUser, toPublicUser } from '@/lib/auth/getCurrentUser';
|
||||
import { createProjectService } from '@/lib/api/services';
|
||||
import { Header } from '@/components/layout/Header';
|
||||
import { ProjectNav } from '@/components/layout/ProjectNav';
|
||||
import { DashboardWidget } from '@/components/project/DashboardWidget';
|
||||
import { ForbiddenError, NotFoundError } from '@/lib/errors';
|
||||
|
||||
export const dynamic = 'force-dynamic';
|
||||
|
||||
const STATUS_LABELS: Record<string, string> = {
|
||||
active: 'Active',
|
||||
on_hold: 'On Hold',
|
||||
completed: 'Completed',
|
||||
archived: 'Archived',
|
||||
};
|
||||
|
||||
export default async function ProjectOverviewPage({
|
||||
params,
|
||||
}: {
|
||||
params: Promise<{ projectId: string }>;
|
||||
}) {
|
||||
const user = await getCurrentUser();
|
||||
if (!user) {
|
||||
redirect('/login');
|
||||
}
|
||||
const { projectId } = await params;
|
||||
|
||||
const service = createProjectService();
|
||||
let dashboard;
|
||||
try {
|
||||
dashboard = service.getDashboard(user.id, Number(projectId));
|
||||
} catch (error) {
|
||||
if (error instanceof ForbiddenError || error instanceof NotFoundError) {
|
||||
redirect('/dashboard');
|
||||
}
|
||||
throw error;
|
||||
}
|
||||
|
||||
const { project, members } = dashboard;
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-gray-50">
|
||||
<Header user={toPublicUser(user)} />
|
||||
<ProjectNav projectId={project.id} active="overview" />
|
||||
<main className="mx-auto max-w-4xl space-y-6 p-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<h1 className="text-2xl font-bold">{project.name}</h1>
|
||||
<span className="rounded bg-gray-100 px-2 py-0.5 text-xs">
|
||||
{STATUS_LABELS[project.status] ?? project.status}
|
||||
</span>
|
||||
</div>
|
||||
{project.description && (
|
||||
<p className="text-gray-600">{project.description}</p>
|
||||
)}
|
||||
<p className="text-sm text-gray-500">メンバー数: {members.length}</p>
|
||||
|
||||
<div className="grid gap-4 sm:grid-cols-2">
|
||||
<DashboardWidget
|
||||
title="進行中ToDo"
|
||||
empty="ToDo機能は後続マイルストーンで実装されます"
|
||||
/>
|
||||
<DashboardWidget
|
||||
title="最新チャット"
|
||||
empty="チャット機能は後続マイルストーンで実装されます"
|
||||
/>
|
||||
<DashboardWidget
|
||||
title="最新掲示板"
|
||||
empty="掲示板機能は後続マイルストーンで実装されます"
|
||||
/>
|
||||
<DashboardWidget
|
||||
title="最近のアクティビティ"
|
||||
empty="アクティビティログは後続マイルストーンで実装されます"
|
||||
/>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
57
app/projects/[projectId]/settings/page.tsx
Normal file
57
app/projects/[projectId]/settings/page.tsx
Normal file
@ -0,0 +1,57 @@
|
||||
import { redirect } from 'next/navigation';
|
||||
import { getCurrentUser, toPublicUser } from '@/lib/auth/getCurrentUser';
|
||||
import { createProjectService } from '@/lib/api/services';
|
||||
import { Header } from '@/components/layout/Header';
|
||||
import { ProjectNav } from '@/components/layout/ProjectNav';
|
||||
import { ProjectSettingsForm } from '@/components/project/ProjectSettingsForm';
|
||||
import { DeleteProjectButton } from '@/components/project/DeleteProjectButton';
|
||||
import { ForbiddenError, NotFoundError } from '@/lib/errors';
|
||||
|
||||
export const dynamic = 'force-dynamic';
|
||||
|
||||
export default async function ProjectSettingsPage({
|
||||
params,
|
||||
}: {
|
||||
params: Promise<{ projectId: string }>;
|
||||
}) {
|
||||
const user = await getCurrentUser();
|
||||
if (!user) {
|
||||
redirect('/login');
|
||||
}
|
||||
const { projectId } = await params;
|
||||
|
||||
const service = createProjectService();
|
||||
let project;
|
||||
let canManage;
|
||||
try {
|
||||
project = service.getProject(user.id, Number(projectId));
|
||||
canManage = service.getMemberRole(user.id, Number(projectId)) === 'admin';
|
||||
} catch (error) {
|
||||
if (error instanceof ForbiddenError || error instanceof NotFoundError) {
|
||||
redirect('/dashboard');
|
||||
}
|
||||
throw error;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-gray-50">
|
||||
<Header user={toPublicUser(user)} />
|
||||
<ProjectNav projectId={project.id} active="settings" />
|
||||
<main className="mx-auto max-w-2xl space-y-6 p-6">
|
||||
<h1 className="text-2xl font-bold">プロジェクト設定</h1>
|
||||
<div className="rounded-lg border bg-white p-6 shadow-sm">
|
||||
<ProjectSettingsForm project={project} canManage={canManage} />
|
||||
</div>
|
||||
{canManage && (
|
||||
<div className="rounded-lg border border-red-200 bg-white p-6 shadow-sm">
|
||||
<h2 className="text-sm font-semibold text-red-700">危険操作</h2>
|
||||
<p className="mt-1 text-sm text-gray-600">
|
||||
プロジェクトを削除すると、関連データも削除されます。
|
||||
</p>
|
||||
<DeleteProjectButton projectId={project.id} />
|
||||
</div>
|
||||
)}
|
||||
</main>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user