diff --git a/src/Checkbox.js b/src/Checkbox.js new file mode 100644 index 0000000..bec3132 --- /dev/null +++ b/src/Checkbox.js @@ -0,0 +1,39 @@ +import { css, html } from './utils' + +export function Checkbox({ + checked, + name, + onClick, +}) { + return html` + + ` +} diff --git a/src/OptionsGroup.js b/src/OptionsGroup.js index 5aef0d0..5cab814 100644 --- a/src/OptionsGroup.js +++ b/src/OptionsGroup.js @@ -1,4 +1,5 @@ import { css, html } from './utils' +import { Checkbox } from './Checkbox' export function OptionsGroup({ name: groupName, @@ -40,36 +41,13 @@ export function OptionsGroup({ ${options.length > 0 ? options.map( ([name, checked, optionName]) => html` - + <${Checkbox} + checked=${checked} + name=${name} + onClick=${() => + onOptionChange(settingName || groupName, optionName || name, !checked) + } + /> ` ) : 'Loading…'} diff --git a/src/index.js b/src/index.js index ba239bf..0f719cf 100644 --- a/src/index.js +++ b/src/index.js @@ -1,6 +1,7 @@ import { render } from 'preact' import { useCallback, useEffect, useMemo, useState } from 'preact/hooks' import { css, html, flatten } from './utils' +import { Checkbox } from './Checkbox' import { Layout } from './Layout' import { PrGroup } from './PrGroup' import { OptionsGroup } from './OptionsGroup' @@ -36,13 +37,14 @@ async function getRepoPrs(repo) { return { assignees: pr.assignees, created: new Date(pr.created_at), - url: pr.html_url, + draft: pr.draft, number: pr.number, + repo: pr.base.repo.full_name, reviewers: reviewers.length > 0 ? reviewers : ['none'], state: pr.state, title: pr.title, + url: pr.html_url, user: pr.user.login, - repo: pr.base.repo.full_name, } }) } @@ -76,6 +78,7 @@ function useFetchPrs() { function App() { const [repos, setRepos] = useState(REPOS.map(repo => [repo, true])) const [reviewers, setReviewers] = useState([]) + const [ignoredInDraft, setIgnoredInDraft] = useState(true) const [prs, loading] = useFetchPrs() const changeOption = useCallback((groupName, optionName, check) => { @@ -97,6 +100,8 @@ function App() { ) } }, []) + const changeIgnored = useCallback(() => + setIgnoredInDraft(ignored => !ignored), []) const options = useMemo( () => { @@ -117,12 +122,27 @@ function App() { return orgMap }, new Map())] const repoOptions = html` -
- Repos: +
+
+
Repos:
+ <${Checkbox} + checked=${ignoredInDraft} + name="Ignore draft PRs" + onClick=${changeIgnored} + +
{ + // Filter by draft status + if (ignoredInDraft && pr.draft) { + return + } + // Filter by reviewer if ( pr.reviewers.length > 0 && @@ -183,7 +208,7 @@ function App() { }, [[], [...prs].reverse()] )[0], - [prs, reviewers, repos] + [ignoredInDraft, prs, reviewers, repos] ) useEffect(() => {