diff --git a/compose-db.js b/compose-db.js index 4b40f0d..1cf2117 100644 --- a/compose-db.js +++ b/compose-db.js @@ -167,16 +167,6 @@ class DataFetcher { title url } - - labels (first: 100) { - edges { - node { - id - name - color - } - } - } files (first: 100) { edges { @@ -295,8 +285,6 @@ class DataProcessor { "updated_at": item.updatedAt, "target_branch": item.baseRef.name, - - "labels": [], "milestone": null, "files": [], @@ -338,21 +326,6 @@ class DataProcessor { }; } - // Add labels, if available. - let labels = mapNodes(item.labels); - labels.forEach((labelItem) => { - pr.labels.push({ - "id": labelItem.id, - "name": labelItem.name, - "color": "#" + labelItem.color, - }); - }); - pr.labels.sort((a, b) => { - if (a.name > b.name) return 1; - if (a.name < b.name) return -1; - return 0; - }); - // Add changed files. let files = mapNodes(item.files); const visitedPaths = []; diff --git a/src/paths/index/components/files/FileList.js b/src/paths/index/components/files/FileList.js index 4fa70d1..fac63eb 100644 --- a/src/paths/index/components/files/FileList.js +++ b/src/paths/index/components/files/FileList.js @@ -53,6 +53,7 @@ export default class FileList extends LitElement { @property({ type: String }) selectedBranch = "master"; @property({ type: String }) selectedPath = ""; @property({ type: Array }) selectedFolders = []; + @property({ type: String }) filteredPull = ""; constructor() { super(); @@ -86,6 +87,10 @@ export default class FileList extends LitElement {
${(folderFiles.length > 0) ? folderFiles.map((item) => { + if (this.filteredPull !== "" && !item.pulls.includes(parseInt(this.filteredPull, 10))) { + return html``; + } + return html`
+ Input PR link or number: + + + ${this._resolvedValue} + +
+ `; + } +} diff --git a/src/paths/index/components/pulls/PullRequestItem.js b/src/paths/index/components/pulls/PullRequestItem.js index 18c1920..50099bd 100644 --- a/src/paths/index/components/pulls/PullRequestItem.js +++ b/src/paths/index/components/pulls/PullRequestItem.js @@ -7,16 +7,14 @@ export default class PullRequestItem extends LitElement { /** Colors and variables **/ :host { --pr-border-color: #fcfcfa; - --draft-font-color: #ffcc31; - --draft-background-color: #9db3c0; + --star-font-color: #ffcc31; --ghost-font-color: #738b99; } @media (prefers-color-scheme: dark) { :host { --pr-border-color: #0d1117; - --draft-font-color: #e0c537; - --draft-background-color: #1e313c; + --star-font-color: #e0c537; --ghost-font-color: #495d68; } } @@ -48,13 +46,11 @@ export default class PullRequestItem extends LitElement { word-break: break-word; } - :host .pr-title-draft { - background-color: var(--draft-background-color); - border-radius: 6px 6px; - color: var(--draft-font-color); - font-size: 14px; - padding: 1px 6px; - vertical-align: bottom; + :host .pr-container--draft .pr-title { + filter: saturate(0.4); + } + :host .pr-container--draft .pr-title-name { + opacity: 0.7; } :host .pr-meta { @@ -65,27 +61,6 @@ export default class PullRequestItem extends LitElement { font-size: 13px; } - :host .pr-labels { - display: flex; - flex-flow: column wrap; - padding: 4px 0; - max-height: 60px; - } - - :host .pr-label { - padding-right: 8px; - } - :host .pr-label-dot { - border-radius: 4px; - box-shadow: rgb(0 0 0 / 28%) 0 0 3px 0; - display: inline-block; - width: 8px; - height: 8px; - } - :host .pr-label-name { - padding-left: 3px; - } - :host .pr-milestone-value { font-weight: 700; } @@ -107,7 +82,7 @@ export default class PullRequestItem extends LitElement { } :host .pr-author-value--hot:before { content: "★"; - color: var(--draft-font-color); + color: var(--star-font-color); } :host .pr-author-value--ghost { color: var(--ghost-font-color); @@ -137,10 +112,6 @@ export default class PullRequestItem extends LitElement { :host .pr-meta { flex-wrap: wrap; } - :host .pr-labels { - width: 100%; - justify-content: space-between; - } } `; } @@ -151,7 +122,6 @@ export default class PullRequestItem extends LitElement { @property({ type: String, reflect: true }) diff_url = ''; @property({ type: String, reflect: true }) patch_url = ''; @property({ type: Boolean }) draft = false; - @property({ type: Array }) labels = []; @property({ type: String, reflect: true }) milestone = ''; @property({ type: String, reflect: true }) branch = ''; @property({ type: String }) created_at = ''; @@ -167,46 +137,17 @@ export default class PullRequestItem extends LitElement { authorClassList.push("pr-author-value--ghost"); } - // Keep it to two columns, but if there isn't enough labels, keep it to one. - let labels_height = Math.ceil(this.labels.length / 2) * 20; - if (labels_height < 60) { - labels_height = 60; - } - return html` -
+
- ${(this.draft ? html` - draft - ` : '')} #${this.id} ${this.title}
-
- ${this.labels.map((item) => { - return html` - - - - ${item.name} - - - `; - })} -
-
milestone: @@ -229,6 +170,20 @@ export default class PullRequestItem extends LitElement {
+
+
+ author: + + ${this.author.user} + +
+
+
created: @@ -248,17 +203,6 @@ export default class PullRequestItem extends LitElement { ${greports.format.formatDate(this.updated_at)}
-
- author: - - ${this.author.user} - -
diff --git a/src/paths/index/components/pulls/PullRequestList.js b/src/paths/index/components/pulls/PullRequestList.js index 50bb723..9ae7d7f 100644 --- a/src/paths/index/components/pulls/PullRequestList.js +++ b/src/paths/index/components/pulls/PullRequestList.js @@ -39,15 +39,14 @@ export default class PullRequestList extends LitElement { min-width: 60px; } - :host .team-pulls { + :host .file-pulls { background-color: var(--pulls-background-color); border-radius: 0 4px 4px 0; padding: 8px 12px; max-width: 760px; - min-height: 200px; } - :host .team-pulls-toolbar { + :host .file-pulls-toolbar { background: var(--pulls-toolbar-color); border-radius: 4px; display: flex; @@ -68,12 +67,12 @@ export default class PullRequestList extends LitElement { } @media only screen and (max-width: 900px) { - :host .team-pulls { + :host .file-pulls { padding: 8px; max-width: 95%; margin: 0px auto; } - :host .team-pulls-toolbar { + :host .file-pulls-toolbar { flex-wrap: wrap; } :host .pulls-count { @@ -95,6 +94,7 @@ export default class PullRequestList extends LitElement { @property({ type: String }) selectedBranch = ""; @property({ type: String }) selectedPath = ""; @property({ type: Array }) selectedPulls = []; + @property({ type: String }) filteredPull = ""; render(){ if (this.selectedPath === "") { @@ -115,22 +115,61 @@ export default class PullRequestList extends LitElement { }); const total_pulls = this.pulls.length; - const filtered_pulls = pulls.length + let filtered_pulls = pulls.length + + const has_pinned = (this.filteredPull !== ""); + if (has_pinned) { + filtered_pulls -= 1; + } return html` -
-
-
- PRs affecting this path: - ${filtered_pulls} - ${(filtered_pulls !== total_pulls) ? html` - (out of ${total_pulls}) - ` : '' - } -
-
- +
${pulls.map((item) => { + if (!has_pinned || parseInt(this.filteredPull, 10) !== item.public_id) { + return html``; + } + + let author = null; + if (typeof this.authors[item.authored_by] != "undefined") { + author = this.authors[item.authored_by]; + } + + return html` + + `; + })} + +
+
+ ${(has_pinned ? "Other " : "")}PRs affecting this path: + ${filtered_pulls} + ${(filtered_pulls !== total_pulls) ? html` + (out of ${total_pulls}) + ` : '' + } +
+
+ + ${pulls.map((item) => { + if (has_pinned && parseInt(this.filteredPull, 10) === item.public_id) { + return html``; + } + let author = null; if (typeof this.authors[item.authored_by] != "undefined") { author = this.authors[item.authored_by]; @@ -143,7 +182,6 @@ export default class PullRequestList extends LitElement { .url="${item.url}" ?draft="${item.is_draft}" - .labels="${item.labels}" .milestone="${item.milestone}" .branch="${item.target_branch}" diff --git a/src/paths/index/entry.js b/src/paths/index/entry.js index 9234284..ee4818c 100644 --- a/src/paths/index/entry.js +++ b/src/paths/index/entry.js @@ -4,6 +4,7 @@ import PageContent from 'src/shared/components/PageContent'; import IndexHeader from "./components/IndexHeader"; import IndexDescription from "./components/IndexDescription"; +import PullFilter from './components/filters/PullFilter'; import FileList from "./components/files/FileList"; import PullList from "./components/pulls/PullRequestList" @@ -53,6 +54,8 @@ export default class EntryComponent extends LitElement { this._selectedPath = ""; this._selectedPathPulls = []; + this._filteredPull = ""; + this._requestData(); } @@ -130,6 +133,19 @@ export default class EntryComponent extends LitElement { this.requestUpdate(); } + _onPullFilterChanged(event) { + this._filteredPull = event.detail.pull; + if (this._filteredPull !== "") { + const pullNumber = parseInt(this._filteredPull, 10); + if (!this._selectedPathPulls.includes(pullNumber)) { + this._selectedPath = ""; + this._selectedPathPulls = []; + } + } + + this.requestUpdate(); + } + _onPathClicked(event) { this._selectedPath = event.detail.path; this._selectedPathPulls = event.detail.pulls; @@ -142,6 +158,10 @@ export default class EntryComponent extends LitElement { + + ${(this._isLoading ? html`

Loading...

` : html` @@ -152,6 +172,7 @@ export default class EntryComponent extends LitElement { .selectedRepository="${this._selectedRepository}" .selectedBranch="${this._selectedBranch}" .selectedPath="${this._selectedPath}" + .filteredPull="${this._filteredPull}" @pathclicked="${this._onPathClicked}" > @@ -161,6 +182,7 @@ export default class EntryComponent extends LitElement { .selectedBranch="${this._selectedBranch}" .selectedPath="${this._selectedPath}" .selectedPulls="${this._selectedPathPulls}" + .filteredPull="${this._filteredPull}" >
`)} diff --git a/src/shared/styles/global.css b/src/shared/styles/global.css index 217cc4d..8e7d562 100644 --- a/src/shared/styles/global.css +++ b/src/shared/styles/global.css @@ -2,6 +2,7 @@ :root { --g-background-color: #fcfcfa; --g-background-extra-color: #98a5b8; + --g-background-extra2-color: #cad3e1; --g-font-color: #121314; --g-font-size: 15px; --g-font-weight: 400; @@ -19,6 +20,7 @@ :root { --g-background-color: #0d1117; --g-background-extra-color: #515c6c; + --g-background-extra2-color: #22252b; --g-font-color: rgba(228, 228, 232, 0.9); --link-font-color: #367df7;