내일기 리스트 계정 연결 완료 / css오류 수정 (#149)

src/app/App.tsx

@@ -4,6 +4,7 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import ToastContainer from '@/features/Toast/ui/ToastContainer';
 import { RouterProvider } from 'react-router-dom';
 import router from './router';
+import MyDiaryListPage from '@/pages/MyDiaryListPage';
 
 const queryClient = new QueryClient();
 
@@ -12,6 +13,7 @@ const App: React.FC = () => {
         <QueryClientProvider client={queryClient}>
             <GlobalStyles />
             <ToastContainer />
+            <MyDiaryListPage />
             <RouterProvider router={router} />
         </QueryClientProvider>
     );

src/features/chart/ui/EmotionChart.styled.ts

@@ -35,5 +35,5 @@ export const ChartWrapper = styled.div<SkeletonProps>`
 export const EmotionChartStlyed = styled.div`
     max-width: 960px;
     margin: auto;
-    padding: 150px 0;
+    padding-top: 150px;
 `;

src/pages/MyDiaryListPage/index.tsx

@@ -2,9 +2,11 @@ import EmotionChart from '@/features/chart/ui/EmotionChart';
 import TimelineContainer from '@/widgets/timeline-container/TimelineContainer';
 import { PickSort, MyDiaryListWrapper } from './indexCss';
 import { useEffect, useState } from 'react';
+import { useAuthStore } from '@/features/login/hooks/useAuthStore';
 
 const MyDiaryListPage = () => {
     const [sortState, setSortState] = useState('lastest');
+    const { email, userName, isLoggedin, setUserInfo } = useAuthStore();
     useEffect(() => {
         console.log(sortState);
     }, [sortState]);
@@ -36,7 +38,7 @@ const MyDiaryListPage = () => {
                 <TimelineContainer
                     titleTarget="나"
                     sort={sortState}
-                    email="[email protected]"
+                    email={email}
                 />
             </MyDiaryListWrapper>
         </div>

src/pages/MyDiaryListPage/indexCss.ts

@@ -9,7 +9,7 @@ export const MyDiaryListWrapper = styled.div`
 
 export const PickSort = styled.div<{ sortState: string }>`
     position: absolute;
-    top: 0;
+    top: 150px;
     right: 0;
     display: flex;
     gap: 1rem;