summaryrefslogtreecommitdiff
path: root/components/ProjectSelector.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'components/ProjectSelector.tsx')
-rw-r--r--components/ProjectSelector.tsx50
1 files changed, 36 insertions, 14 deletions
diff --git a/components/ProjectSelector.tsx b/components/ProjectSelector.tsx
index 652bf77b..773ab7dd 100644
--- a/components/ProjectSelector.tsx
+++ b/components/ProjectSelector.tsx
@@ -12,12 +12,14 @@ interface ProjectSelectorProps {
selectedProjectId?: number | null;
onProjectSelect: (project: Project) => void;
placeholder?: string;
+ filterType?: string; // 옵션으로 필터 타입 지정 가능
}
export function ProjectSelector({
selectedProjectId,
onProjectSelect,
- placeholder = "프로젝트 선택..."
+ placeholder = "프로젝트 선택...",
+ filterType = "ship" // 기본값을 plant로 설정
}: ProjectSelectorProps) {
const [open, setOpen] = React.useState(false)
const [searchTerm, setSearchTerm] = React.useState("")
@@ -25,17 +27,24 @@ export function ProjectSelector({
const [isLoading, setIsLoading] = React.useState(false)
const [selectedProject, setSelectedProject] = React.useState<Project | null>(null)
- // 모든 프로젝트 데이터 로드 (한 번만)
+ // 모든 프로젝트 데이터 로드 후 plant 타입만 필터링
React.useEffect(() => {
async function loadAllProjects() {
setIsLoading(true);
try {
const allProjects = await getProjects();
- setProjects(allProjects);
+
+ // filterType이 지정된 경우 해당 타입만 필터링
+ const filteredByType = filterType
+ ? allProjects.filter(p => p.type === filterType)
+ : allProjects;
+
+ console.log(`Loaded ${filteredByType.length} ${filterType || 'all'} projects`);
+ setProjects(filteredByType);
// 초기 선택된 프로젝트가 있으면 설정
if (selectedProjectId) {
- const selected = allProjects.find(p => p.id === selectedProjectId);
+ const selected = filteredByType.find(p => p.id === selectedProjectId);
if (selected) {
setSelectedProject(selected);
}
@@ -48,7 +57,7 @@ export function ProjectSelector({
}
loadAllProjects();
- }, [selectedProjectId]);
+ }, [selectedProjectId, filterType]);
// 클라이언트 측에서 검색어로 필터링
const filteredProjects = React.useMemo(() => {
@@ -77,10 +86,15 @@ export function ProjectSelector({
role="combobox"
aria-expanded={open}
className="w-full justify-between"
+ disabled={isLoading}
>
- {selectedProject
- ? `${selectedProject.projectCode} - ${selectedProject.projectName}`
- : placeholder}
+ {isLoading ? (
+ "프로젝트 로딩 중..."
+ ) : selectedProject ? (
+ `${selectedProject.projectCode} - ${selectedProject.projectName}`
+ ) : (
+ placeholder
+ )}
<ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
</Button>
</PopoverTrigger>
@@ -90,14 +104,22 @@ export function ProjectSelector({
placeholder="프로젝트 코드/이름 검색..."
onValueChange={setSearchTerm}
/>
- <CommandList className="max-h-[300px]" onWheel={(e) => {
- e.stopPropagation(); // 이벤트 전파 차단
- const target = e.currentTarget;
- target.scrollTop += e.deltaY; // 직접 스크롤 처리
- }}>
- <CommandEmpty>검색 결과가 없습니다</CommandEmpty>
+ <CommandList
+ className="max-h-[300px]"
+ onWheel={(e) => {
+ e.stopPropagation();
+ const target = e.currentTarget;
+ target.scrollTop += e.deltaY;
+ }}
+ >
{isLoading ? (
<div className="py-6 text-center text-sm">로딩 중...</div>
+ ) : filteredProjects.length === 0 ? (
+ <CommandEmpty>
+ {searchTerm
+ ? "검색 결과가 없습니다"
+ : `${filterType || '해당 타입의'} 프로젝트가 없습니다`}
+ </CommandEmpty>
) : (
<CommandGroup>
{filteredProjects.map((project) => (