[FE] fix: 글 정보가 새로 reload 되지 않는 현상 수정 (#206)

* fix: 글 정보가 새로 reload 되지 않는 현상 수정

* refactor: 불필요한 console.log 제거

frontend/src/components/WritingPropertySection/WritingPropertySection.tsx

@@ -1,4 +1,4 @@
-import { Fragment, ReactElement } from 'react';
+import { Fragment, ReactElement, useEffect } from 'react';
 import { getWritingProperties } from 'apis/writings';
 import { CalendarIcon, MediumLogoIcon, TagIcon, TistoryLogoIcon } from 'assets/icons';
 import Tag from 'components/@common/Tag/Tag';
@@ -18,10 +18,17 @@ type Props = {
 };
 
 const WritingPropertySection = ({ writingId }: Props) => {
-  const { data: writingInfo } = useGetQuery<GetWritingPropertiesResponse>({
+  const { data: writingInfo, getData } = useGetQuery<GetWritingPropertiesResponse>({
     fetcher: () => getWritingProperties(writingId),
   });
 
+  useEffect(() => {
+    const refetch = async () => {
+      await getData();
+    };
+    refetch();
+  }, [writingId]);
+
   if (!writingInfo) return null;
 
   return (

frontend/src/components/WritingSideBar/WritingSideBar.stories.tsx

@@ -20,10 +20,10 @@ export default meta;
 type Story = StoryObj<typeof meta>;
 
 export const Primary: Story = {
-  render: ({ writingId }) => {
+  render: () => {
     return (
       <StoryContainer>
-        <WritingSideBar writingId={writingId} />
+        <WritingSideBar />
       </StoryContainer>
     );
   },

frontend/src/components/WritingSideBar/WritingSideBar.tsx

@@ -8,22 +8,22 @@ import { useState } from 'react';
 import { Blog } from 'types/domain';
 import WritingPropertySection from 'components/WritingPropertySection/WritingPropertySection';
 import Button from 'components/@common/Button/Button';
+import { useParams } from 'react-router-dom';
 
 export enum TabKeys {
   WritingProperty = 'WritingProperty',
   Publishing = 'Publishing',
   PublishingProperty = 'PublishingProperty',
 }
 
-type Props = { writingId: number };
-
 const ariaLabelFromTabKeys = {
   [TabKeys.WritingProperty]: '글 정보',
   [TabKeys.Publishing]: '발행 하기',
   [TabKeys.PublishingProperty]: '발행 정보',
 };
 
-const WritingSideBar = ({ writingId }: Props) => {
+const WritingSideBar = () => {
+  const writingId = Number(useParams()['writingId']);
   const { currentTab, selectCurrentTab } = useCurrentTab<TabKeys>(TabKeys.WritingProperty);
   const [publishTo, setPublishTo] = useState<Blog | null>(null);
 

frontend/src/pages/Layout/Layout.tsx

@@ -66,7 +66,7 @@ const Layout = () => {
         </S.Main>
         {isWritingViewerActive && (
           <S.RightSidebarSection $isRightSidebarOpen={isRightSidebarOpen}>
-            <WritingSideBar writingId={activeWritingId} />
+            <WritingSideBar />
           </S.RightSidebarSection>
         )}
       </S.Row>