release

.coderabbit.yaml

@@ -0,0 +1,12 @@
+language: "ko-KR"
+reviews:
+  profile: "chill"
+  level: basic
+  enable_auto_review: true
+  high_level_summary: true
+  sequence_diagrams: true
+  assess_linked_issues: true
+  suggested_reviewers: true
+  auto_assign_reviewers: true
+  auto_review_on:
+    - pull_request

.github/workflows/pr-notification.yml

@@ -0,0 +1,24 @@
+name: Send notifications on PR
+
+on:
+  pull_request:
+    types:
+      - opened
+      - reopened
+    branches:
+      - main
+      - dev
+
+jobs:
+  send-discord-notification:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Send Discord notification
+        env:
+          DISCORD_WEBHOOK: ${{ secrets.DISCORD_WEBHOOK_FE }}
+        uses: Ilshidur/action-discord@ad5235de713df3ef38022185499b02ffe93b7efe
+        with:
+          args: |-
+            <@&1399317380735434775>
+            `[${{ github.event.pull_request.head.ref }} - ${{ github.event.pull_request.base.ref }}]` PR이 생성되었습니다.
+            ${{ github.event.pull_request.html_url }}

src/components/Article/Article.jsx

@@ -1,5 +1,4 @@
 import { Viewer } from "@toast-ui/react-editor";
