Files
lcbp3/frontend/components/review-team/ReviewTeamSelector.tsx
T
admin 0240d80da5
CI / CD Pipeline / build (push) Successful in 6m1s
CI / CD Pipeline / deploy (push) Failing after 6m42s
690514:2019 204-rfa-approval-refactor #01
2026-05-14 20:19:21 +07:00

89 lines
2.7 KiB
TypeScript

'use client';
// File: components/review-team/ReviewTeamSelector.tsx
// Selector component สำหรับเลือก Review Team ตอน Submit RFA (T023)
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from '@/components/ui/select';
import { Badge } from '@/components/ui/badge';
import { Users } from 'lucide-react';
import { useReviewTeams } from '@/hooks/use-review-teams';
import { ReviewTeam } from '@/types/review-team';
const NO_REVIEW_TEAM_VALUE = '__skip_parallel_review__';
interface ReviewTeamSelectorProps {
projectPublicId: string;
rfaTypeCode?: string;
value?: string;
onChange: (publicId: string | undefined) => void;
disabled?: boolean;
}
export function ReviewTeamSelector({
projectPublicId,
rfaTypeCode,
value,
onChange,
disabled,
}: ReviewTeamSelectorProps) {
const { data: teams = [], isLoading } = useReviewTeams({
projectPublicId,
isActive: true,
});
// กรอง teams ที่ match กับ rfaTypeCode (ถ้ากำหนด)
const filteredTeams = rfaTypeCode
? (teams as ReviewTeam[]).filter(
(t) => !t.defaultForRfaTypes?.length || t.defaultForRfaTypes.includes(rfaTypeCode),
)
: (teams as ReviewTeam[]);
return (
<div className="space-y-2">
<div className="flex items-center gap-2 text-sm font-medium">
<Users className="h-4 w-4" />
<span>Review Team (Parallel Review)</span>
<Badge variant="outline" className="text-xs">Optional</Badge>
</div>
<Select
value={value ?? NO_REVIEW_TEAM_VALUE}
onValueChange={(v: string) =>
onChange(v === NO_REVIEW_TEAM_VALUE ? undefined : v)
}
disabled={disabled || isLoading}
>
<SelectTrigger>
<SelectValue placeholder={isLoading ? 'Loading teams...' : 'Skip — no parallel review'} />
</SelectTrigger>
<SelectContent>
<SelectItem value={NO_REVIEW_TEAM_VALUE}>Skip no parallel review</SelectItem>
{filteredTeams.map((team) => (
<SelectItem key={team.publicId} value={team.publicId}>
<div className="flex items-center gap-2">
<span>{team.name}</span>
{(team.members ?? []).length > 0 && (
<span className="text-xs text-muted-foreground">
({team.members?.length} members)
</span>
)}
</div>
</SelectItem>
))}
</SelectContent>
</Select>
{value && (
<p className="text-xs text-muted-foreground">
Parallel review tasks will be created for each discipline in the selected team.
</p>
)}
</div>
);
}