Merge branch 'master' of https://github.com/FinFellows/web into feat/#14

FinFellows · Jan 18, 2024 · eb9ab31 · eb9ab31
2 parents 2902865 + 91f039e
commit eb9ab31
Show file tree

Hide file tree

Showing 5 changed files with 17 additions and 17 deletions.
diff --git a/src/components/molecules/Education/EducationList.tsx b/src/components/molecules/Education/EducationList.tsx
@@ -10,6 +10,7 @@ import Pagination from '@/components/molecules/pagination/Pagination';
 import { deleteEducationBookmarkApi, postEducationBookmarkApi } from '@/api/bookmarkApi';
 import SlateCompiler from '@/libs/editor/slateCompiler';
 import WithLoginModal from '@/components/templates/login/WithLoginModal';
+import truncateText from '@/utils/truncateText';
 
 export type TEducation = {
   id: number;
@@ -57,16 +58,6 @@ const Education = () => {
   const [pageNum, setPageNum] = useState(0); //현재 페이지
   const [pageTotalNum, setPageTotalNum] = useState(0); //총 페이지 수
 
-  const truncateText = (text: string, maxLength: number) => {
-    if (text.length <= maxLength) {
-      return text;
-    } else {
-      let truncatedText = text.slice(0, maxLength) + '...';
-      let modifiedText = truncatedText.slice(0, 29) + '\n' + truncatedText.slice(29);
-      return modifiedText;
-    }
-  };
-
   const fetchData = async () => {
     try {
       const data = await getEducationsData(`size=8&page=${pageNum}`);

diff --git a/src/components/molecules/News/NewsList.tsx b/src/components/molecules/News/NewsList.tsx
@@ -15,9 +15,11 @@ import { postNoticeApi } from '@/api/noticeApi';
 import ContentsCreateBtn from '../manage/ContentsCreateBtn';
 import ManageBtns from '../manage/ManageBtns';
 import EditorRenderer from '@/components/templates/editor/EditorRenderer';
+import SlateCompiler from '@/libs/editor/slateCompiler';
+import truncateText from '@/utils/truncateText';
 
 const NewsList = () => {
-  const { user } = useUser();
+  const slateCompiler = new SlateCompiler();
   const [NewsListData, setNewsListData] = useState<TNews[] | undefined>([]);
   const [showModal, setShowModal] = useState(false);
   //페이지
@@ -85,9 +87,8 @@ const NewsList = () => {
                   {i.title}
                 </h2>
                 <div className='text-typoSecondary paragraph-small tablet:paragraph-medium desktop:paragraph-large'>
-                  <div className=' tablet:h-26 desktop:h-29 overflow-hidden text-ellipsis whitespace-nowrap'>
-                    <EditorRenderer contents={i.content} />
-                  </div>
+                  {truncateText(slateCompiler.toPlainText(JSON.parse(i.content)), 50)}
+
                   <div className='pb-10'>{dateOnly}</div>
                 </div>
               </div>

diff --git a/src/components/templates/chatbot/index.tsx b/src/components/templates/chatbot/index.tsx
@@ -39,7 +39,7 @@ export default function Chatbot() {
     return (
       <button
         onClick={() => setShowChatbot(false)}
-        className='fixed z-chatbot right-25 bottom-25 flex justify-center items-center border-2 border-solid border-main rounded-full bg-white w-40 h-40 tablet:w-62 tablet:h-62'
+        className='fixed z-chatbot right-25 bottom-25 flex justify-center items-center border-2 border-solid border-main rounded-full bg-white w-40 h-40 tablet:w-56 tablet:h-56 desktop:w-62 desktop:h-62'
       >
         <CloseIcon width={'43'} height={closeIconSize} />
       </button>
@@ -57,7 +57,7 @@ export default function Chatbot() {
       {!showChatbot && (
         <button
           onClick={() => setShowChatbot(true)}
-          className='fixed right-25 bottom-25 outline-none border-2 border-solid border-main rounded-full bg-white w-40 h-40 tablet:w-62 tablet:h-62'
+          className='fixed right-25 bottom-25 outline-none border-2 border-solid border-main rounded-full bg-white w-40 h-40 tablet:w-56 tablet:h-56 desktop:w-62 desktop:h-62 dark:bg-secondary'
         >
           <Image src={GoldtoriIcon} alt='금토리 아이콘' fill sizes='62px' />
         </button>

diff --git a/src/components/templates/editor/EditorRenderer.tsx b/src/components/templates/editor/EditorRenderer.tsx
@@ -12,7 +12,7 @@ export default function EditorRenderer({
     <div
       dangerouslySetInnerHTML={{ __html: html }}
       {...props}
-      className={cls(props.className ?? '', 'prose max-w-full')}
+      className={cls(props.className ?? '', 'prose max-w-full dark:text-white')}
     >
       {props.children}
     </div>

diff --git a/src/utils/truncateText.ts b/src/utils/truncateText.ts
@@ -0,0 +1,8 @@
+const truncateText = (text: string, maxLength: number) => {
+  if (text.length <= maxLength) {
+    return text;
+  }
+  return text.slice(0, maxLength) + '...';
+};
+
+export default truncateText;