From 8e8ca99bd5f72de60f6e0e1b334f33312cab5388 Mon Sep 17 00:00:00 2001 From: Sascha Date: Wed, 3 Mar 2021 17:49:53 +0100 Subject: Use colors from theme palette - Use theme colors for title input. - Remove inputTitle classes as they are not applied to the TextField. This will lead to double borders and artifacts at the field corners. --- webui/src/pages/new/NewBugPage.tsx | 23 +++-------------------- 1 file changed, 3 insertions(+), 20 deletions(-) (limited to 'webui/src/pages/new/NewBugPage.tsx') diff --git a/webui/src/pages/new/NewBugPage.tsx b/webui/src/pages/new/NewBugPage.tsx index c9e268b6..b649fffb 100644 --- a/webui/src/pages/new/NewBugPage.tsx +++ b/webui/src/pages/new/NewBugPage.tsx @@ -3,7 +3,7 @@ import React, { FormEvent, useState } from 'react'; import { Button } from '@material-ui/core'; import Paper from '@material-ui/core/Paper'; import TextField from '@material-ui/core/TextField/TextField'; -import { fade, makeStyles, Theme } from '@material-ui/core/styles'; +import { makeStyles, Theme } from '@material-ui/core/styles'; import CommentInput from '../../components/CommentInput/CommentInput'; @@ -21,19 +21,6 @@ const useStyles = makeStyles((theme: Theme) => ({ padding: theme.spacing(2), overflow: 'hidden', }, - titleInput: { - borderRadius: theme.shape.borderRadius, - borderColor: fade(theme.palette.primary.main, 0.2), - borderStyle: 'solid', - borderWidth: '1px', - backgroundColor: fade(theme.palette.primary.main, 0.05), - padding: theme.spacing(0, 0), - transition: theme.transitions.create([ - 'width', - 'borderColor', - 'backgroundColor', - ]), - }, form: { display: 'flex', flexDirection: 'column', @@ -43,11 +30,8 @@ const useStyles = makeStyles((theme: Theme) => ({ justifyContent: 'flex-end', }, greenButton: { - backgroundColor: '#2ea44fd9', - color: '#fff', - '&:hover': { - backgroundColor: '#2ea44f', - }, + backgroundColor: theme.palette.success.main, + color: theme.palette.success.contrastText, }, })); @@ -90,7 +74,6 @@ function NewBugPage() { issueTitleInput = node; }} label="Title" - className={classes.titleInput} variant="outlined" fullWidth margin="dense" -- cgit From 288448b64b02be934b80c62a38f607048ccb4a61 Mon Sep 17 00:00:00 2001 From: Sascha Date: Thu, 4 Mar 2021 13:36:49 +0100 Subject: Reuse BugTitleInput component --- webui/src/pages/new/NewBugPage.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'webui/src/pages/new/NewBugPage.tsx') diff --git a/webui/src/pages/new/NewBugPage.tsx b/webui/src/pages/new/NewBugPage.tsx index b649fffb..a46226ad 100644 --- a/webui/src/pages/new/NewBugPage.tsx +++ b/webui/src/pages/new/NewBugPage.tsx @@ -2,9 +2,9 @@ import React, { FormEvent, useState } from 'react'; import { Button } from '@material-ui/core'; import Paper from '@material-ui/core/Paper'; -import TextField from '@material-ui/core/TextField/TextField'; import { makeStyles, Theme } from '@material-ui/core/styles'; +import BugTitleInput from '../../components/BugTitleForm/BugTitleInput'; import CommentInput from '../../components/CommentInput/CommentInput'; import { useNewBugMutation } from './NewBug.generated'; @@ -69,7 +69,7 @@ function NewBugPage() { return (
- { issueTitleInput = node; }} -- cgit From d0505e2f9ab9483f370ba547cb93ce6cc388f241 Mon Sep 17 00:00:00 2001 From: Sascha Date: Sun, 14 Mar 2021 15:44:32 +0100 Subject: Use success.dark for green-button:hover --- webui/src/pages/new/NewBugPage.tsx | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'webui/src/pages/new/NewBugPage.tsx') diff --git a/webui/src/pages/new/NewBugPage.tsx b/webui/src/pages/new/NewBugPage.tsx index a46226ad..4517c6e3 100644 --- a/webui/src/pages/new/NewBugPage.tsx +++ b/webui/src/pages/new/NewBugPage.tsx @@ -32,6 +32,10 @@ const useStyles = makeStyles((theme: Theme) => ({ greenButton: { backgroundColor: theme.palette.success.main, color: theme.palette.success.contrastText, + '&:hover': { + backgroundColor: theme.palette.success.dark, + color: theme.palette.primary.contrastText, + }, }, })); -- cgit From 2c5d3345e2d3b4746619f3adf859321eadf21992 Mon Sep 17 00:00:00 2001 From: Sascha Date: Sun, 14 Mar 2021 16:10:01 +0100 Subject: Change caption of buttons from "Issue" to "Bug" --- webui/src/pages/new/NewBugPage.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'webui/src/pages/new/NewBugPage.tsx') diff --git a/webui/src/pages/new/NewBugPage.tsx b/webui/src/pages/new/NewBugPage.tsx index 4517c6e3..96afb56a 100644 --- a/webui/src/pages/new/NewBugPage.tsx +++ b/webui/src/pages/new/NewBugPage.tsx @@ -94,7 +94,7 @@ function NewBugPage() { type="submit" disabled={isFormValid() ? false : true} > - Submit new issue + Submit new bug -- cgit From 07f3163296b187ddf7069c05ca94f5ebaf43413c Mon Sep 17 00:00:00 2001 From: Lena Date: Thu, 11 Mar 2021 22:27:08 +0100 Subject: #10 Add redirect to detail page after creating new bug --- webui/src/pages/new/NewBugPage.tsx | 6 ++++++ 1 file changed, 6 insertions(+) (limited to 'webui/src/pages/new/NewBugPage.tsx') diff --git a/webui/src/pages/new/NewBugPage.tsx b/webui/src/pages/new/NewBugPage.tsx index a46226ad..9ad52ad0 100644 --- a/webui/src/pages/new/NewBugPage.tsx +++ b/webui/src/pages/new/NewBugPage.tsx @@ -1,4 +1,5 @@ import React, { FormEvent, useState } from 'react'; +import { useHistory } from 'react-router-dom'; import { Button } from '@material-ui/core'; import Paper from '@material-ui/core/Paper'; @@ -43,7 +44,9 @@ function NewBugPage() { const [issueTitle, setIssueTitle] = useState(''); const [issueComment, setIssueComment] = useState(''); const classes = useStyles(); + let issueTitleInput: any; + let history = useHistory(); function submitNewIssue(e: FormEvent) { e.preventDefault(); @@ -55,6 +58,9 @@ function NewBugPage() { message: issueComment, }, }, + }).then(function (data) { + const id = data.data?.newBug.bug.humanId; + history.push('/bug/' + id); }); issueTitleInput.value = ''; } -- cgit From cd02d80ca2458be40d64d2e945670e0aeeb30fcc Mon Sep 17 00:00:00 2001 From: Lena Date: Sat, 13 Mar 2021 23:12:24 +0100 Subject: Make BackButton a component and Add it to NewBugPage #10 --- webui/src/pages/new/NewBugPage.tsx | 90 +++++++++++++++++++++++++------------- 1 file changed, 59 insertions(+), 31 deletions(-) (limited to 'webui/src/pages/new/NewBugPage.tsx') diff --git a/webui/src/pages/new/NewBugPage.tsx b/webui/src/pages/new/NewBugPage.tsx index 9ad52ad0..d04e753a 100644 --- a/webui/src/pages/new/NewBugPage.tsx +++ b/webui/src/pages/new/NewBugPage.tsx @@ -1,12 +1,12 @@ import React, { FormEvent, useState } from 'react'; import { useHistory } from 'react-router-dom'; -import { Button } from '@material-ui/core'; -import Paper from '@material-ui/core/Paper'; +import { Button, Paper } from '@material-ui/core'; import { makeStyles, Theme } from '@material-ui/core/styles'; import BugTitleInput from '../../components/BugTitleForm/BugTitleInput'; import CommentInput from '../../components/CommentInput/CommentInput'; +import BackButton from '../bug/BackButton'; import { useNewBugMutation } from './NewBug.generated'; @@ -15,12 +15,17 @@ import { useNewBugMutation } from './NewBug.generated'; */ const useStyles = makeStyles((theme: Theme) => ({ main: { - maxWidth: 800, + maxWidth: 1200, margin: 'auto', marginTop: theme.spacing(4), marginBottom: theme.spacing(4), padding: theme.spacing(2), - overflow: 'hidden', + }, + container: { + display: 'flex', + marginBottom: theme.spacing(1), + marginRight: theme.spacing(2), + marginLeft: theme.spacing(2), }, form: { display: 'flex', @@ -34,6 +39,21 @@ const useStyles = makeStyles((theme: Theme) => ({ backgroundColor: theme.palette.success.main, color: theme.palette.success.contrastText, }, + leftSidebar: { + marginTop: theme.spacing(2), + 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), + }, })); /** @@ -73,34 +93,42 @@ function NewBugPage() { if (error) return
Error
; return ( - -
- { - issueTitleInput = node; - }} - label="Title" - variant="outlined" - fullWidth - margin="dense" - onChange={(event: any) => setIssueTitle(event.target.value)} - /> - setIssueComment(comment)} - /> -
- +
+
+
+
- - + +
+ { + issueTitleInput = node; + }} + label="Title" + variant="outlined" + fullWidth + margin="dense" + onChange={(event: any) => setIssueTitle(event.target.value)} + /> + setIssueComment(comment)} + /> +
+ +
+ +
+
+
+
); } -- cgit From ac17596c1ab94b6426bb5b48e39ed0dd9038303e Mon Sep 17 00:00:00 2001 From: Lena Date: Mon, 15 Mar 2021 14:52:06 +0100 Subject: Refactor BackToListButton #10 --- webui/src/pages/new/NewBugPage.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'webui/src/pages/new/NewBugPage.tsx') diff --git a/webui/src/pages/new/NewBugPage.tsx b/webui/src/pages/new/NewBugPage.tsx index d04e753a..aa220e04 100644 --- a/webui/src/pages/new/NewBugPage.tsx +++ b/webui/src/pages/new/NewBugPage.tsx @@ -4,9 +4,9 @@ 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/BackToListButton'; import BugTitleInput from '../../components/BugTitleForm/BugTitleInput'; import CommentInput from '../../components/CommentInput/CommentInput'; -import BackButton from '../bug/BackButton'; import { useNewBugMutation } from './NewBug.generated'; @@ -96,7 +96,7 @@ function NewBugPage() {
- +
-- cgit From 09fabc98a357454b2c4da4f08ce269bb4106c36a Mon Sep 17 00:00:00 2001 From: Lena Date: Mon, 15 Mar 2021 15:40:25 +0100 Subject: Adjust Button #10 --- webui/src/pages/new/NewBugPage.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'webui/src/pages/new/NewBugPage.tsx') diff --git a/webui/src/pages/new/NewBugPage.tsx b/webui/src/pages/new/NewBugPage.tsx index aa220e04..39725722 100644 --- a/webui/src/pages/new/NewBugPage.tsx +++ b/webui/src/pages/new/NewBugPage.tsx @@ -4,7 +4,7 @@ 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/BackToListButton'; +import BackToListButton from '../../components/BackToListButton'; import BugTitleInput from '../../components/BugTitleForm/BugTitleInput'; import CommentInput from '../../components/CommentInput/CommentInput'; @@ -40,7 +40,7 @@ const useStyles = makeStyles((theme: Theme) => ({ color: theme.palette.success.contrastText, }, leftSidebar: { - marginTop: theme.spacing(2), + marginTop: theme.spacing(4), marginRight: theme.spacing(2), }, rightSidebar: { -- cgit From 07e1c45cd70554630640bb1ea25968078a36fd6c Mon Sep 17 00:00:00 2001 From: Michael Muré Date: Fri, 19 Mar 2021 17:04:59 +0100 Subject: webui: minor code fixes --- webui/src/pages/new/NewBugPage.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'webui/src/pages/new/NewBugPage.tsx') diff --git a/webui/src/pages/new/NewBugPage.tsx b/webui/src/pages/new/NewBugPage.tsx index 39725722..f313ac24 100644 --- a/webui/src/pages/new/NewBugPage.tsx +++ b/webui/src/pages/new/NewBugPage.tsx @@ -86,7 +86,7 @@ function NewBugPage() { } function isFormValid() { - return issueTitle.length > 0 && issueComment.length > 0 ? true : false; + return issueTitle.length > 0; } if (loading) return
Loading...
; @@ -119,14 +119,14 @@ function NewBugPage() { className={classes.greenButton} variant="contained" type="submit" - disabled={isFormValid() ? false : true} + disabled={!isFormValid()} > Submit new issue
-
+
); -- cgit From 50f146a42a3b59341531b5f478217b10d7033ead Mon Sep 17 00:00:00 2001 From: Sascha Date: Sun, 21 Mar 2021 17:01:21 +0100 Subject: Remove BackToList button from NewBugPage --- webui/src/pages/new/NewBugPage.tsx | 87 +++++++++++++------------------------- 1 file changed, 29 insertions(+), 58 deletions(-) (limited to 'webui/src/pages/new/NewBugPage.tsx') diff --git a/webui/src/pages/new/NewBugPage.tsx b/webui/src/pages/new/NewBugPage.tsx index f313ac24..2181d44c 100644 --- a/webui/src/pages/new/NewBugPage.tsx +++ b/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
Error
; return ( -
-
-
- + +
+ { + issueTitleInput = node; + }} + label="Title" + variant="outlined" + fullWidth + margin="dense" + onChange={(event: any) => setIssueTitle(event.target.value)} + /> + setIssueComment(comment)} + /> +
+
- - - { - issueTitleInput = node; - }} - label="Title" - variant="outlined" - fullWidth - margin="dense" - onChange={(event: any) => setIssueTitle(event.target.value)} - /> - setIssueComment(comment)} - /> -
- -
- -
-
-
-
+ + ); } -- cgit