Added structure for Edit Impressum and About Page

redaktions-app/src/components/EditInformation.tsx

@@ -0,0 +1,58 @@
+import React from "react";
+import { Paper, Typography } from "@material-ui/core";
+import { makeStyles } from "@material-ui/core/styles";
+import { useQuery } from "@apollo/client";
+import { BasicPersonResponse } from "../backend/queries/person";
+
+const useStyles = makeStyles((theme) => ({
+  root: {
+    width: "100%",
+    padding: theme.spacing(1),
+    marginBottom: theme.spacing(3),
+  },
+}));
+
+interface EditInformationProps {
+  loggedInPersonRowId: number;
+}
+
+export function EditInformation(
+  props: EditInformationProps
+): React.ReactElement {
+  const classes = useStyles();
+
+  return (
+    <div>
+      <Typography component={"h2"} variant="h6" color="secondary" gutterBottom>
+        Bearbeite hier die Webseiten Info-Texte für deinen Candymat:
+      </Typography>
+      <Paper className={classes.root}>
+        <Typography component={"h2"} variant="h6" color="primary" gutterBottom>
+          {/* eslint-disable-next-line react/no-unescaped-entities */}
+          Der "Über Uns" Text:
+        </Typography>
+        <form>
+          <textarea
+            className="input-about"
+            value="Hier muss der Über Uns Text rein"
+          >
+            {/*Hier kommt der Inhalt aus der Datenbank*/}
+          </textarea>
+        </form>
+
+        <Typography component={"h2"} variant="h6" color="primary" gutterBottom>
+          {/* eslint-disable-next-line react/no-unescaped-entities */}
+          Der "Impressum" Text:
+        </Typography>
+        <form>
+          <textarea
+            className="input-impressum"
+            value="Hier muss der Impressum Text rein"
+          >
+            {/*Hier kommt der Inhalt aus der Datenbank*/}
+          </textarea>
+        </form>
+      </Paper>
+    </div>
+  );
+}

redaktions-app/src/components/HomePageEditor.tsx

@@ -10,6 +10,8 @@ import PeopleIcon from "@material-ui/icons/People";
 import { MenuOption } from "./MainMenu";
 import { PersonRoutes } from "./Main";
 import { UserManagement } from "./UserManagement";
+import { InfoRounded } from "@material-ui/icons";
+import { EditInformation } from "./EditInformation";
 
 const useStyles = makeStyles((theme) => ({
   container: {
@@ -22,6 +24,7 @@ const useStyles = makeStyles((theme) => ({
 interface EditorRoutes extends PersonRoutes {
   question: MenuOption;
   userManagement: MenuOption;
+  editInformation: MenuOption;
 }
 
 export const editorRoutes: EditorRoutes = {
@@ -35,6 +38,11 @@ export const editorRoutes: EditorRoutes = {
     path: "/benutzer",
     icon: <PeopleIcon />,
   },
+  editInformation: {
+    title: "Infos bearbeiten",
+    path: "/edit",
+    icon: <InfoRounded />,
+  },
 };
 
 interface HomePageEditorProps {
@@ -54,6 +62,9 @@ export function HomePageEditor(props: HomePageEditorProps): React.ReactElement {
         <Route path={editorRoutes.userManagement.path}>
           <UserManagement loggedInPersonRowId={props.loggedInUserRowId} />
         </Route>
+        <Route path={editorRoutes.editInformation.path}>
+          <EditInformation loggedInPersonRowId={props.loggedInUserRowId} />
+        </Route>
       </Switch>
       <Copyright />
     </Container>