chore. #69-불필요한 코드 삭제

team-pofo · Jan 24, 2025 · 5520f02 · 5520f02
1 parent bc39f8b
commit 5520f02
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 176 deletions.
diff --git a/src/components/SelectStackType/SelectStack.tsx b/src/components/SelectStackType/SelectStack.tsx
@@ -1,13 +1,6 @@
 import { useSelectStacks } from "@/stores/selectStackType/selectStacksStore";
-import * as Style from "./styles";
 import { useEffect, useState } from "react";
 import useDebounce from "./debounce";
-
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuTrigger,
-} from "@/components/ui/dropdown-menu";
 import { Button } from "../ui/button";
 import {
   Command,
@@ -25,85 +18,14 @@ import {
 import { Check, ChevronsUpDown } from "lucide-react";
 import { cn } from "@/lib/utils";
 
-export function SelectStack22() {
-  const {
-    stacks,
-    searchWord,
-    searching,
-    selectedStacks,
-
-    updateSearchWord,
-    inputStack,
-    clickStack,
-  } = useSelectStacks();
-
-  const debouncedSearchStackWord = useDebounce(searchWord, 500);
-  useEffect(() => {
-    inputStack(debouncedSearchStackWord);
-  }, [debouncedSearchStackWord, inputStack]);
-
-  return (
-    <Style.SelectStackTypeCard>
-      <DropdownMenu>
-        <DropdownMenuTrigger asChild>
-          <Style.SelectStackTypeBtn>기술 스택</Style.SelectStackTypeBtn>
-        </DropdownMenuTrigger>
-        <DropdownMenuContent
-          style={{
-            width: "var(--radix-dropdown-menu-trigger-width)",
-            border: "none",
-            padding: 0,
-            marginTop: 0,
-            paddingTop: 10,
-          }}
-        >
-          <Style.SelectStackTypeDropdown>
-            <Style.SelectStackNameInput
-              type="text"
-              placeholder="검색"
-              value={searchWord}
-              onChange={(input) => {
-                updateSearchWord(input.target.value);
-              }}
-            ></Style.SelectStackNameInput>
-
-            {searching && stacks.length === 0 && (
-              <p style={{ marginLeft: "10px" }}>검색 결과가 없습니다</p>
-            )}
-            {!searching && (
-              <p style={{ marginLeft: "10px" }}>검색어를 입력해주세요</p>
-            )}
-
-            {stacks.map((stack, index) => (
-              <div key={index}>
-                <Style.SelectStackTypeLabel>
-                  <Style.SelectStackTypeCheckobx
-                    style={{ padding: "10px" }}
-                    type="checkbox"
-                    checked={selectedStacks.includes(stack)}
-                    onChange={() => clickStack(stack)}
-                  ></Style.SelectStackTypeCheckobx>
-                  {stack}
-                </Style.SelectStackTypeLabel>
-              </div>
-            ))}
-          </Style.SelectStackTypeDropdown>
-        </DropdownMenuContent>
-      </DropdownMenu>
-    </Style.SelectStackTypeCard>
-  );
-}
-
 export default function SelectStack() {
   const [open, setOpen] = useState(false);
-  const [selectedValues, setSelectedValues] = useState<string[]>([]);
 
   const {
     stacks,
     searchWord,
     searching,
     selectedStacks,
-
     updateSearchWord,
     inputStack,
     clickStack,
@@ -114,15 +36,6 @@ export default function SelectStack() {
     inputStack(debouncedSearchStackWord);
   }, [debouncedSearchStackWord, inputStack]);
 
-  const toggleValue = (currentValue: string) => {
-    setSelectedValues(
-      (prevValues) =>
-        prevValues.includes(currentValue)
-          ? prevValues.filter((value) => value !== currentValue) // Remove if already selected
-          : [...prevValues, currentValue], // Add if not selected
-    );
-  };
-
   return (
     <Popover open={open} onOpenChange={setOpen}>
       <PopoverTrigger asChild>
@@ -158,15 +71,14 @@ export default function SelectStack() {
                   key={index}
                   value={stack}
                   onSelect={() => {
-                    toggleValue(stack);
                     clickStack(stack);
                   }}
                 >
                   {stack}
                   <Check
                     className={cn(
                       "ml-auto",
-                      selectedValues.includes(stack)
+                      selectedStacks.includes(stack)
                         ? "opacity-100"
                         : "opacity-0",
                     )}

diff --git a/src/components/SelectStackType/SelectType.tsx b/src/components/SelectStackType/SelectType.tsx
@@ -1,51 +1,5 @@
-import * as Style from "./styles";
 import { useSelectTypes } from "@/stores/selectStackType/selectTypesStore";
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuTrigger,
-} from "@/components/ui/dropdown-menu";
-
-export function SelectType22() {
-  const { types, selectedTypes, clickType } = useSelectTypes();
 
-  return (
-    <Style.SelectStackTypeCard>
-      <DropdownMenu>
-        <DropdownMenuTrigger asChild>
-          <Style.SelectStackTypeBtn>카테고리</Style.SelectStackTypeBtn>
-        </DropdownMenuTrigger>
-        <DropdownMenuContent
-          style={{
-            width: "var(--radix-dropdown-menu-trigger-width)",
-            border: "none",
-            padding: 0,
-            marginTop: 0,
-            paddingTop: 10,
-          }}
-        >
-          <Style.SelectStackTypeDropdown>
-            {types.map((type, index) => (
-              <div key={index}>
-                <Style.SelectStackTypeLabel>
-                  <Style.SelectStackTypeCheckobx
-                    style={{ padding: "10px" }}
-                    type="checkbox"
-                    checked={selectedTypes.includes(type)}
-                    onChange={() => clickType(type)}
-                  ></Style.SelectStackTypeCheckobx>
-                  {type}
-                </Style.SelectStackTypeLabel>
-              </div>
-            ))}
-          </Style.SelectStackTypeDropdown>
-        </DropdownMenuContent>
-      </DropdownMenu>
-    </Style.SelectStackTypeCard>
-  );
-}
-
-import * as React from "react";
 import { Check, ChevronsUpDown } from "lucide-react";
 
 import { cn } from "@/lib/utils";
@@ -63,43 +17,11 @@ import {
   PopoverContent,
   PopoverTrigger,
 } from "@/components/ui/popover";
-
-const frameworks = [
-  {
-    value: "next.js",
-    label: "Next.js",
-  },
-  {
-    value: "sveltekit",
-    label: "SvelteKit",
-  },
-  {
-    value: "nuxt.js",
-    label: "Nuxt.js",
-  },
-  {
-    value: "remix",
-    label: "Remix",
-  },
-  {
-    value: "astro",
-    label: "Astro",
-  },
-];
+import { useState } from "react";
 
 export default function SelectType() {
   const { types, selectedTypes, clickType } = useSelectTypes();
-  const [open, setOpen] = React.useState(false);
-  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);
-
-  const toggleValue = (currentValue: string) => {
-    setSelectedValues(
-      (prevValues) =>
-        prevValues.includes(currentValue)
-          ? prevValues.filter((value) => value !== currentValue) // Remove if already selected
-          : [...prevValues, currentValue], // Add if not selected
-    );
-  };
+  const [open, setOpen] = useState(false);
 
   return (
     <Popover open={open} onOpenChange={setOpen}>
@@ -135,15 +57,14 @@ export default function SelectType() {
                   key={index}
                   value={type}
                   onSelect={() => {
-                    toggleValue(type);
                     clickType(type);
                   }}
                 >
                   {type}
                   <Check
                     className={cn(
                       "ml-auto",
-                      selectedValues.includes(type)
+                      selectedTypes.includes(type)
                         ? "opacity-100"
                         : "opacity-0",
                     )}

diff --git a/src/components/SelectStackType/SelectedStackType.tsx b/src/components/SelectStackType/SelectedStackType.tsx
@@ -27,8 +27,12 @@ export default function SelectedStackType() {
             </button>
           </Badge>
         ))}
-        {/* {selectedTypes.map((type, index) => (
-          <Style.SelectedTypeCard key={index}>
+        {selectedTypes.map((type, index) => (
+          <Badge
+            style={{ gap: "8px", height: "28px" }}
+            variant="secondary"
+            key={index}
+          >
             {type}
             <button
               onClick={() => {
@@ -37,9 +41,9 @@ export default function SelectedStackType() {
             >
               <IoClose />
             </button>
-          </Style.SelectedTypeCard>
-        ))} */}
-        {!(selectedStacks.length == 0) && (
+          </Badge>
+        ))}
+        {!(selectedStacks.length == 0 && selectedTypes.length == 0) && (
           <Badge
             style={{ height: "28px", cursor: "pointer" }}
             onClick={() => {