Remove BackToList button from NewBugPage

Sascha created 4 years ago

Change summary

webui/src/pages/new/NewBugPage.tsx | 87 ++++++++++---------------------
1 file changed, 29 insertions(+), 58 deletions(-)

Detailed changes

webui/src/pages/new/NewBugPage.tsx

@@ -4,7 +4,6 @@ import { useHistory } from 'react-router-dom';
 import { Button, Paper } from '@material-ui/core';
 import { makeStyles, Theme } from '@material-ui/core/styles';
 
-import BackToListButton from '../../components/BackToListButton';
 import BugTitleInput from '../../components/BugTitleForm/BugTitleInput';
 import CommentInput from '../../components/CommentInput/CommentInput';
 
@@ -15,17 +14,12 @@ import { useNewBugMutation } from './NewBug.generated';
  */
 const useStyles = makeStyles((theme: Theme) => ({
   main: {
-    maxWidth: 1200,
+    maxWidth: 800,
     margin: 'auto',
     marginTop: theme.spacing(4),
     marginBottom: theme.spacing(4),
     padding: theme.spacing(2),
-  },
-  container: {
-    display: 'flex',
-    marginBottom: theme.spacing(1),
-    marginRight: theme.spacing(2),
-    marginLeft: theme.spacing(2),
+    overflow: 'hidden',
   },
   form: {
     display: 'flex',
@@ -39,21 +33,6 @@ const useStyles = makeStyles((theme: Theme) => ({
     backgroundColor: theme.palette.success.main,
     color: theme.palette.success.contrastText,
   },
-  leftSidebar: {
-    marginTop: theme.spacing(4),
-    marginRight: theme.spacing(2),
-  },
-  rightSidebar: {
-    marginTop: theme.spacing(2),
-    flex: '0 0 200px',
-  },
-  timeline: {
-    flex: 1,
-    marginTop: theme.spacing(2),
-    marginRight: theme.spacing(2),
-    minWidth: 400,
-    padding: theme.spacing(1),
-  },
 }));
 
 /**
@@ -93,42 +72,34 @@ function NewBugPage() {
   if (error) return <div>Error</div>;
 
   return (
-    <main className={classes.main}>
-      <div className={classes.container}>
-        <div className={classes.leftSidebar}>
-          <BackToListButton />
+    <Paper className={classes.main}>
+      <form className={classes.form} onSubmit={submitNewIssue}>
+        <BugTitleInput
+          inputRef={(node) => {
+            issueTitleInput = node;
+          }}
+          label="Title"
+          variant="outlined"
+          fullWidth
+          margin="dense"
+          onChange={(event: any) => setIssueTitle(event.target.value)}
+        />
+        <CommentInput
+          loading={false}
+          onChange={(comment: string) => setIssueComment(comment)}
+        />
+        <div className={classes.actions}>
+          <Button
+            className={classes.greenButton}
+            variant="contained"
+            type="submit"
+            disabled={isFormValid() ? false : true}
+          >
+            Submit new issue
+          </Button>
         </div>
-        <Paper className={classes.timeline}>
-          <form className={classes.form} onSubmit={submitNewIssue}>
-            <BugTitleInput
-              inputRef={(node) => {
-                issueTitleInput = node;
-              }}
-              label="Title"
-              variant="outlined"
-              fullWidth
-              margin="dense"
-              onChange={(event: any) => setIssueTitle(event.target.value)}
-            />
-            <CommentInput
-              loading={false}
-              onChange={(comment: string) => setIssueComment(comment)}
-            />
-            <div className={classes.actions}>
-              <Button
-                className={classes.greenButton}
-                variant="contained"
-                type="submit"
-                disabled={!isFormValid()}
-              >
-                Submit new issue
-              </Button>
-            </div>
-          </form>
-        </Paper>
-        <div className={classes.rightSidebar} />
-      </div>
-    </main>
+      </form>
+    </Paper>
   );
 }