diff --git a/src/components/addquest.js b/src/components/addquest.js
new file mode 100644
index 0000000..e69de29
diff --git a/src/components/mainapp.js b/src/components/mainapp.js
index 5b2fcfd..fb22571 100644
--- a/src/components/mainapp.js
+++ b/src/components/mainapp.js
@@ -2,32 +2,69 @@ import React from "react";
import { useState } from "react";
import PropTypes from "prop-types";
import Stats from "./stats";
+import Quests from "./quests";
+import Quest from "./quest";
+import AddQuest from "./addquest";
-export default (player) => {
+export default (player, quest, sideQuest) => {
function MainApp(props) {
const [ playerStats, setPlayerStats ] = useState(null);
- // Possible values of display
+ const [ quests, setQuests ] = useState(null);
+ const [ sideQuests, setSideQuests ] = useState(null);
+
+ // Possible values of display.type
// main: The main display with stats, buttons for list/add
- const [ display ] = useState("main");
+ // quests: Shows all quests
+ // sideQuests: Shows all side quests
+ // quest: Shows a specific quest
+ // sideQuest: Shows a specific side quest
+ // addQuest: Add quest screen
+ // addSideQuest: Add side quest screen
+ const [ display, setDisplay ] = useState({ type: "main"});
+
const token = localStorage.getItem("token");
if (playerStats === null)
player.player(token).then((res) => setPlayerStats(res));
+ if (quests === null)
+ quest.getQuests(token).then((res) => setQuests(res));
+
+ if (sideQuests === null)
+ sideQuest.getSideQuests(token).then((res) => setSideQuests(res));
+
let body;
- if (display === "main")
+ if (display.type === "main")
body = (<>
Quests
-
-
+
+
Side Quests
-
-
+
+
>);
+ else if (display.type === "quests" || display.type === "sideQuests")
+ body = ;
+ else if (display.type === "quest" || display.type === "sideQuest")
+ body = ;
+ else if (display.type === "addQuest" || display.type === "addSideQuest")
+ body = ;
return (
diff --git a/src/components/quest.js b/src/components/quest.js
new file mode 100644
index 0000000..e69de29
diff --git a/src/components/quests.js b/src/components/quests.js
new file mode 100644
index 0000000..e69de29
diff --git a/src/index.js b/src/index.js
index fdabd2b..e72cda2 100644
--- a/src/index.js
+++ b/src/index.js
@@ -9,10 +9,10 @@ import mainapp from "./components/mainapp";
import models from "./models";
import swal from "sweetalert";
-const { player } = models(config, axios);
+const { player, quest, sideQuest } = models(config, axios);
const Login = login(player, swal);
-const MainApp = mainapp(player);
+const MainApp = mainapp(player, quest, sideQuest);
function App(){
const [loggedIn, setLoggedIn] = useState(false);
diff --git a/src/scss/index.scss b/src/scss/index.scss
index a084cbb..52cd0c8 100644
--- a/src/scss/index.scss
+++ b/src/scss/index.scss
@@ -29,14 +29,16 @@ body {
}
.main {
+ margin: 0 5%;
header {
width: 100%;
+ margin-top: 1em;
padding: 1em 3em;
display: flex;
justify-content: space-between;
}
.body {
- padding: 1em;
+ padding: 0 1em;
div {
margin: 1em 0;
box-sizing: border-box;