From 937ef16277b37ea8c84d1d32989b61e9c38b87e3 Mon Sep 17 00:00:00 2001
From: hazzeldorn <jonas@ohodesign.ch>
Date: Sun, 29 Oct 2023 07:15:41 +0100
Subject: [PATCH] refactor: tinder and taslist pages swapped

---
 frontend/src/app/page.js                  | 41 ++----------------
 frontend/src/app/page.module.css          | 30 -------------
 frontend/src/app/tasklist/page.js         | 51 +++++++++++++++++++++++
 frontend/src/app/tasklist/page.module.css | 29 +++++++++++++
 frontend/src/app/tinder/page.js           | 17 --------
 frontend/src/app/tinder/page.module.css   |  0
 6 files changed, 83 insertions(+), 85 deletions(-)
 create mode 100644 frontend/src/app/tasklist/page.js
 create mode 100644 frontend/src/app/tasklist/page.module.css
 delete mode 100644 frontend/src/app/tinder/page.js
 delete mode 100644 frontend/src/app/tinder/page.module.css

diff --git a/frontend/src/app/page.js b/frontend/src/app/page.js
index bff725e..2a26633 100644
--- a/frontend/src/app/page.js
+++ b/frontend/src/app/page.js
@@ -2,51 +2,16 @@
 
 import { useState, useEffect } from "react";
 import styles from "./page.module.css";
-import TaskRow from "./components/TaskRow/TaskRow";
+import TinderSwiper from "@/app/components/TinderSwiper/TinderSwiper";
+
 import defaultTasks from "./testdata/tasks.js";
-import Popover from "./components/Popover/Popover";
-import AddCircleRoundedIcon from '@mui/icons-material/AddCircleRounded';
-import AddTask from "./components/Tasks/AddTask";
 
 export default function Home() {
   const [tasks, setTasks] = useState(defaultTasks);
 
-  /*
-  const fetchTaskList = async () => {
-    try {
-      const response = await fetch(`http://localhost:5000/getTasks`);
-      if (!response.ok) {
-        throw new Error("Network response was not ok");
-      }
-      const data = await response.json();
-      console.log(data);
-      setTasks(data);
-    } catch (error) {
-      console.error("Error fetching user data:", error);
-    }
-  };
-
-  useEffect(() => {
-    fetchTaskList();
-  }, []);
-  */
-
   return (
     <>
-      <Popover
-        trigger={
-          <div className={styles.addTaskIcon}>
-            <AddCircleRoundedIcon
-              className={styles.icon__add}
-            />
-          </div>
-        }
-      >
-        <AddTask />
-      </Popover>
-      {tasks.map(({ name, id }) => {
-        return <TaskRow key={id} taskName={name} />;
-      })}
+      <TinderSwiper tasks={tasks} />
     </>
   );
 }
diff --git a/frontend/src/app/page.module.css b/frontend/src/app/page.module.css
index 297ff82..44c9a9e 100644
--- a/frontend/src/app/page.module.css
+++ b/frontend/src/app/page.module.css
@@ -115,36 +115,6 @@
   position: relative;
 }
 
-.addTaskIcon:before {
-  content: "";
-  position: absolute;
-  top: 25%;
-  left: 25%;
-  width: 50%;
-  height: 50%;
-  border-radius: 50%;
-  background: var(--color_white);
-}
-
-.addTaskIcon {
-  position: absolute;
-  color: var(--color_purple);
-  width: 4.5rem;
-  height: 4.5rem;
-  transform: translate(-50%, -50%);
-  border-radius: 50%;
-  cursor: pointer;
-  z-index: 1;
-}
-
-.icon__add {
-  position: absolute;
-  width: 100%;
-  height: 100%;
-  color: var(--color_purple);
-  z-index: 5;
-}
-
 /* Enable hover only on non-touch devices */
 @media (hover: hover) and (pointer: fine) {
   .card:hover {
diff --git a/frontend/src/app/tasklist/page.js b/frontend/src/app/tasklist/page.js
new file mode 100644
index 0000000..0162830
--- /dev/null
+++ b/frontend/src/app/tasklist/page.js
@@ -0,0 +1,51 @@
+"use client";
+
+import Image from "next/image";
+import styles from "./page.module.css";
+import TaskRow from "@/app/components/TaskRow/TaskRow";
+import Popover from "@/app/components/Popover/Popover";
+import AddTask from "@/app/components/Tasks/AddTask";
+import AddCircleRoundedIcon from "@mui/icons-material/AddCircleRounded";
+import defaultTask from "@/app/testdata/tasks";
+import React, { useState, useEffect } from "react";
+
+export default function Tinder() {
+  const [tasks, setTasks] = useState(defaultTask);
+
+  /*
+  const fetchTaskList = async () => {
+    try {
+      const response = await fetch(`http://localhost:5000/getTasks`);
+      if (!response.ok) {
+        throw new Error("Network response was not ok");
+      }
+      const data = await response.json();
+      console.log(data);
+      setTasks(data);
+    } catch (error) {
+      console.error("Error fetching user data:", error);
+    }
+  };
+
+  useEffect(() => {
+    fetchTaskList();
+  }, []);
+  */
+
+  return (
+    <>
+      <Popover
+        trigger={
+          <div className={styles.addTaskIcon}>
+            <AddCircleRoundedIcon className={styles.icon__add} />
+          </div>
+        }
+      >
+        <AddTask />
+      </Popover>
+      {tasks.map(({ name, id }) => {
+        return <TaskRow key={id} taskName={name} />;
+      })}
+    </>
+  );
+}
diff --git a/frontend/src/app/tasklist/page.module.css b/frontend/src/app/tasklist/page.module.css
new file mode 100644
index 0000000..6468af3
--- /dev/null
+++ b/frontend/src/app/tasklist/page.module.css
@@ -0,0 +1,29 @@
+.addTaskIcon:before {
+  content: "";
+  position: absolute;
+  top: 25%;
+  left: 25%;
+  width: 50%;
+  height: 50%;
+  border-radius: 50%;
+  background: var(--color_white);
+}
+
+.addTaskIcon {
+  position: absolute;
+  color: var(--color_purple);
+  width: 4.5rem;
+  height: 4.5rem;
+  transform: translate(-50%, -50%);
+  border-radius: 50%;
+  cursor: pointer;
+  z-index: 1;
+}
+
+.icon__add {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  color: var(--color_purple);
+  z-index: 5;
+}
diff --git a/frontend/src/app/tinder/page.js b/frontend/src/app/tinder/page.js
deleted file mode 100644
index 982a7f6..0000000
--- a/frontend/src/app/tinder/page.js
+++ /dev/null
@@ -1,17 +0,0 @@
-"use client";
-
-import Image from "next/image";
-import styles from "./page.module.css";
-import TinderSwiper from "../components/TinderSwiper/TinderSwiper";
-import React, { useState } from "react";
-import defaultTask from "@/app/testdata/tasks";
-
-export default function Tinder() {
-  const [tasks, setTasks] = useState(defaultTask);
-
-  return (
-    <>
-      <TinderSwiper tasks={tasks} />
-    </>
-  );
-}
diff --git a/frontend/src/app/tinder/page.module.css b/frontend/src/app/tinder/page.module.css
deleted file mode 100644
index e69de29..0000000