-import { useState } from "react";
 import {
   Number,
   Title,
@@ -12,7 +11,7 @@ import {
 import badWords from "./badWords.json";
 
 function Article({ Numberprop, Titleprop, childrenprop, subSections, depth = 0 }) {
-  console.log(subSections);
+  // console.log(subSections);
   let markdown = childrenprop;
 
   // 욕설 필터링
@@ -74,7 +73,7 @@ function Article({ Numberprop, Titleprop, childrenprop, subSections, depth = 0 }
                 Titleprop={sub.title}
                 childrenprop={sub.contents}
                 subSections={sub.children}
-                depth={depth + 1} 
+                depth={depth + 1}
               />
             ))}
           </>

src/components/CategoryList/CategoryList.jsx

@@ -1,5 +1,4 @@
 import "../../styles/reset.css";
-import React, { useState } from "react";
 import x from "/src/assets/category/x.svg";
 import {
   CategoryListContainer,

src/components/CategoryList/CategoryList.styles.js

@@ -40,8 +40,7 @@ export const CheckboxLabel = styled.label`
   display: flex;
   align-items: center;
 
-  color: ${({ $check }) =>
-    $check ? colors_dark.gray[50] : colors_dark.orange[100]};
+  color: ${({ $check }) => ($check ? colors_dark.gray[50] : colors_dark.orange[100])};
 
   font-size: 18px;
   font-family: "Pretendard";
@@ -70,8 +69,7 @@ export const CategoryButton = styled.div`
 
   padding: 9px 6px;
 
-  background-color: ${({ $check }) =>
-    $check ? colors_dark.orange[100] : "transparent"};
+  background-color: ${({ $check }) => ($check ? colors_dark.orange[100] : "transparent")};
   border: 1px solid rgba(255, 158, 61, 0.5);
   border-radius: 8px;
 

src/components/Pagination/Pagination.jsx

@@ -1,8 +1,4 @@
-import {
-  PaginationContainer,
-  PageButton,
-  ArrowButton,
-} from "./Pagination.styles";
+import { PaginationContainer, PageButton, ArrowButton } from "./Pagination.styles";
 import PrevIcon from "../../assets/pagination/Arrow left.svg";
 import NextIcon from "../../assets/pagination/Arrow right.svg";
 
@@ -12,19 +8,19 @@ function Pagination({ currentPage, totalPages, onPageChange, groupSize = 10 }) {
   const groupStart = Math.floor((currentPage - 1) / groupSize) * groupSize + 1;
   const groupEnd = Math.min(groupStart + groupSize - 1, safeTotal);
 
-  const pages = Array.from({ length: groupSize }, (_, i) => groupStart + i);
+  const pages = Array.from({ length: groupEnd - groupStart + 1 }, (_, i) => groupStart + i);
 
   const canGoPrev = groupStart > 1;
   const canGoNext = groupEnd < safeTotal;
 
-  console.log("Pagination 상태:", {
-    currentPage,
-    safeTotal,
-    groupStart,
-    groupEnd,
-    canGoPrev,
-    canGoNext,
-  });
+  // console.log("Pagination 상태:", {
+  //   currentPage,
+  //   safeTotal,
+  //   groupStart,
+  //   groupEnd,
+  //   canGoPrev,
+  //   canGoNext,
+  // });
 
   const goPrevGroup = () => {
     if (canGoPrev) onPageChange(groupStart - groupSize);
@@ -42,17 +38,11 @@ function Pagination({ currentPage, totalPages, onPageChange, groupSize = 10 }) {
         </ArrowButton>
       )}
       {pages.map((p) => {
-        if (p > groupEnd) return null;
-        const isdisabled = p > safeTotal;
+        const isDisabled = p > safeTotal;
         const isActive = p === currentPage;
 
         return (
-          <PageButton
-            key={p}
-            onClick={() => onPageChange(p)}
-            disabled={isdisabled}
-            $active={isActive}
-          >
+          <PageButton key={p} onClick={() => onPageChange(p)} disabled={isDisabled} $active={isActive}>
             {p}
           </PageButton>
         );

src/components/TableOfContents/TableOfContents.styles.js

@@ -8,7 +8,7 @@ export const TOCContents = styled.ul`
   font-style: normal;
   font-weight: 500;
   font-size: 20px;
-  line-height: 24px;
+  line-height: 30px;
 
   margin-top: 28px;
   margin-left: 30px;

src/components/boardItem/boardItem.jsx

@@ -1,43 +1,33 @@
 import "../../styles/reset.css";
 import colors from "../../styles/color";
-import {
-  BoardItemContainer,
-  Title,
-  Categories,
-  CategoryTag,
-  Modifier,
-  LinkStyle
-} from "./boardItem.styles";
+import { BoardItemContainer, Title, Categories, CategoryTag, Modifier, LinkStyle } from "./boardItem.styles";
 
-function BoardItem({ id, title, categories = [], modifier}) {
+function BoardItem({ id, title, categories = [], modifier }) {
   return (
     <BoardItemContainer>
-      <LinkStyle to={`/board/${id}`} style={{ textDecoration: 'none' }}>
+      <LinkStyle to={`/board/${id}`} style={{ textDecoration: "none" }}>
         <Title>{title}</Title>
       </LinkStyle>
       <Categories>
-        {categories.length <= 2
-          ? categories.map((category, index) => (
-              <CategoryTag key={index}>{category}</CategoryTag>
-            ))
-          : (
-              <>
-                {categories.slice(0, 2).map((category, index) => (
-                  <CategoryTag key={index}>{category}</CategoryTag>
-                ))}
-                <span
-                  style={{
-                    padding: "7px 5px",
-                    fontSize: "24px",
-                    color: colors.gray[50],
-                    whiteSpace: "nowrap",
-                  }}
-                >
-                  ...
-                </span>
-              </>
-            )
-        }
+        {categories.length <= 2 ? (
+          categories.map((category, index) => <CategoryTag key={index}>{category}</CategoryTag>)
+        ) : (
+          <>
+            {categories.slice(0, 2).map((category) => (
+              <CategoryTag key={category}>{category}</CategoryTag>
+            ))}
+            <span
+              style={{
+                padding: "7px 5px",
+                fontSize: "24px",
+                color: colors.gray[50],
+                whiteSpace: "nowrap",
+              }}
+            >
+              ...
+            </span>
+          </>
+        )}
       </Categories>
 
       <Modifier>{modifier}</Modifier>

src/components/boardList/boardList.jsx

@@ -1,4 +1,4 @@
-import { useState, useEffect } from "react";
+import { useState, useEffect, use } from "react";
 import {
   BoardListContainer,
   BoardListTitle,
@@ -25,16 +25,15 @@ function BoardList({
   const API_BASE = import.meta.env.VITE_REACT_APP_API_BASE_URL;
 
   useEffect(() => {
-    setCurrentPage(1);
+    if (searchTerm !== "") setCurrentPage(1);
   }, [searchTerm]);
 
   useEffect(() => {
     const fetchList = async () => {
       try {
         const query = new URLSearchParams();
 
-        if (selectedCategories.length > 0)
-          query.append("categories", selectedCategories[0]);
+        if (selectedCategories.length > 0) query.append("categories", selectedCategories[0]);
         if (searchTerm) query.append("keyword", searchTerm);
 
         query.append("orderBy", sort === "최신순" ? "recent" : "like");
@@ -74,18 +73,7 @@ function BoardList({
     };
 
     fetchList();
-  }, [
-    page,
-    sort,
-    pageSize,
-    token,
-    selectedCategories,
-    searchTerm,
-    API_BASE,
-    accountId,
-    setCurrentPage,
-    type,
-  ]);
+  }, [page, sort, pageSize, token, selectedCategories, searchTerm, API_BASE, accountId, setCurrentPage, type]);
 
   return (
     <BoardListContainer>

src/pages/Board/board.jsx

@@ -31,7 +31,9 @@ function Board({ searchTerm }) {
   const token = localStorage.getItem("accessToken");
   const API_BASE = import.meta.env.VITE_REACT_APP_API_BASE_URL;
 
-  localStorage.setItem("currentPage", currentPage);
+  useEffect(() => {
+    localStorage.setItem("currentPage", currentPage);
+  }, [currentPage]);
 
   const toggleMenu = useCallback(() => {
     setIsMenuOpen((prev) => !prev);
@@ -47,9 +49,8 @@ function Board({ searchTerm }) {
     const fetchTotalCount = async () => {
       try {
         const query = new URLSearchParams();
-        if (selectedCategories.length > 0)
-          query.append("categories", selectedCategories[0]);
-        console.log("카테고리", selectedCategories);
+        if (selectedCategories.length > 0) query.append("categories", selectedCategories[0]);
+        // console.log("카테고리", selectedCategories);
         if (searchTerm) query.append("keyword", searchTerm);
 
         const res = await fetch(
@@ -70,7 +71,7 @@ function Board({ searchTerm }) {
 
         const total = (await res.json()) || 0;
         setTotalPages(Math.max(1, Math.ceil(total / pageSize)));
-        console.log("Total count:", total);
+        // console.log("Total count:", total);
       } catch (err) {
         console.error(err);
       }

src/pages/PostDetail/PostDetail.jsx

@@ -125,7 +125,7 @@ function PostDetail() {
       }
     };
     fetchPost();
-  }, [postId, API_BASE, token]);
+  }, [postId, token]);
 
   useEffect(() => {
     window.scrollTo(0, 0);

src/pages/PostEditForm/PostEditForm.jsx

@@ -163,7 +163,12 @@ function PostEditForm() {
 
     htmlBody = htmlBody.replace(
       /<pre><code([\s\S]*?)<\/code><\/pre>/g,
-      (match) => match.replace(/\n{2,}/g, "\n")
+      (match) => {
+        return match
+          .replace(/\r\n/g, "\n")
+          .replace(/\n{2,}/g, "\n")
+          .replace(/<br\s*\/?>/g, "");
+      }
     );
 
     const updatedPostData = {
@@ -278,7 +283,6 @@ function PostEditForm() {
                     }}
                     previewStyle="none"
                     hideModeSwitch={true} // 모드 전환 버튼 숨기기
-                    useCommandShortcut={false} // 단축키 비활성화
                   />
                 </StyledBodyWrapper>
               </BodyContainer>

src/pages/PostForm/PostForm.jsx

@@ -65,6 +65,13 @@ function PostForm() {
         return;
       }
 
+      if (typeof blob === "string") {
+        if (blob.startsWith("http://") || blob.startsWith("https://")) {
+          alert("외부 이미지 URL은 업로드할 수 없습니다.");
+          return;
+        }
+      }
+
       const formData = new FormData();
       formData.append("image", blob, blob.name || "upload.png");
 
@@ -107,7 +114,12 @@ function PostForm() {
 
     htmlBody = htmlBody.replace(
       /<pre><code([\s\S]*?)<\/code><\/pre>/g,
-      (match) => match.replace(/\n{2,}/g, "\n")
+      (match) => {
+        return match
+          .replace(/\r\n/g, "\n")
+          .replace(/\n{2,}/g, "\n")
+          .replace(/<br\s*\/?>/g, "");
+      }
     );
 
     const postData = {
@@ -219,7 +231,6 @@ function PostForm() {
                     }}
                     previewStyle="none"
                     hideModeSwitch={true} // 모드 전환 버튼 숨기기
-                    useCommandShortcut={false} // 단축키 비활성화
                   />
                 </StyledBodyWrapper>
               </BodyContainer>