From b6beb5f02e8c291f2b5f2bc7d0c15d0955336c32 Mon Sep 17 00:00:00 2001
From: Jan Tuomi <jans.tuomi@gmail.com>
Date: Fri, 2 Jul 2021 11:19:25 +0300
Subject: Implement research papers

---
 frontend/pages/index.tsx | 25 ++++++++++++-------------
 1 file changed, 12 insertions(+), 13 deletions(-)

(limited to 'frontend/pages/index.tsx')

diff --git a/frontend/pages/index.tsx b/frontend/pages/index.tsx
index 58b3b56..6193488 100644
--- a/frontend/pages/index.tsx
+++ b/frontend/pages/index.tsx
@@ -7,19 +7,9 @@ import styles from "../styles/Home.module.css";
 
 const socket = io(config.backendUrl);
 
-const mockData: MarqueeLink[] = [
-    { title: "Foobar of Foos and Bars", url: "https://example.com" },
-    { title: "Foobar of Foos and Bars", url: "https://example.com" },
-    { title: "Foobar of Foos and Bars", url: "https://example.com" },
-    { title: "Foobar of Foos and Bars", url: "https://example.com" },
-    { title: "Foobar of Foos and Bars", url: "https://example.com" },
-    { title: "Foobar of Foos and Bars", url: "https://example.com" },
-    { title: "Foobar of Foos and Bars", url: "https://example.com" },
-    { title: "Foobar of Foos and Bars", url: "https://example.com" },
-];
-
 const Home = (): ReactElement => {
     const [value, setValue] = useState<number | undefined>(undefined);
+    const [papers, setPapers] = useState<MarqueeLink[]>([]);
 
     useEffect(() => {
         socket.on("connect", () => {
@@ -29,11 +19,20 @@ const Home = (): ReactElement => {
             console.log("disconnected, reason:", reason);
         });
         socket.on("update", (arg: number) => {
-            console.log("update:", arg);
             setValue(arg);
         });
     });
 
+    useEffect(() => {
+        async function fetchPapers() {
+            const resp = await fetch(`${config.backendUrl}/api/papers`);
+            const data = await resp.json();
+
+            setPapers(data);
+        }
+        fetchPapers();
+    }, []);
+
     const increment = () => {
         socket.emit("increment");
     };
@@ -57,7 +56,7 @@ const Home = (): ReactElement => {
                     <img src="/tomi_sq.png" alt="" />
                 </div>
             </button>
-            <Marquees links={mockData} />
+            <Marquees links={papers} />
         </div>
     );
 };
-- 
cgit v1.3

