- This tool aims to provide Medical and Health Science students at the University of Auckland with a tool that supports interactive and immersive education through virtual patient scenarios.
-
-
-`;
diff --git a/frontend/src/containers/pages/test_icon_2.jpg b/frontend/src/containers/pages/test_icon_2.jpg
deleted file mode 100644
index 999abd33..00000000
Binary files a/frontend/src/containers/pages/test_icon_2.jpg and /dev/null differ
diff --git a/frontend/src/context/.gitkeep b/frontend/src/context/.gitkeep
deleted file mode 100644
index e69de29b..00000000
diff --git a/frontend/src/containers/pages/AuthoringTool/AuthoringToolPage.jsx b/frontend/src/features/authoring/AuthoringToolPage.jsx
similarity index 86%
rename from frontend/src/containers/pages/AuthoringTool/AuthoringToolPage.jsx
rename to frontend/src/features/authoring/AuthoringToolPage.jsx
index fd0c0e8c..6a27efd5 100644
--- a/frontend/src/containers/pages/AuthoringTool/AuthoringToolPage.jsx
+++ b/frontend/src/features/authoring/AuthoringToolPage.jsx
@@ -1,16 +1,16 @@
import { Button } from "@material-ui/core";
import { useContext, useEffect, useState } from "react";
import { useHistory, useParams } from "react-router-dom";
-import HelpButton from "../../../components/HelpButton";
-import ScreenContainer from "../../../components/ScreenContainer";
-import TopBar from "../../../components/TopBar";
-import AuthenticationContext from "../../../context/AuthenticationContext";
-import AuthoringToolContext from "../../../context/AuthoringToolContext";
-import ScenarioContext from "../../../context/ScenarioContext";
-import SceneContext from "../../../context/SceneContext";
-import ToolbarContextProvider from "../../../context/ToolbarContextProvider";
-import { uploadFiles } from "../../../firebase/storage";
-import { useGet, usePut } from "../../../hooks/crudHooks";
+import HelpButton from "components/HelpButton";
+import ScreenContainer from "components/ScreenContainer/ScreenContainer";
+import TopBar from "components/TopBar/TopBar";
+import AuthenticationContext from "context/AuthenticationContext";
+import AuthoringToolContext from "context/AuthoringToolContext";
+import ScenarioContext from "context/ScenarioContext";
+import SceneContext from "context/SceneContext";
+import ToolbarContextProvider from "context/ToolbarContextProvider";
+import { uploadFiles } from "../../firebase/storage";
+import { useGet, usePut } from "hooks/crudHooks";
import Canvas from "./Canvas/Canvas";
import CanvasSideBar from "./CanvasSideBar/CanvasSideBar";
import SceneNavigator from "./SceneNavigator/SceneNavigator";
diff --git a/frontend/src/containers/pages/AuthoringTool/Canvas/Canvas.jsx b/frontend/src/features/authoring/Canvas/Canvas.jsx
similarity index 95%
rename from frontend/src/containers/pages/AuthoringTool/Canvas/Canvas.jsx
rename to frontend/src/features/authoring/Canvas/Canvas.jsx
index cd192159..6d0224b1 100644
--- a/frontend/src/containers/pages/AuthoringTool/Canvas/Canvas.jsx
+++ b/frontend/src/features/authoring/Canvas/Canvas.jsx
@@ -4,9 +4,9 @@
import { useContext, useEffect } from "react";
import Moveable from "react-moveable";
-import AuthoringToolContext from "../../../../context/AuthoringToolContext";
-import SceneContext from "../../../../context/SceneContext";
-import styles from "../../../../styling/Canvas.module.scss";
+import AuthoringToolContext from "../../../context/AuthoringToolContext";
+import SceneContext from "../../../context/SceneContext";
+import styles from "./Canvas.module.scss";
import componentResolver from "./componentResolver";
/**
diff --git a/frontend/src/styling/Canvas.module.scss b/frontend/src/features/authoring/Canvas/Canvas.module.scss
similarity index 100%
rename from frontend/src/styling/Canvas.module.scss
rename to frontend/src/features/authoring/Canvas/Canvas.module.scss
diff --git a/frontend/src/containers/pages/AuthoringTool/Canvas/componentResolver.jsx b/frontend/src/features/authoring/Canvas/componentResolver.jsx
similarity index 83%
rename from frontend/src/containers/pages/AuthoringTool/Canvas/componentResolver.jsx
rename to frontend/src/features/authoring/Canvas/componentResolver.jsx
index f6f95c4f..0515821b 100644
--- a/frontend/src/containers/pages/AuthoringTool/Canvas/componentResolver.jsx
+++ b/frontend/src/features/authoring/Canvas/componentResolver.jsx
@@ -1,10 +1,10 @@
/* eslint-disable no-param-reassign */
-import ButtonComponent from "../Components/ButtonComponent";
-import FirebaseAudioComponent from "../Components/FirebaseAudioComponent";
-import FirebaseImageComponent from "../Components/FirebaseImageComponent";
-import ImageComponent from "../Components/ImageComponent";
-import SpeechTextComponent from "../Components/SpeechTextComponent";
-import TextComponent from "../Components/TextComponent";
+import ButtonComponent from "../components/ButtonComponent";
+import FirebaseAudioComponent from "../components/FirebaseAudioComponent";
+import FirebaseImageComponent from "../components/FirebaseImageComponent";
+import ImageComponent from "../components/ImageComponent";
+import SpeechTextComponent from "../components/SpeechTextComponent";
+import TextComponent from "../components/TextComponent";
/**
* This function returns the appropriate React component for a scene component object when editing
diff --git a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/CanvasSideBar.jsx b/frontend/src/features/authoring/CanvasSideBar/CanvasSideBar.jsx
similarity index 57%
rename from frontend/src/containers/pages/AuthoringTool/CanvasSideBar/CanvasSideBar.jsx
rename to frontend/src/features/authoring/CanvasSideBar/CanvasSideBar.jsx
index 1324ac45..6e66c13a 100644
--- a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/CanvasSideBar.jsx
+++ b/frontend/src/features/authoring/CanvasSideBar/CanvasSideBar.jsx
@@ -1,7 +1,7 @@
-import ComponentProperties from "./ComponentProperties";
-import SceneSettings from "./SceneSettings";
+import ComponentProperties from "features/authoring/CanvasSideBar/ComponentProperties";
+import SceneSettings from "features/authoring/CanvasSideBar/SceneSettings";
-import styles from "../../../../styling/CanvasSideBar.module.scss";
+import styles from "./CanvasSideBar.module.scss";
/**
* This component displays the properties of scene components in a sidebar
diff --git a/frontend/src/styling/CanvasSideBar.module.scss b/frontend/src/features/authoring/CanvasSideBar/CanvasSideBar.module.scss
similarity index 100%
rename from frontend/src/styling/CanvasSideBar.module.scss
rename to frontend/src/features/authoring/CanvasSideBar/CanvasSideBar.module.scss
diff --git a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties.jsx b/frontend/src/features/authoring/CanvasSideBar/ComponentProperties.jsx
similarity index 81%
rename from frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties.jsx
rename to frontend/src/features/authoring/CanvasSideBar/ComponentProperties.jsx
index 3047a607..7f548c48 100644
--- a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties.jsx
+++ b/frontend/src/features/authoring/CanvasSideBar/ComponentProperties.jsx
@@ -1,9 +1,9 @@
import { useContext } from "react";
-import AuthoringToolContext from "../../../../context/AuthoringToolContext";
-import SceneContext from "../../../../context/SceneContext";
+import AuthoringToolContext from "context/AuthoringToolContext";
+import SceneContext from "context/SceneContext";
import componentPropertiesResolver from "./componentPropertiesResolver";
-import styles from "../../../../styling/CanvasSideBar.module.scss";
+import styles from "./CanvasSideBar.module.scss";
/**
* This component displays the properties the selected scene component
diff --git a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties/ButtonPropertiesComponent.jsx b/frontend/src/features/authoring/CanvasSideBar/ComponentProperties/ButtonPropertiesComponent.jsx
similarity index 94%
rename from frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties/ButtonPropertiesComponent.jsx
rename to frontend/src/features/authoring/CanvasSideBar/ComponentProperties/ButtonPropertiesComponent.jsx
index 68ebb09d..5ab7ba77 100644
--- a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties/ButtonPropertiesComponent.jsx
+++ b/frontend/src/features/authoring/CanvasSideBar/ComponentProperties/ButtonPropertiesComponent.jsx
@@ -11,12 +11,12 @@ import {
Typography,
} from "@material-ui/core";
import { useContext, useState } from "react";
-import SceneContext from "../../../../../context/SceneContext";
-import CustomInputLabelStyles from "../CustomPropertyInputStyles/CustomInputLabelStyles";
-import CustomTextFieldStyles from "../CustomPropertyInputStyles/CustomTextFieldStyles";
-import CustomCheckBoxStyles from "../CustomPropertyInputStyles/CustomCheckBoxStyles";
+import SceneContext from "context/SceneContext";
+import CustomInputLabelStyles from "features/authoring/CanvasSideBar/CustomPropertyInputStyles/CustomInputLabelStyles";
+import CustomTextFieldStyles from "features/authoring/CanvasSideBar/CustomPropertyInputStyles/CustomTextFieldStyles";
+import CustomCheckBoxStyles from "features/authoring/CanvasSideBar/CustomPropertyInputStyles/CustomCheckBoxStyles";
-import styles from "../../../../../styling/CanvasSideBar.module.scss";
+import styles from "../CanvasSideBar.module.scss";
const CustomTextField = CustomTextFieldStyles()(TextField);
const CustomInputLabel = CustomInputLabelStyles()(InputLabel);
diff --git a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties/FirebaseAudioPropertiesComponent.jsx b/frontend/src/features/authoring/CanvasSideBar/ComponentProperties/FirebaseAudioPropertiesComponent.jsx
similarity index 90%
rename from frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties/FirebaseAudioPropertiesComponent.jsx
rename to frontend/src/features/authoring/CanvasSideBar/ComponentProperties/FirebaseAudioPropertiesComponent.jsx
index fa2ba191..b18c4468 100644
--- a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties/FirebaseAudioPropertiesComponent.jsx
+++ b/frontend/src/features/authoring/CanvasSideBar/ComponentProperties/FirebaseAudioPropertiesComponent.jsx
@@ -8,11 +8,11 @@ import {
import PauseIcon from "@material-ui/icons/PauseRounded";
import PlayArrowIcon from "@material-ui/icons/PlayArrowRounded";
import { useContext, useEffect, useState } from "react";
-import SceneContext from "../../../../../context/SceneContext";
-import CustomCheckBoxStyles from "../CustomPropertyInputStyles/CustomCheckBoxStyles";
-import CustomTextFieldStyles from "../CustomPropertyInputStyles/CustomTextFieldStyles";
+import SceneContext from "context/SceneContext";
+import CustomCheckBoxStyles from "features/authoring/CanvasSideBar/CustomPropertyInputStyles/CustomCheckBoxStyles";
+import CustomTextFieldStyles from "features/authoring/CanvasSideBar/CustomPropertyInputStyles/CustomTextFieldStyles";
-import styles from "../../../../../styling/CanvasSideBar.module.scss";
+import styles from "../CanvasSideBar.module.scss";
import useStyles from "./FirebaseAudioPropertiesComponent.styles";
const CustomTextField = CustomTextFieldStyles()(TextField);
diff --git a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties/FirebaseAudioPropertiesComponent.styles.jsx b/frontend/src/features/authoring/CanvasSideBar/ComponentProperties/FirebaseAudioPropertiesComponent.styles.jsx
similarity index 100%
rename from frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties/FirebaseAudioPropertiesComponent.styles.jsx
rename to frontend/src/features/authoring/CanvasSideBar/ComponentProperties/FirebaseAudioPropertiesComponent.styles.jsx
diff --git a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties/ImagePropertiesComponent.jsx b/frontend/src/features/authoring/CanvasSideBar/ComponentProperties/ImagePropertiesComponent.jsx
similarity index 84%
rename from frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties/ImagePropertiesComponent.jsx
rename to frontend/src/features/authoring/CanvasSideBar/ComponentProperties/ImagePropertiesComponent.jsx
index cb062e5a..6d5f8055 100644
--- a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties/ImagePropertiesComponent.jsx
+++ b/frontend/src/features/authoring/CanvasSideBar/ComponentProperties/ImagePropertiesComponent.jsx
@@ -6,11 +6,11 @@ import {
TextField,
} from "@material-ui/core";
import { useContext } from "react";
-import SceneContext from "../../../../../context/SceneContext";
-import CustomInputLabelStyles from "../CustomPropertyInputStyles/CustomInputLabelStyles";
-import CustomTextFieldStyles from "../CustomPropertyInputStyles/CustomTextFieldStyles";
+import SceneContext from "context/SceneContext";
+import CustomInputLabelStyles from "features/authoring/CanvasSideBar/CustomPropertyInputStyles/CustomInputLabelStyles";
+import CustomTextFieldStyles from "features/authoring/CanvasSideBar/CustomPropertyInputStyles/CustomTextFieldStyles";
-import styles from "../../../../../styling/CanvasSideBar.module.scss";
+import styles from "../CanvasSideBar.module.scss";
const CustomTextField = CustomTextFieldStyles()(TextField);
const CustomInputLabel = CustomInputLabelStyles()(InputLabel);
diff --git a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties/SpeechTextPropertiesComponent.jsx b/frontend/src/features/authoring/CanvasSideBar/ComponentProperties/SpeechTextPropertiesComponent.jsx
similarity index 94%
rename from frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties/SpeechTextPropertiesComponent.jsx
rename to frontend/src/features/authoring/CanvasSideBar/ComponentProperties/SpeechTextPropertiesComponent.jsx
index 91fd4215..46cf8064 100644
--- a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties/SpeechTextPropertiesComponent.jsx
+++ b/frontend/src/features/authoring/CanvasSideBar/ComponentProperties/SpeechTextPropertiesComponent.jsx
@@ -15,9 +15,9 @@ import AuthoringToolContext from "context/AuthoringToolContext";
import SceneContext from "context/SceneContext";
import { useContext, useEffect, useRef } from "react";
-import styles from "styling/CanvasSideBar.module.scss";
-import CustomTextFieldStyles from "../CustomPropertyInputStyles/CustomTextFieldStyles";
-import CustomInputLabelStyles from "../CustomPropertyInputStyles/CustomInputLabelStyles";
+import styles from "../CanvasSideBar.module.scss";
+import CustomTextFieldStyles from "features/authoring/CanvasSideBar/CustomPropertyInputStyles/CustomTextFieldStyles";
+import CustomInputLabelStyles from "features/authoring/CanvasSideBar/CustomPropertyInputStyles/CustomInputLabelStyles";
import useStyles from "./TextPropertiesComponent.styles";
const CustomTextField = CustomTextFieldStyles()(TextField);
diff --git a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties/TextPropertiesComponent.jsx b/frontend/src/features/authoring/CanvasSideBar/ComponentProperties/TextPropertiesComponent.jsx
similarity index 92%
rename from frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties/TextPropertiesComponent.jsx
rename to frontend/src/features/authoring/CanvasSideBar/ComponentProperties/TextPropertiesComponent.jsx
index 0a10d13e..cccaf2ce 100644
--- a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties/TextPropertiesComponent.jsx
+++ b/frontend/src/features/authoring/CanvasSideBar/ComponentProperties/TextPropertiesComponent.jsx
@@ -18,10 +18,10 @@ import { useContext, useEffect, useRef } from "react";
import AuthoringToolContext from "context/AuthoringToolContext";
import SceneContext from "context/SceneContext";
-import styles from "styling/CanvasSideBar.module.scss";
-import CustomCheckBoxStyles from "../CustomPropertyInputStyles/CustomCheckBoxStyles";
-import CustomTextFieldStyles from "../CustomPropertyInputStyles/CustomTextFieldStyles";
-import CustomInputLabelStyles from "../CustomPropertyInputStyles/CustomInputLabelStyles";
+import styles from "../CanvasSideBar.module.scss";
+import CustomCheckBoxStyles from "features/authoring/CanvasSideBar/CustomPropertyInputStyles/CustomCheckBoxStyles";
+import CustomTextFieldStyles from "features/authoring/CanvasSideBar/CustomPropertyInputStyles/CustomTextFieldStyles";
+import CustomInputLabelStyles from "features/authoring/CanvasSideBar/CustomPropertyInputStyles/CustomInputLabelStyles";
import useStyles from "./TextPropertiesComponent.styles";
const CustomTextField = CustomTextFieldStyles()(TextField);
diff --git a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties/TextPropertiesComponent.styles.jsx b/frontend/src/features/authoring/CanvasSideBar/ComponentProperties/TextPropertiesComponent.styles.jsx
similarity index 100%
rename from frontend/src/containers/pages/AuthoringTool/CanvasSideBar/ComponentProperties/TextPropertiesComponent.styles.jsx
rename to frontend/src/features/authoring/CanvasSideBar/ComponentProperties/TextPropertiesComponent.styles.jsx
diff --git a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/CustomPropertyInputStyles/CustomCheckBoxStyles.js b/frontend/src/features/authoring/CanvasSideBar/CustomPropertyInputStyles/CustomCheckBoxStyles.js
similarity index 100%
rename from frontend/src/containers/pages/AuthoringTool/CanvasSideBar/CustomPropertyInputStyles/CustomCheckBoxStyles.js
rename to frontend/src/features/authoring/CanvasSideBar/CustomPropertyInputStyles/CustomCheckBoxStyles.js
diff --git a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/CustomPropertyInputStyles/CustomInputLabelStyles.js b/frontend/src/features/authoring/CanvasSideBar/CustomPropertyInputStyles/CustomInputLabelStyles.js
similarity index 100%
rename from frontend/src/containers/pages/AuthoringTool/CanvasSideBar/CustomPropertyInputStyles/CustomInputLabelStyles.js
rename to frontend/src/features/authoring/CanvasSideBar/CustomPropertyInputStyles/CustomInputLabelStyles.js
diff --git a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/CustomPropertyInputStyles/CustomTextFieldStyles.js b/frontend/src/features/authoring/CanvasSideBar/CustomPropertyInputStyles/CustomTextFieldStyles.js
similarity index 100%
rename from frontend/src/containers/pages/AuthoringTool/CanvasSideBar/CustomPropertyInputStyles/CustomTextFieldStyles.js
rename to frontend/src/features/authoring/CanvasSideBar/CustomPropertyInputStyles/CustomTextFieldStyles.js
diff --git a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/SceneSettings.jsx b/frontend/src/features/authoring/CanvasSideBar/SceneSettings.jsx
similarity index 98%
rename from frontend/src/containers/pages/AuthoringTool/CanvasSideBar/SceneSettings.jsx
rename to frontend/src/features/authoring/CanvasSideBar/SceneSettings.jsx
index 08a375f7..d5310613 100644
--- a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/SceneSettings.jsx
+++ b/frontend/src/features/authoring/CanvasSideBar/SceneSettings.jsx
@@ -14,9 +14,9 @@ import TextField from "@material-ui/core/TextField";
import { withStyles } from "@material-ui/core/styles";
import { useContext, useState, useEffect } from "react";
import ScenarioContext from "context/ScenarioContext";
-import SceneContext from "../../../../context/SceneContext";
+import SceneContext from "context/SceneContext";
-import styles from "../../../../styling/CanvasSideBar.module.scss";
+import styles from "./CanvasSideBar.module.scss";
import CustomInputLabelStyles from "./CustomPropertyInputStyles/CustomInputLabelStyles";
import CustomCheckBoxStyles from "./CustomPropertyInputStyles/CustomCheckBoxStyles";
diff --git a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/componentPropertiesResolver.jsx b/frontend/src/features/authoring/CanvasSideBar/componentPropertiesResolver.jsx
similarity index 67%
rename from frontend/src/containers/pages/AuthoringTool/CanvasSideBar/componentPropertiesResolver.jsx
rename to frontend/src/features/authoring/CanvasSideBar/componentPropertiesResolver.jsx
index bcff8748..021c3b00 100644
--- a/frontend/src/containers/pages/AuthoringTool/CanvasSideBar/componentPropertiesResolver.jsx
+++ b/frontend/src/features/authoring/CanvasSideBar/componentPropertiesResolver.jsx
@@ -1,8 +1,8 @@
-import ButtonPropertiesComponent from "./ComponentProperties/ButtonPropertiesComponent";
-import FirebaseAudioPropertiesComponent from "./ComponentProperties/FirebaseAudioPropertiesComponent";
-import ImagePropertiesComponent from "./ComponentProperties/ImagePropertiesComponent";
-import SpeechTextPropertiesComponent from "./ComponentProperties/SpeechTextPropertiesComponent";
-import TextPropertiesComponent from "./ComponentProperties/TextPropertiesComponent";
+import ButtonPropertiesComponent from "features/authoring/CanvasSideBar/ComponentProperties/ButtonPropertiesComponent";
+import FirebaseAudioPropertiesComponent from "features/authoring/CanvasSideBar/ComponentProperties/FirebaseAudioPropertiesComponent";
+import ImagePropertiesComponent from "features/authoring/CanvasSideBar/ComponentProperties/ImagePropertiesComponent";
+import SpeechTextPropertiesComponent from "features/authoring/CanvasSideBar/ComponentProperties/SpeechTextPropertiesComponent";
+import TextPropertiesComponent from "features/authoring/CanvasSideBar/ComponentProperties/TextPropertiesComponent";
/**
* This function returns the appropriate properties component for a scene component object
*
diff --git a/frontend/src/features/authoring/SceneNavigator/SceneListItem.jsx b/frontend/src/features/authoring/SceneNavigator/SceneListItem.jsx
new file mode 100644
index 00000000..da737d9a
--- /dev/null
+++ b/frontend/src/features/authoring/SceneNavigator/SceneListItem.jsx
@@ -0,0 +1,5 @@
+const SceneListItem = ({ sceneId, thumbnail }) => {
+ return
{thumbnail}
;
+};
+
+export default SceneListItem;
diff --git a/frontend/src/containers/pages/AuthoringTool/SceneNavigator/SceneNavigator.jsx b/frontend/src/features/authoring/SceneNavigator/SceneNavigator.jsx
similarity index 95%
rename from frontend/src/containers/pages/AuthoringTool/SceneNavigator/SceneNavigator.jsx
rename to frontend/src/features/authoring/SceneNavigator/SceneNavigator.jsx
index 815a82a8..b610a8a1 100644
--- a/frontend/src/containers/pages/AuthoringTool/SceneNavigator/SceneNavigator.jsx
+++ b/frontend/src/features/authoring/SceneNavigator/SceneNavigator.jsx
@@ -1,9 +1,9 @@
import SceneContext from "context/SceneContext";
import { useContext, useEffect, useState } from "react";
import { useHistory, useParams } from "react-router-dom";
-import styles from "styling/SceneNavigator.module.scss";
+import styles from "./SceneNavigator.module.scss";
import SceneListItem from "./SceneListItem";
-import Thumbnail from "../Components/Thumbnail";
+import Thumbnail from "../components/Thumbnail";
const SceneNavigator = ({ saveScene }) => {
const [thumbnails, setThumbnails] = useState(null);
diff --git a/frontend/src/styling/SceneNavigator.module.scss b/frontend/src/features/authoring/SceneNavigator/SceneNavigator.module.scss
similarity index 94%
rename from frontend/src/styling/SceneNavigator.module.scss
rename to frontend/src/features/authoring/SceneNavigator/SceneNavigator.module.scss
index 6a3649f6..0a52b706 100644
--- a/frontend/src/styling/SceneNavigator.module.scss
+++ b/frontend/src/features/authoring/SceneNavigator/SceneNavigator.module.scss
@@ -1,43 +1,43 @@
-.sceneNavigator {
- background-color: #f0f0f0;
- filter: drop-shadow(2.5px 0 5px rgba(0, 0, 0, 0.1));
- padding: 1rem 1rem 1rem 1rem;
- display: flex;
- flex-direction: column;
-
- position: relative;
- z-index: 10;
-
- overflow-y: auto;
- overflow-x: hidden;
- gap: 1rem;
- align-items: flex-start;
- justify-content: stretch;
-
- li {
- display: flex;
- align-items: center;
- gap: 10px;
- }
-
- .sceneButton {
- border: 3px solid transparent;
- width: 160px;
- background-color: transparent;
- position: relative;
- overflow: hidden;
-
- .sceneText {
- font-size: small;
- z-index: 2;
- position: absolute;
- left: -20px;
- top: -5px;
- color: #727272;
- }
- }
-
- .sceneButton:hover {
- border: 3px solid #cfcfcf;
- }
-}
+.sceneNavigator {
+ background-color: #f0f0f0;
+ filter: drop-shadow(2.5px 0 5px rgba(0, 0, 0, 0.1));
+ padding: 1rem 1rem 1rem 1rem;
+ display: flex;
+ flex-direction: column;
+
+ position: relative;
+ z-index: 10;
+
+ overflow-y: auto;
+ overflow-x: hidden;
+ gap: 1rem;
+ align-items: flex-start;
+ justify-content: stretch;
+
+ li {
+ display: flex;
+ align-items: center;
+ gap: 10px;
+ }
+
+ .sceneButton {
+ border: 3px solid transparent;
+ width: 160px;
+ background-color: transparent;
+ position: relative;
+ overflow: hidden;
+
+ .sceneText {
+ font-size: small;
+ z-index: 2;
+ position: absolute;
+ left: -20px;
+ top: -5px;
+ color: #727272;
+ }
+ }
+
+ .sceneButton:hover {
+ border: 3px solid #cfcfcf;
+ }
+}
diff --git a/frontend/src/containers/pages/AuthoringTool/ToolBar/Background/ChooseBackgroundModal.jsx b/frontend/src/features/authoring/ToolBar/Background/ChooseBackgroundModal.jsx
similarity index 75%
rename from frontend/src/containers/pages/AuthoringTool/ToolBar/Background/ChooseBackgroundModal.jsx
rename to frontend/src/features/authoring/ToolBar/Background/ChooseBackgroundModal.jsx
index 0c6f0b5d..a49493f3 100644
--- a/frontend/src/containers/pages/AuthoringTool/ToolBar/Background/ChooseBackgroundModal.jsx
+++ b/frontend/src/features/authoring/ToolBar/Background/ChooseBackgroundModal.jsx
@@ -1,11 +1,11 @@
import Button from "@material-ui/core/Button";
import { useContext, useState } from "react";
-import ImageListContainer from "../../../../../components/ImageListContainer";
-import ModalDialogue from "../../../../../components/ModalDialogue";
-import SceneContext from "../../../../../context/SceneContext";
-import ToolbarContext from "../../../../../context/ToolbarContext";
-import { useGet } from "../../../../../hooks/crudHooks";
-import styles from "../../../../../styling/ChooseBackgroundModal.module.scss";
+import ImageListContainer from "components/ListContainer/ImageListContainer";
+import ModalDialogue from "components/ModalDialogue";
+import SceneContext from "context/SceneContext";
+import ToolbarContext from "context/ToolbarContext";
+import { useGet } from "hooks/crudHooks";
+import styles from "./ChooseBackgroundModal.module.scss";
import { addImage } from "../ToolBarActions";
/**
diff --git a/frontend/src/styling/ChooseBackgroundModal.module.scss b/frontend/src/features/authoring/ToolBar/Background/ChooseBackgroundModal.module.scss
similarity index 100%
rename from frontend/src/styling/ChooseBackgroundModal.module.scss
rename to frontend/src/features/authoring/ToolBar/Background/ChooseBackgroundModal.module.scss
diff --git a/frontend/src/containers/pages/AuthoringTool/ToolBar/Background/ChooseBackgroundSubMenu.jsx b/frontend/src/features/authoring/ToolBar/Background/ChooseBackgroundSubMenu.jsx
similarity index 92%
rename from frontend/src/containers/pages/AuthoringTool/ToolBar/Background/ChooseBackgroundSubMenu.jsx
rename to frontend/src/features/authoring/ToolBar/Background/ChooseBackgroundSubMenu.jsx
index ef725cbd..82a4b1af 100644
--- a/frontend/src/containers/pages/AuthoringTool/ToolBar/Background/ChooseBackgroundSubMenu.jsx
+++ b/frontend/src/features/authoring/ToolBar/Background/ChooseBackgroundSubMenu.jsx
@@ -1,6 +1,6 @@
import { MenuItem } from "@material-ui/core";
import CloudQueueIcon from "@material-ui/icons/CloudQueue";
-import styles from "../../../../../styling/ToolBar.module.scss";
+import styles from "../ToolBar.module.scss";
import ChooseBackgroundModal from "./ChooseBackgroundModal";
import useChooseBackgroundModal from "./useChooseBackgroundModal";
diff --git a/frontend/src/containers/pages/AuthoringTool/ToolBar/Background/UploadImage.jsx b/frontend/src/features/authoring/ToolBar/Background/UploadImage.jsx
similarity index 89%
rename from frontend/src/containers/pages/AuthoringTool/ToolBar/Background/UploadImage.jsx
rename to frontend/src/features/authoring/ToolBar/Background/UploadImage.jsx
index 01721c11..9fc292f7 100644
--- a/frontend/src/containers/pages/AuthoringTool/ToolBar/Background/UploadImage.jsx
+++ b/frontend/src/features/authoring/ToolBar/Background/UploadImage.jsx
@@ -1,8 +1,8 @@
import { MenuItem } from "@material-ui/core";
import AttachFileIcon from "@material-ui/icons/AttachFile";
import { useContext, useRef } from "react";
-import SceneContext from "../../../../../context/SceneContext";
-import styles from "../../../../../styling/ToolBar.module.scss";
+import SceneContext from "context/SceneContext";
+import styles from "../ToolBar.module.scss";
import { addFirebaseImage } from "../ToolBarActions";
/**
diff --git a/frontend/src/containers/pages/AuthoringTool/ToolBar/Background/useChooseBackgroundModal.jsx b/frontend/src/features/authoring/ToolBar/Background/useChooseBackgroundModal.jsx
similarity index 100%
rename from frontend/src/containers/pages/AuthoringTool/ToolBar/Background/useChooseBackgroundModal.jsx
rename to frontend/src/features/authoring/ToolBar/Background/useChooseBackgroundModal.jsx
diff --git a/frontend/src/containers/pages/AuthoringTool/ToolBar/ToolBar.jsx b/frontend/src/features/authoring/ToolBar/ToolBar.jsx
similarity index 90%
rename from frontend/src/containers/pages/AuthoringTool/ToolBar/ToolBar.jsx
rename to frontend/src/features/authoring/ToolBar/ToolBar.jsx
index 63633046..9a6b3f98 100644
--- a/frontend/src/containers/pages/AuthoringTool/ToolBar/ToolBar.jsx
+++ b/frontend/src/features/authoring/ToolBar/ToolBar.jsx
@@ -1,10 +1,12 @@
+import { useContext } from "react";
+
import { Box, Button, Menu, MenuList, Tooltip } from "@material-ui/core";
import ArrowDropDownIcon from "@material-ui/icons/ArrowDropDown";
-import { useContext } from "react";
-import AuthoringToolContext from "../../../../context/AuthoringToolContext";
-import SceneContext from "../../../../context/SceneContext";
-import ToolbarContext from "../../../../context/ToolbarContext";
-import styles from "../../../../styling/ToolBar.module.scss";
+
+import AuthoringToolContext from "context/AuthoringToolContext";
+import SceneContext from "context/SceneContext";
+import ToolbarContext from "context/ToolbarContext";
+import styles from "./ToolBar.module.scss";
import toolBarData from "./ToolBarData";
/**
diff --git a/frontend/src/styling/ToolBar.module.scss b/frontend/src/features/authoring/ToolBar/ToolBar.module.scss
similarity index 100%
rename from frontend/src/styling/ToolBar.module.scss
rename to frontend/src/features/authoring/ToolBar/ToolBar.module.scss
diff --git a/frontend/src/containers/pages/AuthoringTool/ToolBar/ToolBarActions.jsx b/frontend/src/features/authoring/ToolBar/ToolBarActions.jsx
similarity index 100%
rename from frontend/src/containers/pages/AuthoringTool/ToolBar/ToolBarActions.jsx
rename to frontend/src/features/authoring/ToolBar/ToolBarActions.jsx
diff --git a/frontend/src/containers/pages/AuthoringTool/ToolBar/ToolBarData.jsx b/frontend/src/features/authoring/ToolBar/ToolBarData.jsx
similarity index 96%
rename from frontend/src/containers/pages/AuthoringTool/ToolBar/ToolBarData.jsx
rename to frontend/src/features/authoring/ToolBar/ToolBarData.jsx
index f5d77fc4..e354dec8 100644
--- a/frontend/src/containers/pages/AuthoringTool/ToolBar/ToolBarData.jsx
+++ b/frontend/src/features/authoring/ToolBar/ToolBarData.jsx
@@ -3,7 +3,7 @@ import ChatBubbleIcon from "@material-ui/icons/ChatBubble";
import ImageIcon from "@material-ui/icons/Image";
import TextFieldsIcon from "@material-ui/icons/TextFields";
import VolumeUpIcon from "@material-ui/icons/VolumeUp";
-import UploadAudio from "./Audio/UploadAudio";
+import UploadAudio from "./UploadAudio";
import ChooseBackgroundSubMenu from "./Background/ChooseBackgroundSubMenu";
import UploadImage from "./Background/UploadImage";
import {
diff --git a/frontend/src/containers/pages/AuthoringTool/ToolBar/Audio/UploadAudio.jsx b/frontend/src/features/authoring/ToolBar/UploadAudio.jsx
similarity index 82%
rename from frontend/src/containers/pages/AuthoringTool/ToolBar/Audio/UploadAudio.jsx
rename to frontend/src/features/authoring/ToolBar/UploadAudio.jsx
index e788d14b..68612162 100644
--- a/frontend/src/containers/pages/AuthoringTool/ToolBar/Audio/UploadAudio.jsx
+++ b/frontend/src/features/authoring/ToolBar/UploadAudio.jsx
@@ -1,10 +1,10 @@
import { MenuItem } from "@material-ui/core";
import AttachFileIcon from "@material-ui/icons/AttachFile";
import { useContext, useRef } from "react";
-import SceneContext from "../../../../../context/SceneContext";
-import ToolbarContext from "../../../../../context/ToolbarContext";
-import styles from "../../../../../styling/ToolBar.module.scss";
-import { addFirebaseAudio } from "../ToolBarActions";
+import SceneContext from "context/SceneContext";
+import ToolbarContext from "context/ToolbarContext";
+import styles from "./ToolBar.module.scss";
+import { addFirebaseAudio } from "./ToolBarActions";
/**
* This component is a dropdown item for the audio button in the ToolBar.
diff --git a/frontend/src/containers/pages/AuthoringTool/BackModal.jsx b/frontend/src/features/authoring/components/BackModal/BackModal.jsx
similarity index 93%
rename from frontend/src/containers/pages/AuthoringTool/BackModal.jsx
rename to frontend/src/features/authoring/components/BackModal/BackModal.jsx
index 395a5444..4918b2fb 100644
--- a/frontend/src/containers/pages/AuthoringTool/BackModal.jsx
+++ b/frontend/src/features/authoring/components/BackModal/BackModal.jsx
@@ -6,8 +6,8 @@ import Typography from "@material-ui/core/Typography";
import { withStyles } from "@material-ui/core/styles";
import { useContext } from "react";
import { Link } from "react-router-dom";
-import ScenarioContext from "../../../context/ScenarioContext";
-import styles from "../../../styling/BackModal.module.scss";
+import ScenarioContext from "context/ScenarioContext";
+import styles from "./BackModal.module.scss";
/**
* This component shows a confirmation model. It is shown when the user exits the editing tool without saving.
diff --git a/frontend/src/styling/BackModal.module.scss b/frontend/src/features/authoring/components/BackModal/BackModal.module.scss
similarity index 100%
rename from frontend/src/styling/BackModal.module.scss
rename to frontend/src/features/authoring/components/BackModal/BackModal.module.scss
diff --git a/frontend/src/containers/pages/AuthoringTool/Components/ButtonComponent.jsx b/frontend/src/features/authoring/components/ButtonComponent.jsx
similarity index 100%
rename from frontend/src/containers/pages/AuthoringTool/Components/ButtonComponent.jsx
rename to frontend/src/features/authoring/components/ButtonComponent.jsx
diff --git a/frontend/src/containers/pages/AuthoringTool/Components/FirebaseAudioComponent.jsx b/frontend/src/features/authoring/components/FirebaseAudioComponent.jsx
similarity index 100%
rename from frontend/src/containers/pages/AuthoringTool/Components/FirebaseAudioComponent.jsx
rename to frontend/src/features/authoring/components/FirebaseAudioComponent.jsx
diff --git a/frontend/src/containers/pages/AuthoringTool/Components/FirebaseImageComponent.jsx b/frontend/src/features/authoring/components/FirebaseImageComponent.jsx
similarity index 100%
rename from frontend/src/containers/pages/AuthoringTool/Components/FirebaseImageComponent.jsx
rename to frontend/src/features/authoring/components/FirebaseImageComponent.jsx
diff --git a/frontend/src/containers/pages/AuthoringTool/Components/ImageComponent.jsx b/frontend/src/features/authoring/components/ImageComponent.jsx
similarity index 95%
rename from frontend/src/containers/pages/AuthoringTool/Components/ImageComponent.jsx
rename to frontend/src/features/authoring/components/ImageComponent.jsx
index 694082e5..725d370f 100644
--- a/frontend/src/containers/pages/AuthoringTool/Components/ImageComponent.jsx
+++ b/frontend/src/features/authoring/components/ImageComponent.jsx
@@ -1,7 +1,7 @@
/* eslint-disable no-param-reassign */
import Image from "material-ui-image";
import { useEffect, useState } from "react";
-import { useGet } from "../../../../hooks/crudHooks";
+import { useGet } from "../../../hooks/crudHooks";
import { imageContainerStyles, imageStyles } from "./components.styles";
/**
diff --git a/frontend/src/containers/pages/AuthoringTool/Components/SpeechTextComponent.jsx b/frontend/src/features/authoring/components/SpeechTextComponent.jsx
similarity index 97%
rename from frontend/src/containers/pages/AuthoringTool/Components/SpeechTextComponent.jsx
rename to frontend/src/features/authoring/components/SpeechTextComponent.jsx
index 184150f1..d536706c 100644
--- a/frontend/src/containers/pages/AuthoringTool/Components/SpeechTextComponent.jsx
+++ b/frontend/src/features/authoring/components/SpeechTextComponent.jsx
@@ -1,5 +1,5 @@
import { Typography } from "@material-ui/core";
-import SpeechTextboxArrow from "components/SpeechboxArrow";
+import SpeechTextboxArrow from "components/SpeechboxArrow/SpeechboxArrow";
import AuthoringToolContext from "context/AuthoringToolContext";
import { useContext, useState } from "react";
import useStyles from "./components.styles";
diff --git a/frontend/src/containers/pages/AuthoringTool/Components/TextComponent.jsx b/frontend/src/features/authoring/components/TextComponent.jsx
similarity index 90%
rename from frontend/src/containers/pages/AuthoringTool/Components/TextComponent.jsx
rename to frontend/src/features/authoring/components/TextComponent.jsx
index a481651f..3c6215fe 100644
--- a/frontend/src/containers/pages/AuthoringTool/Components/TextComponent.jsx
+++ b/frontend/src/features/authoring/components/TextComponent.jsx
@@ -2,7 +2,6 @@ import { Typography } from "@material-ui/core";
import AuthoringToolContext from "context/AuthoringToolContext";
import { useContext } from "react";
import useStyles from "./components.styles";
-// import TextPropertiesComponent from "../CanvasSideBar/ComponentProperties/TextPropertiesComponent";
/**
* This component represents a text scene component
diff --git a/frontend/src/containers/pages/AuthoringTool/Components/Thumbnail.jsx b/frontend/src/features/authoring/components/Thumbnail.jsx
similarity index 100%
rename from frontend/src/containers/pages/AuthoringTool/Components/Thumbnail.jsx
rename to frontend/src/features/authoring/components/Thumbnail.jsx
index d472aa1c..2ab7e627 100644
--- a/frontend/src/containers/pages/AuthoringTool/Components/Thumbnail.jsx
+++ b/frontend/src/features/authoring/components/Thumbnail.jsx
@@ -1,5 +1,5 @@
-import { useGet } from "hooks/crudHooks";
import { useState } from "react";
+import { useGet } from "hooks/crudHooks";
const scale = (percentages, max) => {
return percentages.map((p) => (p / 100) * max);
diff --git a/frontend/src/containers/pages/AuthoringTool/Components/components.styles.js b/frontend/src/features/authoring/components/components.styles.js
similarity index 100%
rename from frontend/src/containers/pages/AuthoringTool/Components/components.styles.js
rename to frontend/src/features/authoring/components/components.styles.js
diff --git a/frontend/src/containers/pages/Dashboard/DashboardPage.jsx b/frontend/src/features/dashboard/DashboardPage.jsx
similarity index 97%
rename from frontend/src/containers/pages/Dashboard/DashboardPage.jsx
rename to frontend/src/features/dashboard/DashboardPage.jsx
index be0ef173..3c92a658 100644
--- a/frontend/src/containers/pages/Dashboard/DashboardPage.jsx
+++ b/frontend/src/features/dashboard/DashboardPage.jsx
@@ -4,10 +4,9 @@ import { DataGrid } from "@mui/x-data-grid";
import dagre from "dagre";
import React, { useContext, useEffect, useMemo, useState } from "react";
import ReactFlow, { Background, MarkerType } from "react-flow-renderer";
-import ScreenContainer from "../../../components/ScreenContainer";
-import ScenarioContext from "../../../context/ScenarioContext";
-import { useGet } from "../../../hooks/crudHooks";
-import useGraph from "../../../hooks/useGraph";
+import ScreenContainer from "../../components/ScreenContainer/ScreenContainer";
+import ScenarioContext from "../../context/ScenarioContext";
+import { useGet } from "../../hooks/crudHooks";
import SceneNode from "./SceneNode";
import TopBar from "./TopBar";
diff --git a/frontend/src/containers/pages/DashboardPageDummyData.jsx b/frontend/src/features/dashboard/DashboardPageDummyData.jsx
similarity index 96%
rename from frontend/src/containers/pages/DashboardPageDummyData.jsx
rename to frontend/src/features/dashboard/DashboardPageDummyData.jsx
index 217eb171..2afe599b 100644
--- a/frontend/src/containers/pages/DashboardPageDummyData.jsx
+++ b/frontend/src/features/dashboard/DashboardPageDummyData.jsx
@@ -1,4 +1,4 @@
-import styles from "../../styling/DashboardScoreboard.module.scss";
+import styles from "./DashboardScoreboard.module.scss";
import userIcon from "./test_icon.png";
const students = [
diff --git a/frontend/src/styling/DashboardScoreboard.module.scss b/frontend/src/features/dashboard/DashboardScoreboard.module.scss
similarity index 100%
rename from frontend/src/styling/DashboardScoreboard.module.scss
rename to frontend/src/features/dashboard/DashboardScoreboard.module.scss
diff --git a/frontend/src/containers/pages/Dashboard/SceneNode.jsx b/frontend/src/features/dashboard/SceneNode.jsx
similarity index 100%
rename from frontend/src/containers/pages/Dashboard/SceneNode.jsx
rename to frontend/src/features/dashboard/SceneNode.jsx
diff --git a/frontend/src/containers/pages/Dashboard/TopBar.jsx b/frontend/src/features/dashboard/TopBar.jsx
similarity index 96%
rename from frontend/src/containers/pages/Dashboard/TopBar.jsx
rename to frontend/src/features/dashboard/TopBar.jsx
index 8bc95f3a..a7453f74 100644
--- a/frontend/src/containers/pages/Dashboard/TopBar.jsx
+++ b/frontend/src/features/dashboard/TopBar.jsx
@@ -1,7 +1,7 @@
import Button from "@material-ui/core/Button";
import { Link, useHistory } from "react-router-dom";
-import styles from "../../../styling/TopBar.module.scss";
+import styles from "../../components/TopBar/TopBar.module.scss";
/**
* Component used for navigation and executing actions located at the top of the screen.
diff --git a/frontend/src/containers/pages/test_icon.png b/frontend/src/features/dashboard/test_icon.png
similarity index 100%
rename from frontend/src/containers/pages/test_icon.png
rename to frontend/src/features/dashboard/test_icon.png
diff --git a/frontend/src/containers/pages/ManageGroups/GroupTable.jsx b/frontend/src/features/groups/GroupTable.jsx
similarity index 100%
rename from frontend/src/containers/pages/ManageGroups/GroupTable.jsx
rename to frontend/src/features/groups/GroupTable.jsx
diff --git a/frontend/src/containers/pages/ManageGroups/ManageGroupsPage.jsx b/frontend/src/features/groups/ManageGroupsPage.jsx
similarity index 98%
rename from frontend/src/containers/pages/ManageGroups/ManageGroupsPage.jsx
rename to frontend/src/features/groups/ManageGroupsPage.jsx
index fb93138a..b748c0b3 100644
--- a/frontend/src/containers/pages/ManageGroups/ManageGroupsPage.jsx
+++ b/frontend/src/features/groups/ManageGroupsPage.jsx
@@ -1,7 +1,7 @@
import { Button } from "@material-ui/core";
import { Alert, Snackbar } from "@mui/material";
import axios from "axios";
-import ScreenContainer from "components/ScreenContainer";
+import ScreenContainer from "components/ScreenContainer/ScreenContainer";
import { useGet } from "hooks/crudHooks";
import Papa from "papaparse";
import { useRef, useState } from "react";
diff --git a/frontend/src/containers/pages/ManageGroups/TopBar.jsx b/frontend/src/features/groups/TopBar.jsx
similarity index 94%
rename from frontend/src/containers/pages/ManageGroups/TopBar.jsx
rename to frontend/src/features/groups/TopBar.jsx
index b6bf0029..b5b5f73a 100644
--- a/frontend/src/containers/pages/ManageGroups/TopBar.jsx
+++ b/frontend/src/features/groups/TopBar.jsx
@@ -1,7 +1,7 @@
import Button from "@material-ui/core/Button";
import { Link } from "react-router-dom";
-import styles from "../../../styling/TopBar.module.scss";
+import styles from "components/TopBar/TopBar.module.scss";
/**
* Component used for navigation and executing actions located at the top of the screen.
diff --git a/frontend/src/containers/pages/LoginPage.jsx b/frontend/src/features/login/LoginPage/LoginPage.jsx
similarity index 91%
rename from frontend/src/containers/pages/LoginPage.jsx
rename to frontend/src/features/login/LoginPage/LoginPage.jsx
index 47093782..f4706421 100644
--- a/frontend/src/containers/pages/LoginPage.jsx
+++ b/frontend/src/features/login/LoginPage/LoginPage.jsx
@@ -1,11 +1,11 @@
import { useContext, useEffect } from "react";
import { useHistory, useLocation } from "react-router-dom";
-import ScreenContainer from "components/ScreenContainer";
-import AuthenticationContext from "../../context/AuthenticationContext";
-import { usePost } from "../../hooks/crudHooks";
-import LoadingPage from "./LoadingPage";
-import styles from "../../styling/LoginPage.module.scss";
-import sideBarStyles from "../../styling/SideBar.module.scss";
+import ScreenContainer from "components/ScreenContainer/ScreenContainer";
+import AuthenticationContext from "context/AuthenticationContext";
+import { usePost } from "hooks/crudHooks";
+import LoadingPage from "features/status/LoadingPage";
+import styles from "./LoginPage.module.scss";
+import sideBarStyles from "components/SideBar/SideBar.module.scss";
/**
* Container for the login page. Redirects logged-in users to main page and allows users to sign up using Google.
diff --git a/frontend/src/styling/LoginPage.module.scss b/frontend/src/features/login/LoginPage/LoginPage.module.scss
similarity index 100%
rename from frontend/src/styling/LoginPage.module.scss
rename to frontend/src/features/login/LoginPage/LoginPage.module.scss
diff --git a/frontend/src/styling/backgroundImg.jpg b/frontend/src/features/login/backgroundImg.jpg
similarity index 100%
rename from frontend/src/styling/backgroundImg.jpg
rename to frontend/src/features/login/backgroundImg.jpg
diff --git a/frontend/src/containers/pages/PlayScenarioPage/PlayScenarioCanvas.jsx b/frontend/src/features/playScenario/PlayScenarioCanvas.jsx
similarity index 96%
rename from frontend/src/containers/pages/PlayScenarioPage/PlayScenarioCanvas.jsx
rename to frontend/src/features/playScenario/PlayScenarioCanvas.jsx
index 473250df..d3a6265a 100644
--- a/frontend/src/containers/pages/PlayScenarioPage/PlayScenarioCanvas.jsx
+++ b/frontend/src/features/playScenario/PlayScenarioCanvas.jsx
@@ -1,5 +1,5 @@
-import ResetConfirmationModal from "components/ResetConfirmationModal";
import { useState } from "react";
+import ResetConfirmationModal from "./modals/ResetConfirmationModal";
import componentResolver from "./componentResolver";
/**
diff --git a/frontend/src/containers/pages/PlayScenarioPage/PlayScenarioPage.jsx b/frontend/src/features/playScenario/PlayScenarioPage.jsx
similarity index 88%
rename from frontend/src/containers/pages/PlayScenarioPage/PlayScenarioPage.jsx
rename to frontend/src/features/playScenario/PlayScenarioPage.jsx
index 73c70635..5bd1039e 100644
--- a/frontend/src/containers/pages/PlayScenarioPage/PlayScenarioPage.jsx
+++ b/frontend/src/features/playScenario/PlayScenarioPage.jsx
@@ -1,13 +1,12 @@
import { useContext, useState, useEffect } from "react";
import { useParams, useHistory } from "react-router-dom";
-import AuthenticationContext from "context/AuthenticationContext";
import axios from "axios";
+
+import AuthenticationContext from "context/AuthenticationContext";
import { usePost } from "hooks/crudHooks";
-import LoadingPage from "../LoadingPage";
-// import ScenarioPreloader from "./Components/ScenarioPreloader";
+import LoadingPage from "../status/LoadingPage";
import PlayScenarioCanvas from "./PlayScenarioCanvas";
-import useStyles from "./playScenarioPage.styles";
const sceneCache = new Map();
@@ -47,7 +46,6 @@ export default function PlayScenarioPage() {
const { scenarioId, sceneId } = useParams();
const history = useHistory();
- const styles = useStyles();
const [previous, setPrevious] = useState(null);
const [addFlags, setAddFlags] = useState([]);
@@ -114,8 +112,8 @@ export default function PlayScenarioPage() {
return (
<>
-
-
+
+
- {/* {window.location === window.parent.location && (
-
- )} */}
>
);
}
diff --git a/frontend/src/containers/pages/PlayScenarioPage/PlayScenarioPageMulti.jsx b/frontend/src/features/playScenario/PlayScenarioPageMulti.jsx
similarity index 88%
rename from frontend/src/containers/pages/PlayScenarioPage/PlayScenarioPageMulti.jsx
rename to frontend/src/features/playScenario/PlayScenarioPageMulti.jsx
index 4ef70bfe..e4b45933 100644
--- a/frontend/src/containers/pages/PlayScenarioPage/PlayScenarioPageMulti.jsx
+++ b/frontend/src/features/playScenario/PlayScenarioPageMulti.jsx
@@ -1,15 +1,15 @@
import { useContext, useState, useEffect } from "react";
import { useParams, useHistory } from "react-router-dom";
+import axios from "axios";
+
import AuthenticationContext from "context/AuthenticationContext";
import { usePost } from "hooks/crudHooks";
-import axios from "axios";
-import LoadingPage from "../LoadingPage";
-import NotesDisplayCard from "../../../components/NotesDisplayCard";
-import ResourcesModal from "../../../components/ResourcesModal";
-import PlayPageSideButton from "../../../components/PlayPageSideButton";
-// import ScenarioPreloader from "./Components/ScenarioPreloader";
+
+import LoadingPage from "../status/LoadingPage";
+import NotesDisplayCard from "./modals/NotesModal/NotesModal";
+import ResourcesModal from "./modals/ResourcesModal/ResourcesModal";
+import PlayPageSideButton from "./components/PlayPageSideButton/PlayPageSideButton";
import PlayScenarioCanvas from "./PlayScenarioCanvas";
-import useStyles from "./playScenarioPage.styles";
const sceneCache = new Map();
@@ -62,7 +62,6 @@ export default function PlayScenarioPageMulti({ group }) {
const { scenarioId, sceneId } = useParams();
const history = useHistory();
- const styles = useStyles();
const [resourcesOpen, setResourcesOpen] = useState(false);
const [noteOpen, setNoteOpen] = useState(false);
const [previous, setPrevious] = useState(null);
@@ -136,8 +135,8 @@ export default function PlayScenarioPageMulti({ group }) {
return (
<>
-
-
+
+
- {/* {window.location === window.parent.location && (
-
- )}{" "} */}
setNoteOpen(true)}
buttonName="Note"
diff --git a/frontend/src/containers/pages/PlayScenarioPage/PlayScenarioResolver.jsx b/frontend/src/features/playScenario/PlayScenarioResolver.jsx
similarity index 88%
rename from frontend/src/containers/pages/PlayScenarioPage/PlayScenarioResolver.jsx
rename to frontend/src/features/playScenario/PlayScenarioResolver.jsx
index 2f534d60..1e0f9420 100644
--- a/frontend/src/containers/pages/PlayScenarioPage/PlayScenarioResolver.jsx
+++ b/frontend/src/features/playScenario/PlayScenarioResolver.jsx
@@ -4,10 +4,10 @@ import { Route, Switch, useHistory, useParams } from "react-router-dom";
import AuthenticationContext from "context/AuthenticationContext";
-import DesyncPage from "../ErrorPages/DesyncPage";
-import InvalidRolePage from "../ErrorPages/InvalidRolePage";
-import ErrorPage from "../ErrorPages/ErrorPage";
-import LoadingPage from "../LoadingPage";
+import DesyncPage from "../status/DesyncPage";
+import InvalidRolePage from "../status/InvalidRolePage";
+import GenericErrorPage from "../status/GenericErrorPage";
+import LoadingPage from "../status/LoadingPage";
import PlayScenarioPage from "./PlayScenarioPage";
import PlayScenarioPageMulti from "./PlayScenarioPageMulti";
@@ -29,7 +29,6 @@ export default function PlayScenarioResolver() {
const history = useHistory();
const [group, setGroup] = useState(null);
- // TODO: move these somewhere else ?
if (loading) return ;
if (authError) return <>>;
@@ -51,7 +50,7 @@ export default function PlayScenarioResolver() {
return (
-
+
diff --git a/frontend/src/features/playScenario/componentResolver.jsx b/frontend/src/features/playScenario/componentResolver.jsx
new file mode 100644
index 00000000..492409f9
--- /dev/null
+++ b/frontend/src/features/playScenario/componentResolver.jsx
@@ -0,0 +1,38 @@
+import ButtonComponent from "../authoring/components/ButtonComponent";
+import FirebaseImageComponent from "../authoring/components/FirebaseImageComponent";
+import ImageComponent from "../authoring/components/ImageComponent";
+import TextComponent from "../authoring/components/TextComponent";
+
+// Components for playing only
+import AudioComponent from "./components/AudioComponent";
+
+/**
+ * This function returns the appropriate React component for a scene component object when playing
+ *
+ * @example
+ * {currentScene?.components?.map((component, index) =>
+ * componentResolver(component, index, selectElement)
+ * )}
+ */
+export default function componentResolver(component, index, onClick) {
+ const props = { key: component.id, id: index, onClick, component };
+
+ switch (component.type) {
+ // ADD NEW COMPONENT TYPES HERE
+ case "BUTTON":
+ return ;
+ case "RESET_BUTTON":
+ return ;
+ case "SPEECHTEXT":
+ case "TEXT":
+ return ;
+ case "IMAGE":
+ return ;
+ case "FIREBASEIMAGE":
+ return ;
+ case "FIREBASEAUDIO":
+ return ;
+ default:
+ return ;
+ }
+}
diff --git a/frontend/src/features/playScenario/components/AudioComponent.jsx b/frontend/src/features/playScenario/components/AudioComponent.jsx
new file mode 100644
index 00000000..6a8a932c
--- /dev/null
+++ b/frontend/src/features/playScenario/components/AudioComponent.jsx
@@ -0,0 +1,18 @@
+import ReactAudioPlayer from "react-audio-player";
+
+/**
+ * This component plays audio from a scene
+ * @component
+ */
+function AudioComponent({ id, component }) {
+ return (
+
+ );
+}
+
+export default AudioComponent;
diff --git a/frontend/src/containers/pages/PlayScenarioPage/Components/ScenarioPreloader.jsx b/frontend/src/features/playScenario/components/ImagePreloader.jsx
similarity index 96%
rename from frontend/src/containers/pages/PlayScenarioPage/Components/ScenarioPreloader.jsx
rename to frontend/src/features/playScenario/components/ImagePreloader.jsx
index f49f7e0d..bcac6c39 100644
--- a/frontend/src/containers/pages/PlayScenarioPage/Components/ScenarioPreloader.jsx
+++ b/frontend/src/features/playScenario/components/ImagePreloader.jsx
@@ -1,4 +1,4 @@
-import { useGet } from "../../../../hooks/crudHooks";
+import { useGet } from "hooks/crudHooks";
/**
* This component preloads firebase and google drive images of a scene
diff --git a/frontend/src/components/Note.jsx b/frontend/src/features/playScenario/components/Note/Note.jsx
similarity index 99%
rename from frontend/src/components/Note.jsx
rename to frontend/src/features/playScenario/components/Note/Note.jsx
index 8eca2b3c..34e35f21 100644
--- a/frontend/src/components/Note.jsx
+++ b/frontend/src/features/playScenario/components/Note/Note.jsx
@@ -1,7 +1,7 @@
import { useState, useEffect, useContext } from "react";
import { useAuthGet, useAuthDelete, useAuthPut } from "hooks/crudHooks";
import AuthenticationContext from "context/AuthenticationContext";
-import styles from "../styling/Note.module.scss";
+import styles from "./Note.module.scss";
export default function Note({ role, noteId, group, refetchGroup }) {
const { user } = useContext(AuthenticationContext);
diff --git a/frontend/src/styling/Note.module.scss b/frontend/src/features/playScenario/components/Note/Note.module.scss
similarity index 100%
rename from frontend/src/styling/Note.module.scss
rename to frontend/src/features/playScenario/components/Note/Note.module.scss
diff --git a/frontend/src/components/PlayPageSideButton.jsx b/frontend/src/features/playScenario/components/PlayPageSideButton/PlayPageSideButton.jsx
similarity index 87%
rename from frontend/src/components/PlayPageSideButton.jsx
rename to frontend/src/features/playScenario/components/PlayPageSideButton/PlayPageSideButton.jsx
index 99189efa..512a9137 100644
--- a/frontend/src/components/PlayPageSideButton.jsx
+++ b/frontend/src/features/playScenario/components/PlayPageSideButton/PlayPageSideButton.jsx
@@ -1,4 +1,4 @@
-import styles from "../styling/PlayPageSideButton.module.scss";
+import styles from "./PlayPageSideButton.module.scss";
export default function PlayPageSideButton({
handleOpen,
diff --git a/frontend/src/styling/PlayPageSideButton.module.scss b/frontend/src/features/playScenario/components/PlayPageSideButton/PlayPageSideButton.module.scss
similarity index 100%
rename from frontend/src/styling/PlayPageSideButton.module.scss
rename to frontend/src/features/playScenario/components/PlayPageSideButton/PlayPageSideButton.module.scss
diff --git a/frontend/src/components/NotesDisplayCard.jsx b/frontend/src/features/playScenario/modals/NotesModal/NotesModal.jsx
similarity index 94%
rename from frontend/src/components/NotesDisplayCard.jsx
rename to frontend/src/features/playScenario/modals/NotesModal/NotesModal.jsx
index 43c843db..d0b408d3 100644
--- a/frontend/src/components/NotesDisplayCard.jsx
+++ b/frontend/src/features/playScenario/modals/NotesModal/NotesModal.jsx
@@ -1,10 +1,10 @@
import { useAuthGet, useAuthPost } from "hooks/crudHooks";
import { useEffect, useState } from "react";
-import styles from "../styling/NotesDisplayCard.module.scss";
-import Note from "./Note";
+import styles from "./NotesModal.module.scss";
+import Note from "../../components/Note/Note";
-export default function NotesDisplayCard({ group, user, handleClose }) {
+export default function NotesModal({ group, user, handleClose }) {
const [notes, setNotes] = useState([]);
const [userRole, setRole] = useState(null);
const {
diff --git a/frontend/src/styling/NotesDisplayCard.module.scss b/frontend/src/features/playScenario/modals/NotesModal/NotesModal.module.scss
similarity index 100%
rename from frontend/src/styling/NotesDisplayCard.module.scss
rename to frontend/src/features/playScenario/modals/NotesModal/NotesModal.module.scss
diff --git a/frontend/src/components/ResetConfirmationModal.jsx b/frontend/src/features/playScenario/modals/ResetConfirmationModal.jsx
similarity index 100%
rename from frontend/src/components/ResetConfirmationModal.jsx
rename to frontend/src/features/playScenario/modals/ResetConfirmationModal.jsx
diff --git a/frontend/src/components/ResourcesModal.jsx b/frontend/src/features/playScenario/modals/ResourcesModal/ResourcesModal.jsx
similarity index 94%
rename from frontend/src/components/ResourcesModal.jsx
rename to frontend/src/features/playScenario/modals/ResourcesModal/ResourcesModal.jsx
index 3ad6236a..9894be1b 100644
--- a/frontend/src/components/ResourcesModal.jsx
+++ b/frontend/src/features/playScenario/modals/ResourcesModal/ResourcesModal.jsx
@@ -1,6 +1,6 @@
import { useEffect, useState } from "react";
-import styles from "../styling/NotesDisplayCard.module.scss";
-import resourceStyles from "../styling/ResourceModal.module.scss";
+import styles from "../NotesModal/NotesModal.module.scss";
+import resourceStyles from "./ResourcesModal.module.scss";
function ResourcesModal({ handleClose, resources }) {
const [currentResourceId, setCurrentResourceId] = useState(resources[0]?._id);
diff --git a/frontend/src/styling/ResourceModal.module.scss b/frontend/src/features/playScenario/modals/ResourcesModal/ResourcesModal.module.scss
similarity index 100%
rename from frontend/src/styling/ResourceModal.module.scss
rename to frontend/src/features/playScenario/modals/ResourcesModal/ResourcesModal.module.scss
diff --git a/frontend/src/containers/pages/ScenarioSelectionPage.jsx b/frontend/src/features/scenarioSelection/ScenarioSelectionPage.jsx
similarity index 95%
rename from frontend/src/containers/pages/ScenarioSelectionPage.jsx
rename to frontend/src/features/scenarioSelection/ScenarioSelectionPage.jsx
index 37f937e3..ef0fc9a4 100644
--- a/frontend/src/containers/pages/ScenarioSelectionPage.jsx
+++ b/frontend/src/features/scenarioSelection/ScenarioSelectionPage.jsx
@@ -2,9 +2,9 @@ import MenuItem from "@material-ui/core/MenuItem";
import { useContext, useEffect, useState } from "react";
import { useHistory } from "react-router-dom";
import ContextMenu from "../../components/ContextMenu";
-import ListContainer from "../../components/ListContainer";
-import ScreenContainer from "../../components/ScreenContainer";
-import SideBar from "../../components/SideBar";
+import ListContainer from "../../components/ListContainer/ListContainer";
+import ScreenContainer from "../../components/ScreenContainer/ScreenContainer";
+import SideBar from "../../components/SideBar/SideBar";
import AuthenticationContext from "../../context/AuthenticationContext";
import ScenarioContext from "../../context/ScenarioContext";
import AccessLevel from "../../enums/route.access.level";
diff --git a/frontend/src/containers/pages/SceneSelectionPage.jsx b/frontend/src/features/sceneSelection/SceneSelectionPage.jsx
similarity index 93%
rename from frontend/src/containers/pages/SceneSelectionPage.jsx
rename to frontend/src/features/sceneSelection/SceneSelectionPage.jsx
index c07c120d..39dc4447 100644
--- a/frontend/src/containers/pages/SceneSelectionPage.jsx
+++ b/frontend/src/features/sceneSelection/SceneSelectionPage.jsx
@@ -1,5 +1,5 @@
import { Button, Divider, MenuItem } from "@material-ui/core";
-import ListContainer from "components/ListContainer";
+import ListContainer from "components/ListContainer/ListContainer";
import Papa from "papaparse";
import { useContext, useEffect, useRef, useState } from "react";
import {
@@ -11,16 +11,24 @@ import {
} from "react-router-dom";
import ContextMenu from "../../components/ContextMenu";
import HelpButton from "../../components/HelpButton";
-import ScreenContainer from "../../components/ScreenContainer";
-import ShareModal from "../../components/ShareModal";
-import TopBar from "../../components/TopBar";
-import generateUID from "../../components/newUID";
+import ScreenContainer from "../../components/ScreenContainer/ScreenContainer";
+import ShareModal from "../../components/ShareModal/ShareModal";
+import TopBar from "../../components/TopBar/TopBar";
import AuthenticationContext from "../../context/AuthenticationContext";
import AuthoringToolContextProvider from "../../context/AuthoringToolContextProvider";
import SceneContext from "../../context/SceneContext";
import AccessLevel from "../../enums/route.access.level";
import { useDelete, usePatch, usePost, usePut } from "../../hooks/crudHooks";
-import AuthoringToolPage from "./AuthoringTool/AuthoringToolPage";
+import AuthoringToolPage from "../authoring/AuthoringToolPage";
+
+// !! this should be handled by the backend instead
+function generateUID() {
+ const charSet =
+ "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+ return Array.from({ length: 28 }, () =>
+ charSet.charAt(Math.floor(Math.random() * charSet.length))
+ ).join("");
+}
/**
* Page that shows the scenes belonging to a scenario.
diff --git a/frontend/src/containers/pages/ErrorPages/DesyncPage.jsx b/frontend/src/features/status/DesyncPage.jsx
similarity index 100%
rename from frontend/src/containers/pages/ErrorPages/DesyncPage.jsx
rename to frontend/src/features/status/DesyncPage.jsx
diff --git a/frontend/src/containers/pages/ErrorPages/ErrorPage.jsx b/frontend/src/features/status/GenericErrorPage.jsx
similarity index 90%
rename from frontend/src/containers/pages/ErrorPages/ErrorPage.jsx
rename to frontend/src/features/status/GenericErrorPage.jsx
index 42bf822f..629797ca 100644
--- a/frontend/src/containers/pages/ErrorPages/ErrorPage.jsx
+++ b/frontend/src/features/status/GenericErrorPage.jsx
@@ -1,6 +1,6 @@
import { Grid, Typography } from "@material-ui/core";
-export default function ErrorPage() {
+const GenericErrorPage = () => {
return (
);
-}
+};
+
+export default GenericErrorPage;
diff --git a/frontend/src/containers/pages/ErrorPages/InvalidRolePage.jsx b/frontend/src/features/status/InvalidRolePage.jsx
similarity index 83%
rename from frontend/src/containers/pages/ErrorPages/InvalidRolePage.jsx
rename to frontend/src/features/status/InvalidRolePage.jsx
index d90530d3..c318edaa 100644
--- a/frontend/src/containers/pages/ErrorPages/InvalidRolePage.jsx
+++ b/frontend/src/features/status/InvalidRolePage.jsx
@@ -1,9 +1,8 @@
import { Button } from "@mui/material";
import { useContext, useState } from "react";
import { useLocation } from "react-router-dom";
-import TryAccessScenarioButton from "../../../components/TryAccessScenarioButton";
-import NotesDisplayCard from "../../../components/NotesDisplayCard";
-import AuthenticationContext from "../../../context/AuthenticationContext";
+import NotesDisplayCard from "../playScenario/modals/NotesModal/NotesModal";
+import AuthenticationContext from "../../context/AuthenticationContext";
function InvalidRolePage({ group }) {
const { user } = useContext(AuthenticationContext);
@@ -44,7 +43,7 @@ function InvalidRolePage({ group }) {
Please wait for your role: {currentUserRole}
Wait for your group member(s) to finish playing through their part of
- the scenario. Then, when it’s your turn to play through (your group
+ the scenario. Then, when it's your turn to play through (your group
members should let you know), click the below button:
@@ -61,7 +60,13 @@ function InvalidRolePage({ group }) {
>
— or —
-
+