diff options
Diffstat (limited to 'webui')
18 files changed, 425 insertions, 117 deletions
diff --git a/webui/package-lock.json b/webui/package-lock.json index b3b2a490..20afceb8 100644 --- a/webui/package-lock.json +++ b/webui/package-lock.json @@ -5511,6 +5511,15 @@ "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-3.4.1.tgz", "integrity": "sha512-sofZVzE1wKwO+EYPbWfiwzaKovWiZXf4coEzjGP9b2GBVgQRLQUZ2QcuPpQExGDAW5GItpEm6Tl4OU5mywnAoQ==", "dev": true + }, + "ws": { + "version": "5.2.3", + "resolved": "https://registry.npmjs.org/ws/-/ws-5.2.3.tgz", + "integrity": "sha512-jZArVERrMsKUatIdnLzqvcfydI85dvd/Fp1u/VOpfdDWQ4c9qWXe+VIeAbQ5FrDwciAkr+lzofXLz3Kuf26AOA==", + "dev": true, + "requires": { + "async-limiter": "~1.0.0" + } } } }, @@ -10323,9 +10332,9 @@ "integrity": "sha1-s55/HabrCnW6nBcySzR1PEfgZU0=" }, "dns-packet": { - "version": "1.3.1", - "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.3.1.tgz", - "integrity": "sha512-0UxfQkMhYAUaZI+xrNZOz/as5KgDU0M/fQ9b6SpkyLbk3GEswDi6PADJVaYJradtRVsRIlF1zLyOodbcTCDzUg==", + "version": "1.3.4", + "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.3.4.tgz", + "integrity": "sha512-BQ6F4vycLXBvdrJZ6S3gZewt6rcrks9KBgM9vrhW+knGRqc8uEdT7fuCwloc7nny5xNoMJ17HGH0R/6fpo8ECA==", "requires": { "ip": "^1.1.0", "safe-buffer": "^5.0.1" @@ -12005,9 +12014,9 @@ } }, "follow-redirects": { - "version": "1.13.0", - "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.13.0.tgz", - "integrity": "sha512-aq6gF1BEKje4a9i9+5jimNFIpq4Q1WiwBToeRK5NvZBd/TRsmW8BsJfOEGkr76TbOyPVD3OVDN910EcUNtRYEA==" + "version": "1.14.7", + "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.7.tgz", + "integrity": "sha512-+hbxoLbFMbRKDwohX8GkTataGqO6Jb7jGwpAlwgy2bIz25XtRm7KEzJM76R1WiNT5SwZkX4Y75SwBolkpmE7iQ==" }, "for-in": { "version": "1.0.2", @@ -12816,9 +12825,9 @@ "integrity": "sha512-HRcs+2mr52W0K+x8RzcLzuPPmVIKMSv97RGHy0Ea9y/mpcaK+xTrjICA04KAHi4GRzxliNqNJEFYWHghy3rSfQ==" }, "hosted-git-info": { - "version": "2.8.8", - "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.8.tgz", - "integrity": "sha512-f/wzC2QaWBs7t9IYqB4T3sR1xviIViXJRJTWBlx2Gf3g0Xi5vI7Yy4koXQ1c9OYDGHN9sBy1DQ2AB8fqZBWhUg==" + "version": "2.8.9", + "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.9.tgz", + "integrity": "sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw==" }, "hpack.js": { "version": "2.1.6", @@ -14634,11 +14643,6 @@ "psl": "^1.1.28", "punycode": "^2.1.1" } - }, - "ws": { - "version": "7.3.1", - "resolved": "https://registry.npmjs.org/ws/-/ws-7.3.1.tgz", - "integrity": "sha512-D3RuNkynyHmEJIpD2qrgVkc9DQ23OrN/moAwZX4L8DfvszsJxpjQuUq3LMx6HoYji9fbIOBY18XWBsAux1ZZUA==" } } }, @@ -15221,9 +15225,9 @@ } }, "lodash": { - "version": "4.17.20", - "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.20.tgz", - "integrity": "sha512-PlhdFcillOINfeV7Ni6oF1TAEayyZBoZ8bcshTHqOYJYlrqzRK5hagpagky5o4HfCzzd1TRkXPMFq6cKk9rGmA==" + "version": "4.17.21", + "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", + "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==" }, "lodash._reinterpolate": { "version": "3.0.0", @@ -16779,9 +16783,9 @@ "integrity": "sha1-QRyttXTFoUDTpLGRDUDYDMn0C0A=" }, "path-parse": { - "version": "1.0.6", - "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.6.tgz", - "integrity": "sha512-GSmOT2EbHrINBf9SR7CDELwlJ8AENk3Qn7OikK4nFYAu3Ote2+JYNVvkpAEQm3/TLNEJFD/xZJjzyxg3KBWOzw==" + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz", + "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==" }, "path-root": { "version": "0.1.1", @@ -21088,6 +21092,15 @@ "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-3.1.2.tgz", "integrity": "sha512-tvtQIeLVHjDkJYnzf2dgVMxfuSGJeM/7UCG17TT4EumTfNtF+0nebF/4zWOIkCreAbtNqhGEboB6BWrwqNaw4Q==", "dev": true + }, + "ws": { + "version": "5.2.3", + "resolved": "https://registry.npmjs.org/ws/-/ws-5.2.3.tgz", + "integrity": "sha512-jZArVERrMsKUatIdnLzqvcfydI85dvd/Fp1u/VOpfdDWQ4c9qWXe+VIeAbQ5FrDwciAkr+lzofXLz3Kuf26AOA==", + "dev": true, + "requires": { + "async-limiter": "~1.0.0" + } } } }, @@ -21485,9 +21498,9 @@ } }, "tmpl": { - "version": "1.0.4", - "resolved": "https://registry.npmjs.org/tmpl/-/tmpl-1.0.4.tgz", - "integrity": "sha1-I2QN17QtAEM5ERQIIOXPRA5SHdE=" + "version": "1.0.5", + "resolved": "https://registry.npmjs.org/tmpl/-/tmpl-1.0.5.tgz", + "integrity": "sha512-3f0uOEAQwIqGuWW2MVzYg8fV/QNnc/IpuJNG837rLuczAaLVHslWHZQj4IGiEl5Hs3kkbhwL9Ab7Hrsmuj+Smw==" }, "to-arraybuffer": { "version": "1.0.1", @@ -21701,9 +21714,9 @@ "integrity": "sha512-tEu6DGxGgRJPb/mVPIZ48e69xCn2yRmCgYmDugAVwmJ6o+0u1RI18eO7E7WBTLYLaEVVOhwQmcdhQHweux/WPg==" }, "ua-parser-js": { - "version": "0.7.21", - "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.21.tgz", - "integrity": "sha512-+O8/qh/Qj8CgC6eYBVBykMrNtp5Gebn4dlGD/kKXVkJNDwyrAwSIqwz8CDf+tsAIWVycKcku6gIXJ0qwx/ZXaQ==", + "version": "0.7.28", + "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.28.tgz", + "integrity": "sha512-6Gurc1n//gjp9eQNXjD9O3M/sMwVtN5S8Lv9bvOYBfKfDNiIIhqiyi01vMBO45u4zkDE420w/e0se7Vs+sIg+g==", "dev": true }, "unc-path-regex": { @@ -21989,9 +22002,9 @@ } }, "url-parse": { - "version": "1.4.7", - "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.4.7.tgz", - "integrity": "sha512-d3uaVyzDB9tQoSXFvuSUNFibTd9zxd2bkVrDRvF5TmvWWQwqE4lgYJ5m+x1DbecWkw+LK4RNl2CU1hHuOKPVlg==", + "version": "1.5.3", + "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.5.3.tgz", + "integrity": "sha512-IIORyIQD9rvj0A4CLWsHkBBJuNqWpFQe224b6j9t/ABmquIS0qDU2pY6kl6AuOrL5OkCXHMCFNe1jBcuAggjvQ==", "requires": { "querystringify": "^2.1.1", "requires-port": "^1.0.0" @@ -23227,9 +23240,9 @@ } }, "ws": { - "version": "6.2.1", - "resolved": "https://registry.npmjs.org/ws/-/ws-6.2.1.tgz", - "integrity": "sha512-GIyAXC2cB7LjvpgMt9EKS2ldqr0MTrORaleiOno6TweZ6r3TKtoFQWay/2PceJ3RuBasOHzXNn5Lrw1X0bEjqA==", + "version": "6.2.2", + "resolved": "https://registry.npmjs.org/ws/-/ws-6.2.2.tgz", + "integrity": "sha512-zmhltoSR8u1cnDsD43TX59mzoMZsLKqUweyYBAIvTngR3shc0W6aOZylZmq/7hqyVxPdi+5Ud2QInblgyE72fw==", "requires": { "async-limiter": "~1.0.0" } @@ -23703,13 +23716,9 @@ } }, "ws": { - "version": "5.2.2", - "resolved": "https://registry.npmjs.org/ws/-/ws-5.2.2.tgz", - "integrity": "sha512-jaHFD6PFv6UgoIVda6qZllptQsMlDEJkTQcybzzXDYM1XO9Y8em691FGMPmM46WGyLU4z9KMgQN+qrux/nhlHA==", - "dev": true, - "requires": { - "async-limiter": "~1.0.0" - } + "version": "7.5.6", + "resolved": "https://registry.npmjs.org/ws/-/ws-7.5.6.tgz", + "integrity": "sha512-6GLgCqo2cy2A2rjCNFlxQS6ZljG/coZfZXclldI8FB/1G3CCI36Zd8xy2HrFVACi8tfk5XrgLQEk+P0Tnz9UcA==" }, "xml-name-validator": { "version": "3.0.0", diff --git a/webui/packed_assets.go b/webui/packed_assets.go index b75ab667..90bc6b38 100644 --- a/webui/packed_assets.go +++ b/webui/packed_assets.go @@ -134,7 +134,7 @@ func (fs vfsgen۰FS) Open(path string) (http.File, error) { } return &vfsgen۰CompressedFile{ vfsgen۰CompressedFileInfo: f, - gr: gr, + gr: gr, }, nil case *vfsgen۰DirInfo: return &vfsgen۰Dir{ diff --git a/webui/src/__tests__/query.ts b/webui/src/__tests__/query.ts index 2f04817c..97ec75a6 100644 --- a/webui/src/__tests__/query.ts +++ b/webui/src/__tests__/query.ts @@ -7,49 +7,136 @@ it('parses a simple query', () => { }); it('parses a query with multiple filters', () => { - expect(parse('foo:bar baz:foo-bar')).toEqual({ + expect(parse(`foo:bar baz:foo-bar`)).toEqual({ foo: ['bar'], baz: ['foo-bar'], }); + + expect(parse(`label:abc freetext`)).toEqual({ + label: [`abc`], + freetext: [''], + }); + + expect(parse(`label:abc with "quotes" 'in' freetext`)).toEqual({ + label: [`abc`], + with: [''], + '"quotes"': [''], + "'in'": [''], + freetext: [''], + }); }); it('parses a quoted query', () => { - expect(parse('foo:"bar"')).toEqual({ - foo: ['bar'], + expect(parse(`foo:"bar"`)).toEqual({ + foo: [`"bar"`], }); - expect(parse("foo:'bar'")).toEqual({ - foo: ['bar'], + expect(parse(`foo:'bar'`)).toEqual({ + foo: [`'bar'`], + }); + + expect(parse(`label:'multi word label'`)).toEqual({ + label: [`'multi word label'`], + }); + + expect(parse(`label:"multi word label"`)).toEqual({ + label: [`"multi word label"`], + }); + + expect(parse(`label:'multi word label with "nested" quotes'`)).toEqual({ + label: [`'multi word label with "nested" quotes'`], + }); + + expect(parse(`label:"multi word label with 'nested' quotes"`)).toEqual({ + label: [`"multi word label with 'nested' quotes"`], + }); + + expect(parse(`label:"with:quoated:colon"`)).toEqual({ + label: [`"with:quoated:colon"`], + }); + + expect(parse(`label:'name ends after this ->' quote'`)).toEqual({ + label: [`'name ends after this ->'`], + "quote'": [``], }); - expect(parse('foo:\'bar "nested" quotes\'')).toEqual({ - foo: ['bar "nested" quotes'], + expect(parse(`label:"name ends after this ->" quote"`)).toEqual({ + label: [`"name ends after this ->"`], + 'quote"': [``], }); - expect(parse("foo:'escaped\\' quotes'")).toEqual({ - foo: ["escaped' quotes"], + expect(parse(`label:'this ->"<- quote belongs to label name'`)).toEqual({ + label: [`'this ->"<- quote belongs to label name'`], + }); + + expect(parse(`label:"this ->'<- quote belongs to label name"`)).toEqual({ + label: [`"this ->'<- quote belongs to label name"`], + }); + + expect(parse(`label:'names end with'whitespace not with quotes`)).toEqual({ + label: [`'names end with'whitespace`], + not: [``], + with: [``], + quotes: [``], + }); + + expect(parse(`label:"names end with"whitespace not with quotes`)).toEqual({ + label: [`"names end with"whitespace`], + not: [``], + with: [``], + quotes: [``], + }); +}); + +it('should not escape nested quotes', () => { + expect(parse(`foo:'do not escape this ->'<- quote'`)).toEqual({ + foo: [`'do not escape this ->'<-`], + "quote'": [``], + }); + + expect(parse(`foo:'do not escape this ->"<- quote'`)).toEqual({ + foo: [`'do not escape this ->"<- quote'`], + }); + + expect(parse(`foo:"do not escape this ->"<- quote"`)).toEqual({ + foo: [`"do not escape this ->"<-`], + 'quote"': [``], + }); + + expect(parse(`foo:"do not escape this ->'<- quote"`)).toEqual({ + foo: [`"do not escape this ->'<- quote"`], }); }); it('parses a query with repetitions', () => { - expect(parse('foo:bar foo:baz')).toEqual({ + expect(parse(`foo:bar foo:baz`)).toEqual({ foo: ['bar', 'baz'], }); }); it('parses a complex query', () => { - expect(parse('foo:bar foo:baz baz:"foobar" idont:\'know\'')).toEqual({ + expect(parse(`foo:bar foo:baz baz:"foobar" idont:'know'`)).toEqual({ foo: ['bar', 'baz'], - baz: ['foobar'], - idont: ['know'], + baz: [`"foobar"`], + idont: [`'know'`], }); }); +it('parses a key:value:value query', () => { + expect(parse(`meta:github:"https://github.com/MichaelMure/git-bug"`)).toEqual( + { + meta: [`github:"https://github.com/MichaelMure/git-bug"`], + } + ); +}); + it('quotes values', () => { - expect(quote('foo')).toEqual('foo'); - expect(quote('foo bar')).toEqual('"foo bar"'); - expect(quote('foo "bar"')).toEqual(`'foo "bar"'`); - expect(quote(`foo "bar" 'baz'`)).toEqual(`"foo \\"bar\\" 'baz'"`); + expect(quote(`foo`)).toEqual(`foo`); + expect(quote(`foo bar`)).toEqual(`"foo bar"`); + expect(quote(`foo "bar"`)).toEqual(`"foo "bar""`); + expect(quote(`foo 'bar'`)).toEqual(`"foo "bar""`); + expect(quote(`'foo'`)).toEqual(`"foo"`); + expect(quote(`foo "bar" 'baz'`)).toEqual(`"foo "bar" "baz""`); }); it('stringifies params', () => { diff --git a/webui/src/components/CloseBugButton/CloseBugButton.tsx b/webui/src/components/CloseBugButton/index.tsx index 9f098483..bb154ea7 100644 --- a/webui/src/components/CloseBugButton/CloseBugButton.tsx +++ b/webui/src/components/CloseBugButton/index.tsx @@ -1,6 +1,7 @@ import React from 'react'; import Button from '@material-ui/core/Button'; +import CircularProgress from '@material-ui/core/CircularProgress'; import { makeStyles, Theme } from '@material-ui/core/styles'; import ErrorOutlineIcon from '@material-ui/icons/ErrorOutline'; @@ -18,7 +19,7 @@ const useStyles = makeStyles((theme: Theme) => ({ interface Props { bug: BugFragment; - disabled: boolean; + disabled?: boolean; } function CloseBugButton({ bug, disabled }: Props) { @@ -46,7 +47,7 @@ function CloseBugButton({ bug, disabled }: Props) { }); } - if (loading) return <div>Loading...</div>; + if (loading) return <CircularProgress />; if (error) return <div>Error</div>; return ( diff --git a/webui/src/components/CloseBugWithCommentButton/CloseBugWithComment.graphql b/webui/src/components/CloseBugWithCommentButton/CloseBugWithComment.graphql new file mode 100644 index 00000000..eb736f53 --- /dev/null +++ b/webui/src/components/CloseBugWithCommentButton/CloseBugWithComment.graphql @@ -0,0 +1,11 @@ +mutation AddCommentAndCloseBug($input: AddCommentAndCloseBugInput!) { + addCommentAndClose(input: $input) { + statusOperation { + status + } + commentOperation { + message + } + } +} + diff --git a/webui/src/components/CloseBugWithCommentButton/index.tsx b/webui/src/components/CloseBugWithCommentButton/index.tsx new file mode 100644 index 00000000..a0fefa4a --- /dev/null +++ b/webui/src/components/CloseBugWithCommentButton/index.tsx @@ -0,0 +1,75 @@ +import React from 'react'; + +import Button from '@material-ui/core/Button'; +import CircularProgress from '@material-ui/core/CircularProgress'; +import { makeStyles, Theme } from '@material-ui/core/styles'; +import ErrorOutlineIcon from '@material-ui/icons/ErrorOutline'; + +import { BugFragment } from 'src/pages/bug/Bug.generated'; +import { TimelineDocument } from 'src/pages/bug/TimelineQuery.generated'; + +import { useAddCommentAndCloseBugMutation } from './CloseBugWithComment.generated'; + +const useStyles = makeStyles((theme: Theme) => ({ + closeIssueIcon: { + color: theme.palette.secondary.dark, + paddingTop: '0.1rem', + }, +})); + +interface Props { + bug: BugFragment; + comment: string; + postClick?: () => void; +} + +function CloseBugWithCommentButton({ bug, comment, postClick }: Props) { + const [ + addCommentAndCloseBug, + { loading, error }, + ] = useAddCommentAndCloseBugMutation(); + const classes = useStyles(); + + function addCommentAndCloseBugAction() { + addCommentAndCloseBug({ + variables: { + input: { + prefix: bug.id, + message: comment, + }, + }, + refetchQueries: [ + // TODO: update the cache instead of refetching + { + query: TimelineDocument, + variables: { + id: bug.id, + first: 100, + }, + }, + ], + awaitRefetchQueries: true, + }).then(() => { + if (postClick) { + postClick(); + } + }); + } + + if (loading) return <CircularProgress />; + if (error) return <div>Error</div>; + + return ( + <div> + <Button + variant="contained" + onClick={() => addCommentAndCloseBugAction()} + startIcon={<ErrorOutlineIcon className={classes.closeIssueIcon} />} + > + Close bug with comment + </Button> + </div> + ); +} + +export default CloseBugWithCommentButton; diff --git a/webui/src/components/CommentInput/CommentInput.tsx b/webui/src/components/CommentInput/CommentInput.tsx index f12ee8d8..babd495c 100644 --- a/webui/src/components/CommentInput/CommentInput.tsx +++ b/webui/src/components/CommentInput/CommentInput.tsx @@ -1,5 +1,6 @@ import React, { useState, useEffect } from 'react'; +import { Typography } from '@material-ui/core'; import Tab from '@material-ui/core/Tab'; import Tabs from '@material-ui/core/Tabs'; import TextField from '@material-ui/core/TextField'; @@ -15,14 +16,23 @@ const useStyles = makeStyles((theme) => ({ margin: theme.spacing(2, 0), padding: theme.spacing(0, 2, 2, 2), }, - textarea: {}, + textarea: { + '& textarea.MuiInputBase-input': { + resize: 'vertical', + }, + }, tabContent: { margin: theme.spacing(2, 0), }, preview: { + overflow: 'auto', borderBottom: `solid 3px ${theme.palette.grey['200']}`, minHeight: '5rem', }, + previewPlaceholder: { + color: theme.palette.text.secondary, + fontStyle: 'italic', + }, })); type TabPanelProps = { @@ -98,7 +108,13 @@ function CommentInput({ inputProps, inputText, loading, onChange }: Props) { /> </TabPanel> <TabPanel value={tab} index={1} className={classes.preview}> - <Content markdown={input} /> + {input !== '' ? ( + <Content markdown={input} /> + ) : ( + <Typography className={classes.previewPlaceholder}> + Nothing to preview. + </Typography> + )} </TabPanel> </div> </div> diff --git a/webui/src/components/Header/Header.tsx b/webui/src/components/Header/Header.tsx index 56b35968..866e52db 100644 --- a/webui/src/components/Header/Header.tsx +++ b/webui/src/components/Header/Header.tsx @@ -6,7 +6,7 @@ import Tab, { TabProps } from '@material-ui/core/Tab'; import Tabs from '@material-ui/core/Tabs'; import Toolbar from '@material-ui/core/Toolbar'; import Tooltip from '@material-ui/core/Tooltip/Tooltip'; -import { makeStyles } from '@material-ui/core/styles'; +import { fade, makeStyles } from '@material-ui/core/styles'; import CurrentIdentity from '../Identity/CurrentIdentity'; import { LightSwitch } from '../Themer'; @@ -30,7 +30,8 @@ const useStyles = makeStyles((theme) => ({ alignItems: 'center', }, lightSwitch: { - padding: '0 20px', + marginRight: '20px', + color: fade(theme.palette.primary.contrastText, 0.5), }, logo: { height: '42px', @@ -85,9 +86,7 @@ function Header() { git-bug </Link> <div className={classes.filler} /> - <div className={classes.lightSwitch}> - <LightSwitch /> - </div> + <LightSwitch className={classes.lightSwitch} /> <CurrentIdentity /> </Toolbar> </AppBar> diff --git a/webui/src/components/ReopenBugButton/ReopenBugButton.tsx b/webui/src/components/ReopenBugButton/index.tsx index e3e792fc..e62c58df 100644 --- a/webui/src/components/ReopenBugButton/ReopenBugButton.tsx +++ b/webui/src/components/ReopenBugButton/index.tsx @@ -1,6 +1,7 @@ import React from 'react'; import Button from '@material-ui/core/Button'; +import CircularProgress from '@material-ui/core/CircularProgress'; import { BugFragment } from 'src/pages/bug/Bug.generated'; import { TimelineDocument } from 'src/pages/bug/TimelineQuery.generated'; @@ -9,7 +10,7 @@ import { useOpenBugMutation } from './OpenBug.generated'; interface Props { bug: BugFragment; - disabled: boolean; + disabled?: boolean; } function ReopenBugButton({ bug, disabled }: Props) { @@ -36,7 +37,7 @@ function ReopenBugButton({ bug, disabled }: Props) { }); } - if (loading) return <div>Loading...</div>; + if (loading) return <CircularProgress />; if (error) return <div>Error</div>; return ( diff --git a/webui/src/components/ReopenBugWithCommentButton/ReopenBugWithComment.graphql b/webui/src/components/ReopenBugWithCommentButton/ReopenBugWithComment.graphql new file mode 100644 index 00000000..4c220208 --- /dev/null +++ b/webui/src/components/ReopenBugWithCommentButton/ReopenBugWithComment.graphql @@ -0,0 +1,11 @@ +mutation AddCommentAndReopenBug($input: AddCommentAndReopenBugInput!) { + addCommentAndReopen(input: $input) { + statusOperation { + status + } + commentOperation { + message + } + } +} + diff --git a/webui/src/components/ReopenBugWithCommentButton/index.tsx b/webui/src/components/ReopenBugWithCommentButton/index.tsx new file mode 100644 index 00000000..0a534f27 --- /dev/null +++ b/webui/src/components/ReopenBugWithCommentButton/index.tsx @@ -0,0 +1,65 @@ +import React from 'react'; + +import Button from '@material-ui/core/Button'; +import CircularProgress from '@material-ui/core/CircularProgress'; + +import { BugFragment } from 'src/pages/bug/Bug.generated'; +import { TimelineDocument } from 'src/pages/bug/TimelineQuery.generated'; + +import { useAddCommentAndReopenBugMutation } from './ReopenBugWithComment.generated'; + +interface Props { + bug: BugFragment; + comment: string; + postClick?: () => void; +} + +function ReopenBugWithCommentButton({ bug, comment, postClick }: Props) { + const [ + addCommentAndReopenBug, + { loading, error }, + ] = useAddCommentAndReopenBugMutation(); + + function addCommentAndReopenBugAction() { + addCommentAndReopenBug({ + variables: { + input: { + prefix: bug.id, + message: comment, + }, + }, + refetchQueries: [ + // TODO: update the cache instead of refetching + { + query: TimelineDocument, + variables: { + id: bug.id, + first: 100, + }, + }, + ], + awaitRefetchQueries: true, + }).then(() => { + if (postClick) { + postClick(); + } + }); + } + + if (loading) return <CircularProgress />; + if (error) return <div>Error</div>; + + return ( + <div> + <Button + variant="contained" + type="submit" + onClick={() => addCommentAndReopenBugAction()} + > + Reopen bug with comment + </Button> + </div> + ); +} + +export default ReopenBugWithCommentButton; diff --git a/webui/src/components/Themer.tsx b/webui/src/components/Themer.tsx index b4877974..edf1f352 100644 --- a/webui/src/components/Themer.tsx +++ b/webui/src/components/Themer.tsx @@ -1,35 +1,30 @@ import React, { createContext, useContext, useState } from 'react'; -import { fade, ThemeProvider } from '@material-ui/core'; -import IconButton from '@material-ui/core/IconButton/IconButton'; -import Tooltip from '@material-ui/core/Tooltip/Tooltip'; +import { ThemeProvider } from '@material-ui/core'; +import IconButton from '@material-ui/core/IconButton'; +import Tooltip from '@material-ui/core/Tooltip'; import { Theme } from '@material-ui/core/styles'; import { NightsStayRounded, WbSunnyRounded } from '@material-ui/icons'; -import { makeStyles } from '@material-ui/styles'; const ThemeContext = createContext({ toggleMode: () => {}, mode: '', }); -const useStyles = makeStyles((theme: Theme) => ({ - iconButton: { - color: fade(theme.palette.primary.contrastText, 0.5), - }, -})); - -const LightSwitch = () => { +type LightSwitchProps = { + className?: string; +}; +const LightSwitch = ({ className }: LightSwitchProps) => { const { mode, toggleMode } = useContext(ThemeContext); const nextMode = mode === 'light' ? 'dark' : 'light'; const description = `Switch to ${nextMode} theme`; - const classes = useStyles(); return ( <Tooltip title={description}> <IconButton onClick={toggleMode} aria-label={description} - className={classes.iconButton} + className={className} > {mode === 'light' ? <WbSunnyRounded /> : <NightsStayRounded />} </IconButton> diff --git a/webui/src/pages/bug/CommentForm.tsx b/webui/src/pages/bug/CommentForm.tsx index a8ce4319..6d917889 100644 --- a/webui/src/pages/bug/CommentForm.tsx +++ b/webui/src/pages/bug/CommentForm.tsx @@ -5,8 +5,10 @@ import Paper from '@material-ui/core/Paper'; import { makeStyles, Theme } from '@material-ui/core/styles'; import CommentInput from '../../components/CommentInput/CommentInput'; -import CloseBugButton from 'src/components/CloseBugButton/CloseBugButton'; -import ReopenBugButton from 'src/components/ReopenBugButton/ReopenBugButton'; +import CloseBugButton from 'src/components/CloseBugButton'; +import CloseBugWithCommentButton from 'src/components/CloseBugWithCommentButton'; +import ReopenBugButton from 'src/components/ReopenBugButton'; +import ReopenBugWithCommentButton from 'src/components/ReopenBugWithCommentButton'; import { BugFragment } from './Bug.generated'; import { useAddCommentMutation } from './CommentForm.generated'; @@ -77,12 +79,29 @@ function CommentForm({ bug }: Props) { if (issueComment.length > 0) submit(); }; - function getCloseButton() { - return <CloseBugButton bug={bug} disabled={issueComment.length > 0} />; - } - - function getReopenButton() { - return <ReopenBugButton bug={bug} disabled={issueComment.length > 0} />; + function getBugStatusButton() { + if (bug.status === 'OPEN' && issueComment.length > 0) { + return ( + <CloseBugWithCommentButton + bug={bug} + comment={issueComment} + postClick={resetForm} + /> + ); + } + if (bug.status === 'OPEN') { + return <CloseBugButton bug={bug} />; + } + if (bug.status === 'CLOSED' && issueComment.length > 0) { + return ( + <ReopenBugWithCommentButton + bug={bug} + comment={issueComment} + postClick={resetForm} + /> + ); + } + return <ReopenBugButton bug={bug} />; } return ( @@ -94,7 +113,7 @@ function CommentForm({ bug }: Props) { onChange={(comment: string) => setIssueComment(comment)} /> <div className={classes.actions}> - {bug.status === 'OPEN' ? getCloseButton() : getReopenButton()} + {getBugStatusButton()} <Button className={classes.greenButton} variant="contained" diff --git a/webui/src/pages/bug/Message.tsx b/webui/src/pages/bug/Message.tsx index 808bb525..51087faa 100644 --- a/webui/src/pages/bug/Message.tsx +++ b/webui/src/pages/bug/Message.tsx @@ -57,6 +57,7 @@ const useStyles = makeStyles((theme) => ({ marginLeft: '0.5rem', }, body: { + overflow: 'auto', ...theme.typography.body2, paddingLeft: theme.spacing(1), paddingRight: theme.spacing(1), @@ -156,7 +157,11 @@ function Message({ bug, op }: Props) { </IfLoggedIn> </header> <section className={classes.body}> - <Content markdown={comment.message} /> + {comment.message !== '' ? ( + <Content markdown={comment.message} /> + ) : ( + <Content markdown="*No description provided.*" /> + )} </section> </Paper> ); diff --git a/webui/src/pages/bug/MessageHistoryDialog.tsx b/webui/src/pages/bug/MessageHistoryDialog.tsx index 5879a373..df8915d9 100644 --- a/webui/src/pages/bug/MessageHistoryDialog.tsx +++ b/webui/src/pages/bug/MessageHistoryDialog.tsx @@ -111,6 +111,7 @@ const AccordionSummary = withStyles((theme) => ({ const AccordionDetails = withStyles((theme) => ({ root: { display: 'block', + overflow: 'auto', padding: theme.spacing(2), }, }))(MuiAccordionDetails); @@ -229,7 +230,11 @@ function MessageHistoryDialog({ bugId, commentId, open, onClose }: Props) { <Typography>{getSummary(index, edit.date)}</Typography> </AccordionSummary> <AccordionDetails> - <Content markdown={edit.message} /> + {edit.message !== '' ? ( + <Content markdown={edit.message} /> + ) : ( + <Content markdown="*No description provided.*" /> + )} </AccordionDetails> </Accordion> ))} diff --git a/webui/src/pages/list/BugRow.tsx b/webui/src/pages/list/BugRow.tsx index 562149f3..68a3b299 100644 --- a/webui/src/pages/list/BugRow.tsx +++ b/webui/src/pages/list/BugRow.tsx @@ -84,7 +84,9 @@ const useStyles = makeStyles((theme) => ({ }, commentCount: { fontSize: '1rem', + minWidth: '2rem', marginLeft: theme.spacing(0.5), + marginRight: theme.spacing(1), }, commentCountCell: { display: 'inline-flex', diff --git a/webui/src/pages/list/Filter.tsx b/webui/src/pages/list/Filter.tsx index 3559b3ce..496fb3ba 100644 --- a/webui/src/pages/list/Filter.tsx +++ b/webui/src/pages/list/Filter.tsx @@ -35,52 +35,50 @@ const ITEM_HEIGHT = 48; export type Query = { [key: string]: string[] }; function parse(query: string): Query { - // TODO: extract the rest of the query? const params: Query = {}; - - // TODO: support escaping without quotes - const re = /(\w+):([A-Za-z0-9-]+|(["'])(([^\3]|\\.)*)\3)+/g; + let re = new RegExp(/([^:\s]+)(:('[^']*'\S*|"[^"]*"\S*|\S*))?/, 'g'); let matches; while ((matches = re.exec(query)) !== null) { if (!params[matches[1]]) { params[matches[1]] = []; } - - let value; - if (matches[4]) { - value = matches[4]; + if (matches[3] !== undefined) { + params[matches[1]].push(matches[3]); } else { - value = matches[2]; + params[matches[1]].push(''); } - value = value.replace(/\\(.)/g, '$1'); - params[matches[1]].push(value); } return params; } function quote(value: string): string { - const hasSingle = value.includes("'"); - const hasDouble = value.includes('"'); const hasSpaces = value.includes(' '); - if (!hasSingle && !hasDouble && !hasSpaces) { - return value; - } + const isSingleQuotedRegEx = RegExp(/^'.*'$/); + const isDoubleQuotedRegEx = RegExp(/^".*"$/); + const isQuoted = () => + isDoubleQuotedRegEx.test(value) || isSingleQuotedRegEx.test(value); - if (!hasDouble) { - return `"${value}"`; + //Test if label name contains whitespace between quotes. If no quoates but + //whitespace, then quote string. + if (!isQuoted() && hasSpaces) { + value = `"${value}"`; } - if (!hasSingle) { - return `'${value}'`; + //Convert single quote (tick) to double quote. This way quoting is always + //uniform and can be relied upon by the label menu + const hasSingle = value.includes(`'`); + if (hasSingle) { + value = value.replace(/'/g, `"`); } - value = value.replace(/"/g, '\\"'); - return `"${value}"`; + return value; } function stringify(params: Query): string { const parts: string[][] = Object.entries(params).map(([key, values]) => { - return values.map((value) => `${key}:${quote(value)}`); + return values.map((value) => + value.length > 0 ? `${key}:${quote(value)}` : key + ); }); return new Array<string>().concat(...parts).join(' '); } diff --git a/webui/src/pages/list/FilterToolbar.tsx b/webui/src/pages/list/FilterToolbar.tsx index e109578d..4ac579f5 100644 --- a/webui/src/pages/list/FilterToolbar.tsx +++ b/webui/src/pages/list/FilterToolbar.tsx @@ -56,6 +56,16 @@ function CountingFilter({ query, children, ...props }: CountingFilterProps) { ); } +function quoteLabel(value: string) { + const hasUnquotedColon = RegExp(/^[^'"].*:.*[^'"]$/); + if (hasUnquotedColon.test(value)) { + //quote values which contain a colon but are not quoted. + //E.g. abc:abc becomes "abc:abc" + return `"${value}"`; + } + return value; +} + type Props = { query: string; queryLocation: (query: string) => LocationDescriptor; @@ -87,7 +97,7 @@ function FilterToolbar({ query, queryLocation }: Props) { labelsData.repository.validLabels.nodes ) { labels = labelsData.repository.validLabels.nodes.map((node) => [ - node.name, + quoteLabel(node.name), node.name, node.color, ]); @@ -131,7 +141,6 @@ function FilterToolbar({ query, queryLocation }: Props) { [key]: [], }); - // TODO: author/label filters return ( <Toolbar className={classes.toolbar}> <CountingFilter |