v1.2.3 (#706)

v1.2.3
woowacourse-teams · Sep 22, 2023 · e4c0386 · e4c0386
2 parents 328b96d + 6af0a60
commit e4c0386
Show file tree

Hide file tree

Showing 60 changed files with 602 additions and 488 deletions.
diff --git a/backend/src/main/resources/application.yml b/backend/src/main/resources/application.yml
@@ -18,6 +18,11 @@ logging:
     path: { LOG_DIR }
 
 server:
+  tomcat:
+    threads:
+      max: { MAX_THREADS }
+    max-connections: { MAX_CONNECTIONS }
+    accept-count: { ACCEPT_COUNT }
   servlet:
     session:
       cookie:

diff --git a/frontend/package.json b/frontend/package.json
@@ -13,7 +13,7 @@
     "test:coverage": "jest --watchAll --coverage"
   },
   "dependencies": {
-    "@fun-eat/design-system": "^0.3.11",
+    "@fun-eat/design-system": "^0.3.12",
     "@tanstack/react-query": "^4.32.6",
     "@tanstack/react-query-devtools": "^4.32.6",
     "dayjs": "^1.11.9",

diff --git a/frontend/public/index.html b/frontend/public/index.html
@@ -18,6 +18,13 @@
     <link rel="icon" type="image/png" sizes="16x16" href="/assets/favicon-16x16.png" />
     <link rel="icon" type="image/png" sizes="32x32" href="/assets/favicon-32x32.png" />
     <link rel="apple-touch-icon" sizes="180x180" href="/assets/apple-icon-180x180.png" />
+    <link
+      rel="preload"
+      as="font"
+      crossorigin
+      href="https://cdn.jsdelivr.net/gh/orioncactus/[email protected]/dist/web/variable/pretendardvariable-dynamic-subset.css"
+      onload="this.onload=null; this.rel='stylesheet'"
+    />
     <title>펀잇</title>
   </head>
   <body>

diff --git a/frontend/src/components/Common/CategoryFoodList/CategoryFoodList.stories.tsx b/frontend/src/components/Common/CategoryFoodList/CategoryFoodList.stories.tsx
@@ -0,0 +1,13 @@
+import type { Meta, StoryObj } from '@storybook/react';
+
+import CategoryFoodList from './CategoryFoodList';
+
+const meta: Meta<typeof CategoryFoodList> = {
+  title: 'common/CategoryFoodList',
+  component: CategoryFoodList,
+};
+
+export default meta;
+type Story = StoryObj<typeof CategoryFoodList>;
+
+export const Default: Story = {};
diff --git a/frontend/src/components/Common/CategoryFoodList/CategoryFoodList.tsx b/frontend/src/components/Common/CategoryFoodList/CategoryFoodList.tsx
@@ -0,0 +1,33 @@
+import { Link } from '@fun-eat/design-system';
+import { Link as RouterLink } from 'react-router-dom';
+import styled from 'styled-components';
+
+import CategoryItem from '../CategoryItem/CategoryItem';
+
+import { CATEGORY_TYPE } from '@/constants';
+import { useCategoryFoodQuery } from '@/hooks/queries/product';
+
+const category = CATEGORY_TYPE.FOOD;
+
+const CategoryFoodList = () => {
+  const { data: categories } = useCategoryFoodQuery(category);
+
+  return (
+    <div>
+      <CategoryFoodListWrapper>
+        {categories.map((menu) => (
+          <Link key={menu.id} as={RouterLink} to={`products/food?category=${menu.id}`}>
+            <CategoryItem name={menu.name} image={menu.image} />
+          </Link>
+        ))}
+      </CategoryFoodListWrapper>
+    </div>
+  );
+};
+
+export default CategoryFoodList;
+
+const CategoryFoodListWrapper = styled.div`
+  display: flex;
+  gap: 16px;
+`;
diff --git a/frontend/src/components/Common/CategoryFoodTab/CategoryFoodTab.stories.tsx b/frontend/src/components/Common/CategoryFoodTab/CategoryFoodTab.stories.tsx
@@ -0,0 +1,22 @@
+import type { Meta, StoryObj } from '@storybook/react';
+
+import CategoryFoodTab from './CategoryFoodTab';
+
+import CategoryProvider from '@/contexts/CategoryContext';
+
+const meta: Meta<typeof CategoryFoodTab> = {
+  title: 'common/CategoryFoodTab',
+  component: CategoryFoodTab,
+  decorators: [
+    (Story) => (
+      <CategoryProvider>
+        <Story />
+      </CategoryProvider>
+    ),
+  ],
+};
+
+export default meta;
+type Story = StoryObj<typeof CategoryFoodTab>;
+
+export const Default: Story = {};
diff --git a/...onents/Common/CategoryTab/CategoryTab.tsx → ...ommon/CategoryFoodTab/CategoryFoodTab.tsx b/...onents/Common/CategoryTab/CategoryTab.tsx → ...ommon/CategoryFoodTab/CategoryFoodTab.tsx
@@ -1,33 +1,30 @@
 import { Button, theme } from '@fun-eat/design-system';
 import { useEffect } from 'react';
 import { useLocation } from 'react-router-dom';
-import type { CSSProp } from 'styled-components';
 import styled from 'styled-components';
 
-import { useCategoryValueContext, useCategoryActionContext } from '@/hooks/context';
-import { useCategoryQuery } from '@/hooks/queries/product';
-import type { CategoryVariant } from '@/types/common';
+import { CATEGORY_TYPE } from '@/constants';
+import { useCategoryActionContext, useCategoryValueContext } from '@/hooks/context';
+import { useCategoryFoodQuery } from '@/hooks/queries/product/useCategoryQuery';
 
-interface CategoryMenuProps {
-  menuVariant: CategoryVariant;
-}
+const category = CATEGORY_TYPE.FOOD;
 
-const CategoryTab = ({ menuVariant }: CategoryMenuProps) => {
-  const { data: categories } = useCategoryQuery(menuVariant);
+const CategoryFoodTab = () => {
+  const { data: categories } = useCategoryFoodQuery(category);
 
   const { categoryIds } = useCategoryValueContext();
   const { selectCategory } = useCategoryActionContext();
-  const currentCategoryId = categoryIds[menuVariant];
+  const currentCategoryId = categoryIds[category];
 
   const location = useLocation();
   const queryParams = new URLSearchParams(location.search);
   const categoryIdFromURL = queryParams.get('category');
 
   useEffect(() => {
     if (categoryIdFromURL) {
-      selectCategory(menuVariant, parseInt(categoryIdFromURL));
+      selectCategory(category, parseInt(categoryIdFromURL));
     }
-  }, [location]);
+  }, [category]);
 
   return (
     <CategoryMenuContainer>
@@ -43,8 +40,7 @@ const CategoryTab = ({ menuVariant }: CategoryMenuProps) => {
               weight="bold"
               variant={isSelected ? 'filled' : 'outlined'}
               isSelected={isSelected}
-              menuVariant={menuVariant}
-              onClick={() => selectCategory(menuVariant, menu.id)}
+              onClick={() => selectCategory(category, menu.id)}
               aria-pressed={isSelected}
             >
               {menu.name}
@@ -56,9 +52,7 @@ const CategoryTab = ({ menuVariant }: CategoryMenuProps) => {
   );
 };
 
-export default CategoryTab;
-
-type CategoryMenuStyleProps = Pick<CategoryMenuProps, 'menuVariant'>;
+export default CategoryFoodTab;
 
 const CategoryMenuContainer = styled.ul`
   display: flex;
@@ -71,18 +65,13 @@ const CategoryMenuContainer = styled.ul`
   }
 `;
 
-const CategoryButton = styled(Button)<{ isSelected: boolean } & CategoryMenuStyleProps>`
+const CategoryButton = styled(Button)<{ isSelected: boolean }>`
   padding: 6px 12px;
-  ${({ isSelected, menuVariant }) => (isSelected ? selectedCategoryMenuStyles[menuVariant] : '')}
+  ${({ isSelected }) =>
+    isSelected
+      ? `
+      background: ${theme.colors.gray5};
+      color: ${theme.textColors.white};
+      `
+      : ''}
 `;
-
-const selectedCategoryMenuStyles: Record<CategoryMenuStyleProps['menuVariant'], CSSProp> = {
-  food: `
-    background: ${theme.colors.gray5};
-    color: ${theme.textColors.white};
-  `,
-  store: `
-    background: ${theme.colors.primary};
-    color: ${theme.textColors.default};
-  `,
-};
diff --git a/frontend/src/components/Common/CategoryList/CategoryList.stories.tsx b/frontend/src/components/Common/CategoryList/CategoryList.stories.tsx
diff --git a/frontend/src/components/Common/CategoryList/CategoryList.tsx b/frontend/src/components/Common/CategoryList/CategoryList.tsx
diff --git a/frontend/src/components/Common/CategoryStoreList/CategoryStoreList.stories.tsx b/frontend/src/components/Common/CategoryStoreList/CategoryStoreList.stories.tsx
@@ -0,0 +1,13 @@
+import type { Meta, StoryObj } from '@storybook/react';
+
+import CategoryStoreList from './CategoryStoreList';
+
+const meta: Meta<typeof CategoryStoreList> = {
+  title: 'common/CategoryStoreList',
+  component: CategoryStoreList,
+};
+
+export default meta;
+type Story = StoryObj<typeof CategoryStoreList>;
+
+export const Default: Story = {};
diff --git a/frontend/src/components/Common/CategoryStoreList/CategoryStoreList.tsx b/frontend/src/components/Common/CategoryStoreList/CategoryStoreList.tsx
@@ -0,0 +1,33 @@
+import { Link } from '@fun-eat/design-system';
+import { Link as RouterLink } from 'react-router-dom';
+import styled from 'styled-components';
+
+import CategoryItem from '../CategoryItem/CategoryItem';
+
+import { CATEGORY_TYPE } from '@/constants';
+import { useCategoryStoreQuery } from '@/hooks/queries/product';
+
+const category = CATEGORY_TYPE.STORE;
+
+const CategoryStoreList = () => {
+  const { data: categories } = useCategoryStoreQuery(category);
+
+  return (
+    <div>
+      <CategoryStoreListWrapper>
+        {categories.map((menu) => (
+          <Link key={menu.id} as={RouterLink} to={`products/store?category=${menu.id}`}>
+            <CategoryItem name={menu.name} image={menu.image} />
+          </Link>
+        ))}
+      </CategoryStoreListWrapper>
+    </div>
+  );
+};
+
+export default CategoryStoreList;
+
+const CategoryStoreListWrapper = styled.div`
+  display: flex;
+  gap: 16px;
+`;
diff --git a/frontend/src/components/Common/CategoryStoreTab/CategoryStoreTab.stories.tsx b/frontend/src/components/Common/CategoryStoreTab/CategoryStoreTab.stories.tsx
@@ -0,0 +1,22 @@
+import type { Meta, StoryObj } from '@storybook/react';
+
+import CategoryStoreTab from './CategoryStoreTab';
+
+import CategoryProvider from '@/contexts/CategoryContext';
+
+const meta: Meta<typeof CategoryStoreTab> = {
+  title: 'common/CategoryStoreTab',
+  component: CategoryStoreTab,
+  decorators: [
+    (Story) => (
+      <CategoryProvider>
+        <Story />
+      </CategoryProvider>
+    ),
+  ],
+};
+
+export default meta;
+type Story = StoryObj<typeof CategoryStoreTab>;
+
+export const Default: Story = {};