feat(plugins/projects): add support for GitHub projects beta (#1178)

2022-08-06 20:39:22 +02:00
parent cf21c67a39
commit 6c04a1ca5e
14 changed files with 222 additions and 47 deletions
--- a/source/app/web/statics/embed/app.placeholder.js
+++ b/source/app/web/statics/embed/app.placeholder.js
@@ -715,15 +715,26 @@
                name: faker.lorem.sentence(),
                description: faker.lorem.paragraph(),
                updated: `${2 + faker.datatype.number(8)} days ago`,
-                progress: {
-                  enabled: true,
-                  todo: faker.datatype.number(50),
-                  doing: faker.datatype.number(50),
-                  done: faker.datatype.number(50),
-                  get total() {
-                    return this.todo + this.doing + this.done
-                  },
-                },
+                ...(faker.datatype.boolean() ? {
+                  items: new Array(faker.datatype.number(4)).fill(null).map(() => ({type: faker.helpers.arrayElement(["DRAFT_ISSUE", "ISSUE", "PULL_REQUEST", "REDACTED"]), text: faker.lorem.sentence()})),
+                  progress: {
+                    enabled: false,
+                    todo: NaN,
+                    doing: NaN,
+                    done: NaN,
+                    total: faker.datatype.number(100),
+                  }
+                } : {
+                  progress: {
+                    enabled: true,
+                    todo: faker.datatype.number(50),
+                    doing: faker.datatype.number(50),
+                    done: faker.datatype.number(50),
+                    get total() {
+                      return this.todo + this.doing + this.done
+                    },
+                  }
+                }),
              })),
            },
          })
