feat: confilct 해결

.changeset/eighty-cheetahs-kiss.md

@@ -0,0 +1,5 @@
+---
+"wowds-ui": patch
+---
+
+Table 컴포넌트의 context 문제를 해결해요

apps/wow-docs/app/constants/routePath.ts

@@ -0,0 +1,5 @@
+export const routePath = {
+  overview: "/overview",
+  foundation: "/foundation",
+  component: "/component",
+};

packages/wow-icons/CHANGELOG.md

@@ -1,5 +1,11 @@
 # wowds-icons
 
+## 0.1.6
+
+### Patch Changes
+
+- 6e86da8: Home, Folder 컴포넌트를 추가합니다.
+
 ## 0.1.5
 
 ### Patch Changes

packages/wow-icons/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wowds-icons",
-  "version": "0.1.5",
+  "version": "0.1.6",
   "description": "",
   "repository": {
     "type": "git",

packages/wow-ui/CHANGELOG.md

@@ -1,5 +1,12 @@
 # wowds-ui
 
+## 0.1.20
+
+### Patch Changes
+
+- Updated dependencies [6e86da8]
+  - [email protected]
+
 ## 0.1.19
 
 ### Patch Changes

packages/wow-ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wowds-ui",
-  "version": "0.1.19",
+  "version": "0.1.20",
   "description": "",
   "author": "gdsc-hongik",
   "repository": {

packages/wow-ui/src/components/Table/Table.stories.tsx

@@ -94,7 +94,7 @@ export const Primary: Story = {
         <Table.Tbody>
           {data.map(({ name, studyId, id }) => {
             return (
-              <Table.Tr key={id} value={id}>
+              <Table.Tr key={id}>
                 <Table.Td>{name}</Table.Td>
                 <Table.Td>{studyId}</Table.Td>
               </Table.Tr>

packages/wow-ui/src/components/Table/TableContext.ts

@@ -1,8 +1,7 @@
 import type { Dispatch } from "react";
-import { createContext } from "react";
+import { createContext, useContext } from "react";
 
 import type { TableProps } from "@/components/Table/Table";
-import useSafeContext from "@/hooks/useSafeContext";
 import type useTableCheckState from "@/hooks/useTableCheckState";
 
 export const TableContext = createContext<
@@ -15,7 +14,16 @@ export const TableContext = createContext<
 >(null);
 
 export const useTableContext = () => {
-  const context = useSafeContext(TableContext);
+  const context = useContext(TableContext);
+  if (!context)
+    return {
+      selectedRows: new Set<number>(),
+      showCheckbox: false,
+      rowValues: new Set<number>(),
+      handleRowCheckboxChange: () => {},
+      handleHeaderCheckboxChange: () => {},
+      setRowValues: () => {},
+    };
   return context;
 };
 

packages/wow-ui/src/components/Table/Td.tsx

@@ -1,13 +1,12 @@
 import { cva } from "@styled-system/css";
 import { styled } from "@styled-system/jsx";
 import type { CSSProperties, PropsWithChildren, Ref } from "react";
-import { forwardRef } from "react";
+import { forwardRef, useContext, useEffect, useState } from "react";
 
 import {
   TableCheckedContext,
   useTableContext,
 } from "@/components/Table/TableContext";
-import useSafeContext from "@/hooks/useSafeContext";
 
 interface TableCellProps extends PropsWithChildren {
   style?: CSSProperties;
@@ -18,8 +17,15 @@ const Td = forwardRef(
   (props: TableCellProps, ref: Ref<HTMLTableCellElement>) => {
     const { children, ...rest } = props;
     const { selectedRows } = useTableContext();
-    const rowValue = useSafeContext(TableCheckedContext);
-    const isSelected = selectedRows.has(rowValue);
+    const [isSelected, setIsSelected] = useState(false);
+
+    const rowValue = useContext(TableCheckedContext);
+    useEffect(() => {
+      if (rowValue) {
+        const value = selectedRows.has(rowValue);
+        setIsSelected(value);
+      }
+    }, [rowValue, selectedRows]);
 
     return (
       <styled.td