--- a/source/plugins/projects/index.mjs
+++ b/source/plugins/projects/index.mjs
@@ -15,7 +15,10 @@ export default async function({login, data, imports, graphql, q, queries, accoun

    //Retrieve user owned projects from graphql api
    console.debug(`metrics/compute/${login}/plugins > projects > querying api`)
-    const {[account]: {projects}} = await graphql(queries.projects.user({login, limit, account}))
+    const {[account]: {projects}} = await graphql(queries.projects["user.legacy"]({login, limit, account}))
+    const {[account]: {projectsV2}} = await graphql(queries.projects.user({login, limit, account}))
+    projects.nodes.unshift(...projectsV2.nodes)
+    projects.totalCount += projectsV2.totalCount

    //Retrieve repositories projects from graphql api
    for (const identifier of repositories) {
@@ -24,11 +27,21 @@ export default async function({login, data, imports, graphql, q, queries, accoun
      const {user, repository, id} = identifier.match(/(?<user>[-\w]+)[/](?<repository>[-\w]+)[/]projects[/](?<id>\d+)/)?.groups ?? {}
      let project = null
      for (const account of ["user", "organization"]) {
+        //Try projects beta
        try {
-          ;({project} = (await graphql(queries.projects.repository({user, repository, id, account})))[account].repository)
+          project = (await graphql(queries.projects.repository({user, repository, id, account})))[account].repository.projectV2
+          break
        }
        catch (error) {
+          //Try projects classic
          console.debug(error)
+          try {
+            ;({project} = (await graphql(queries.projects["repository.legacy"]({user, repository, id, account})))[account].repository)
+            break
+          }
+          catch (error) {
+            console.debug(error)
+          }
        }
      }
      if (!project)
@@ -52,9 +65,16 @@ export default async function({login, data, imports, graphql, q, queries, accoun
      else if (time < 30)
        updated = `${Math.floor(time)} day${time >= 2 ? "s" : ""} ago`
      //Format progress
-      const {enabled, todoCount: todo, inProgressCount: doing, doneCount: done} = project.progress
+      const {enabled = false, todoCount: todo = NaN, inProgressCount: doing = NaN, doneCount: done = NaN} = project.progress ?? {}
+      let total = todo + doing + done
+      //Format items (v2)
+      const items = []
+      if (project.items) {
+        items.push(...project.items.nodes.map(({type, fieldValues:{nodes:fields}}) => ({type, text:fields.filter(field => field.text).shift()?.text ?? ""})))
+        total = project.items.totalCount
+      }
      //Append
-      list.push({name: project.name, updated, description: project.body, progress: {enabled, todo, doing, done, total: todo + doing + done}})
+      list.push({name: project.name, updated, description: project.body, progress: {enabled, todo, doing, done, total}, items})
    }

    //Limit
--- a/source/plugins/projects/metadata.yml
+++ b/source/plugins/projects/metadata.yml
@@ -2,8 +2,6 @@ name: 🗂️ GitHub projects
 category: github
 description: |
  This plugin displays progress of profile and repository projects.
-notes: |
-  > ℹ️ This plugin currently only supports [GitHub projects boards](https://docs.github.com/en/issues/organizing-your-work-with-project-boards/managing-project-boards/about-project-boards) and not [GitHub projects (beta)](https://docs.github.com/en/issues/trying-out-the-new-projects-experience/about-projects)
 examples:
  default: https://github.com/lowlighter/metrics/blob/examples/metrics.plugin.projects.svg
 index: 25
@@ -14,6 +12,7 @@ supports:
 scopes:
  - public_access
  - public_repo
+  - read:project
 inputs:

  plugin_projects:
@@ -37,6 +36,8 @@ inputs:
      Featured repositories projects

      Use the following syntax for each project `:user/:repo/projects/:project_id`
+
+      > ℹ️ [GitHub projects (beta)](https://docs.github.com/en/issues/trying-out-the-new-projects-experience/about-projects) needs to use the same syntax as above and repository must specified repository must be linked to given project.
    type: array
    example: username/repo/projects/1, username/repo/projects/2, ...
    format: comma-separated
--- a/source/plugins/projects/queries/repository.graphql
+++ b/source/plugins/projects/queries/repository.graphql
@@ -1,15 +1,23 @@
 query ProjectsRepository {
  $account(login: "$user") {
    repository(name: "$repository") {
-      project(number: $id) {
-        name
-        body
+      projectV2(number: $id) {
+        name: title
+        body: shortDescription
        updatedAt
-        progress {
-          doneCount
-          inProgressCount
-          todoCount
-          enabled
+        items(first: 4, orderBy: {field: POSITION, direction: ASC}) {
+          totalCount
+          nodes {
+            type
+            isArchived
+            fieldValues(last: 100) {
+              nodes {
+                ... on ProjectV2ItemFieldTextValue {
+                  text
+                }
+              }
+            }
+          }
        }
      }
    }
--- a/source/plugins/projects/queries/repository.legacy.graphql
+++ b/source/plugins/projects/queries/repository.legacy.graphql
@@ -0,0 +1,17 @@
+query ProjectsRepositoryLegacy {
+  $account(login: "$user") {
+    repository(name: "$repository") {
+      project(number: $id) {
+        name
+        body
+        updatedAt
+        progress {
+          doneCount
+          inProgressCount
+          todoCount
+          enabled
+        }
+      }
+    }
+  }
+}
--- a/source/plugins/projects/queries/user.graphql
+++ b/source/plugins/projects/queries/user.graphql
@@ -1,16 +1,24 @@
 query ProjectsUser {
  $account(login: "$login") {
-    projects(last: $limit, states: OPEN, orderBy: {field: UPDATED_AT, direction: DESC}) {
+    projectsV2(last: $limit, orderBy: {field: UPDATED_AT, direction: DESC}) {
      totalCount
      nodes {
-        name
-        body
+        name: title
+        body: shortDescription
        updatedAt
-        progress {
-          doneCount
-          inProgressCount
-          todoCount
-          enabled
+        items(first: 4, orderBy: {field: POSITION, direction: ASC}) {
+          totalCount
+          nodes {
+            type
+            isArchived
+            fieldValues(last: 100) {
+              nodes {
+                ... on ProjectV2ItemFieldTextValue {
+                  text
+                }
+              }
+            }
+          }
        }
      }
    }
--- a/source/plugins/projects/queries/user.legacy.graphql
+++ b/source/plugins/projects/queries/user.legacy.graphql
@@ -0,0 +1,18 @@
+query ProjectsUserLegacy {
+  $account(login: "$login") {
+    projects(last: $limit, states: OPEN, orderBy: {field: UPDATED_AT, direction: DESC}) {
+      totalCount
+      nodes {
+        name
+        body
+        updatedAt
+        progress {
+          doneCount
+          inProgressCount
+          todoCount
+          enabled
+        }
+      }
+    }
+  }
+}
--- a/source/templates/classic/partials/projects.ejs
+++ b/source/templates/classic/partials/projects.ejs
@@ -14,7 +14,7 @@
        </section>
      <% } else { %>
        <section class="project">
-          <% for (const {name, updated, progress, description = ""} of plugins.projects.list) { %>
+          <% for (const {name, updated, progress, items = [], description = ""} of plugins.projects.list) { %>
            <div class="row fill-width">
              <section>
                <div class="field">
@@ -60,6 +60,28 @@
                </svg>
              </div>
            <% } %>
+            <% if (items.length) { %>
+              <div class="items">
+              <% for (const {type, text} of items) { %>
+                <div class="row fill-width">
+                  <section>
+                    <div class="field">
+                      <% if (type === "DRAFT_ISSUE") { %>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M6.749.097a8.054 8.054 0 012.502 0 .75.75 0 11-.233 1.482 6.554 6.554 0 00-2.036 0A.75.75 0 016.749.097zM4.345 1.693A.75.75 0 014.18 2.74a6.542 6.542 0 00-1.44 1.44.75.75 0 01-1.212-.883 8.042 8.042 0 011.769-1.77.75.75 0 011.048.166zm7.31 0a.75.75 0 011.048-.165 8.04 8.04 0 011.77 1.769.75.75 0 11-1.214.883 6.542 6.542 0 00-1.439-1.44.75.75 0 01-.165-1.047zM.955 6.125a.75.75 0 01.624.857 6.554 6.554 0 000 2.036.75.75 0 01-1.482.233 8.054 8.054 0 010-2.502.75.75 0 01.858-.624zm14.09 0a.75.75 0 01.858.624 8.057 8.057 0 010 2.502.75.75 0 01-1.482-.233 6.55 6.55 0 000-2.036.75.75 0 01.624-.857zm-13.352 5.53a.75.75 0 011.048.165 6.542 6.542 0 001.439 1.44.75.75 0 01-.883 1.212 8.04 8.04 0 01-1.77-1.769.75.75 0 01.166-1.048zm12.614 0a.75.75 0 01.165 1.048 8.038 8.038 0 01-1.769 1.77.75.75 0 11-.883-1.214 6.543 6.543 0 001.44-1.439.75.75 0 011.047-.165zm-8.182 3.39a.75.75 0 01.857-.624 6.55 6.55 0 002.036 0 .75.75 0 01.233 1.482 8.057 8.057 0 01-2.502 0 .75.75 0 01-.624-.858z"></path></svg>
+                      <% } else if (type === "ISSUE") { %>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path d="M8 9.5a1.5 1.5 0 100-3 1.5 1.5 0 000 3z"></path><path fill-rule="evenodd" d="M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z"></path></svg>
+                      <% } else if (type === "ISSUE") { %>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M7.177 3.073L9.573.677A.25.25 0 0110 .854v4.792a.25.25 0 01-.427.177L7.177 3.427a.25.25 0 010-.354zM3.75 2.5a.75.75 0 100 1.5.75.75 0 000-1.5zm-2.25.75a2.25 2.25 0 113 2.122v5.256a2.251 2.251 0 11-1.5 0V5.372A2.25 2.25 0 011.5 3.25zM11 2.5h-1V4h1a1 1 0 011 1v5.628a2.251 2.251 0 101.5 0V5A2.5 2.5 0 0011 2.5zm1 10.25a.75.75 0 111.5 0 .75.75 0 01-1.5 0zM3.75 12a.75.75 0 100 1.5.75.75 0 000-1.5z"></path></svg>
+                      <% } else { %>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M4 5.75C4 4.784 4.784 4 5.75 4h4.5c.966 0 1.75.784 1.75 1.75v4.5A1.75 1.75 0 0110.25 12h-4.5A1.75 1.75 0 014 10.25v-4.5zm1.75-.25a.25.25 0 00-.25.25v4.5c0 .138.112.25.25.25h4.5a.25.25 0 00.25-.25v-4.5a.25.25 0 00-.25-.25h-4.5z"></path></svg>
+                      <% } %>
+                      <%= text %>
+                    </div>
+                  </section>
+                </div>
+              <% } %>
+              </div>
+            <% } %>
          <% } %>
        </section>
      <% } %>
--- a/source/templates/classic/style.css
+++ b/source/templates/classic/style.css
@@ -918,6 +918,9 @@
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
+  .project .items, .project-items {
+    padding-left: 11px;
+  }

 /* Star lists */
  .starlist {
--- a/source/templates/repository/partials/projects.ejs
+++ b/source/templates/repository/partials/projects.ejs
@@ -14,7 +14,7 @@
        </section>
      <% } else { %>
        <section>
-          <% for (const {name, updated, progress} of plugins.projects.list) { %>
+          <% for (const {name, updated, progress, items = []} of plugins.projects.list) { %>
            <div class="row fill-width">
              <section>
                <div class="field">
@@ -51,6 +51,28 @@
                </svg>
              </div>
            <% } %>
+            <% if (items.length) { %>
+              <div class="project-items">
+              <% for (const {type, text} of items) { %>
+                <div class="row fill-width">
+                  <section>
+                    <div class="field">
+                      <% if (type === "DRAFT_ISSUE") { %>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M6.749.097a8.054 8.054 0 012.502 0 .75.75 0 11-.233 1.482 6.554 6.554 0 00-2.036 0A.75.75 0 016.749.097zM4.345 1.693A.75.75 0 014.18 2.74a6.542 6.542 0 00-1.44 1.44.75.75 0 01-1.212-.883 8.042 8.042 0 011.769-1.77.75.75 0 011.048.166zm7.31 0a.75.75 0 011.048-.165 8.04 8.04 0 011.77 1.769.75.75 0 11-1.214.883 6.542 6.542 0 00-1.439-1.44.75.75 0 01-.165-1.047zM.955 6.125a.75.75 0 01.624.857 6.554 6.554 0 000 2.036.75.75 0 01-1.482.233 8.054 8.054 0 010-2.502.75.75 0 01.858-.624zm14.09 0a.75.75 0 01.858.624 8.057 8.057 0 010 2.502.75.75 0 01-1.482-.233 6.55 6.55 0 000-2.036.75.75 0 01.624-.857zm-13.352 5.53a.75.75 0 011.048.165 6.542 6.542 0 001.439 1.44.75.75 0 01-.883 1.212 8.04 8.04 0 01-1.77-1.769.75.75 0 01.166-1.048zm12.614 0a.75.75 0 01.165 1.048 8.038 8.038 0 01-1.769 1.77.75.75 0 11-.883-1.214 6.543 6.543 0 001.44-1.439.75.75 0 011.047-.165zm-8.182 3.39a.75.75 0 01.857-.624 6.55 6.55 0 002.036 0 .75.75 0 01.233 1.482 8.057 8.057 0 01-2.502 0 .75.75 0 01-.624-.858z"></path></svg>
+                      <% } else if (type === "ISSUE") { %>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path d="M8 9.5a1.5 1.5 0 100-3 1.5 1.5 0 000 3z"></path><path fill-rule="evenodd" d="M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z"></path></svg>
+                      <% } else if (type === "ISSUE") { %>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M7.177 3.073L9.573.677A.25.25 0 0110 .854v4.792a.25.25 0 01-.427.177L7.177 3.427a.25.25 0 010-.354zM3.75 2.5a.75.75 0 100 1.5.75.75 0 000-1.5zm-2.25.75a2.25 2.25 0 113 2.122v5.256a2.251 2.251 0 11-1.5 0V5.372A2.25 2.25 0 011.5 3.25zM11 2.5h-1V4h1a1 1 0 011 1v5.628a2.251 2.251 0 101.5 0V5A2.5 2.5 0 0011 2.5zm1 10.25a.75.75 0 111.5 0 .75.75 0 01-1.5 0zM3.75 12a.75.75 0 100 1.5.75.75 0 000-1.5z"></path></svg>
+                      <% } else { %>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M4 5.75C4 4.784 4.784 4 5.75 4h4.5c.966 0 1.75.784 1.75 1.75v4.5A1.75 1.75 0 0110.25 12h-4.5A1.75 1.75 0 014 10.25v-4.5zm1.75-.25a.25.25 0 00-.25.25v4.5c0 .138.112.25.25.25h4.5a.25.25 0 00.25-.25v-4.5a.25.25 0 00-.25-.25h-4.5z"></path></svg>
+                      <% } %>
+                      <%= text %>
+                    </div>
+                  </section>
+                </div>
+              <% } %>
+              </div>
+            <% } %>
          <% } %>
        </section>
      <% } %>
--- a/tests/mocks/api/github/graphql/projects.repository.legacy.mjs
+++ b/tests/mocks/api/github/graphql/projects.repository.legacy.mjs
@@ -0,0 +1,21 @@
+/**Mocked data */
+export default function({faker, query, login = faker.internet.userName()}) {
+  console.debug("metrics/compute/mocks > mocking graphql api result > projects/repository.legacy")
+  return ({
+    user: {
+      repository: {
+        project: {
+          name: "Repository project example",
+          updatedAt: `${faker.date.recent()}`,
+          body: faker.lorem.paragraph(),
+          progress: {
+            doneCount: faker.datatype.number(10),
+            inProgressCount: faker.datatype.number(10),
+            todoCount: faker.datatype.number(10),
+            enabled: true,
+          },
+        },
+      },
+    },
+  })
+}
--- a/tests/mocks/api/github/graphql/projects.repository.mjs
+++ b/tests/mocks/api/github/graphql/projects.repository.mjs
@@ -4,16 +4,16 @@ export default function({faker, query, login = faker.internet.userName()}) {
  return ({
    user: {
      repository: {
-        project: {
+        projectV2: {
          name: "Repository project example",
          updatedAt: `${faker.date.recent()}`,
          body: faker.lorem.paragraph(),
-          progress: {
-            doneCount: faker.datatype.number(10),
-            inProgressCount: faker.datatype.number(10),
-            todoCount: faker.datatype.number(10),
-            enabled: true,
-          },
+          items: {
+            get totalCount() {
+              return this.nodes.length
+            },
+            nodes: new Array(faker.datatype.number(10)).fill(null).map(() => ({type: faker.helpers.arrayElement(["DRAFT_ISSUE", "ISSUE", "PULL_REQUEST", "REDACTED"]), fieldValues: { nodes: [ { text: faker.lorem.sentence() } ] }}))
+          }
        },
      },
    },
--- a/tests/mocks/api/github/graphql/projects.user.legacy.mjs
+++ b/tests/mocks/api/github/graphql/projects.user.legacy.mjs
@@ -0,0 +1,24 @@
+/**Mocked data */
+export default function({faker, query, login = faker.internet.userName()}) {
+  console.debug("metrics/compute/mocks > mocking graphql api result > projects/user.legacy")
+  return ({
+    user: {
+      projects: {
+        totalCount: 1,
+        nodes: [
+          {
+            name: "User-owned project",
+            updatedAt: `${faker.date.recent()}`,
+            body: faker.lorem.paragraph(),
+            progress: {
+              doneCount: faker.datatype.number(10),
+              inProgressCount: faker.datatype.number(10),
+              todoCount: faker.datatype.number(10),
+              enabled: true,
+            },
+          },
+        ],
+      },
+    },
+  })
+}
--- a/tests/mocks/api/github/graphql/projects.user.mjs
+++ b/tests/mocks/api/github/graphql/projects.user.mjs
@@ -3,19 +3,19 @@ export default function({faker, query, login = faker.internet.userName()}) {
  console.debug("metrics/compute/mocks > mocking graphql api result > projects/user")
  return ({
    user: {
-      projects: {
+      projectsV2: {
        totalCount: 1,
        nodes: [
          {
            name: "User-owned project",
            updatedAt: `${faker.date.recent()}`,
            body: faker.lorem.paragraph(),
-            progress: {
-              doneCount: faker.datatype.number(10),
-              inProgressCount: faker.datatype.number(10),
-              todoCount: faker.datatype.number(10),
-              enabled: true,
-            },
+            items: {
+              get totalCount() {
+                return this.nodes.length
+              },
+              nodes: new Array(faker.datatype.number(10)).fill(null).map(() => ({type: faker.helpers.arrayElement(["DRAFT_ISSUE", "ISSUE", "PULL_REQUEST", "REDACTED"]), fieldValues: { nodes: [ { text: faker.lorem.sentence() } ] }}))
+            }
          },
        ],
      },