fix/asana-refactor (#14)

* Add packages eslint-plugin-prettier and eslint-config-prettier

These packages add better code formatting support in VS Code

* Fix code styles

* Update projectId query selector for asana service

* Extract constants to own computed getter methods

* Update changelog, bump version

.eslintrc.json

@@ -1,5 +1,5 @@
 {
-  "extends": ["eslint:recommended", "plugin:react/recommended"],
+  "extends": ["eslint:recommended", "plugin:react/recommended", "plugin:prettier/recommended"],
   "env": {
     "browser": true,
     "commonjs": true,
@@ -68,6 +68,7 @@
           "userStore"
         ]
       }
-    ]
+    ],
+    "prettier/prettier": "error"
   }
 }

CHANGELOG.md

@@ -52,3 +52,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Changed
 - Read project identifier also from card title in the meistertask service
+
+## [1.1.3] - 2019-04-10
+### Fixed
+- Read projected identifier in Asana's "My tasks"-view

package.json

@@ -1,7 +1,7 @@
 {
   "name": "moco-browser-extensions",
   "description": "Browser plugin for MOCO",
-  "version": "1.1.2",
+  "version": "1.1.3",
   "license": "MIT",
   "scripts": {
     "start": "yarn start:chrome",
@@ -49,7 +49,9 @@
     "copyfiles": "^2.1.0",
     "css-loader": "^2.1.0",
     "eslint": "^5.7.0",
+    "eslint-config-prettier": "^4.1.0",
     "eslint-plugin-jest": "^22.2.2",
+    "eslint-plugin-prettier": "^3.0.1",
     "eslint-plugin-react": "^7.11.1",
     "file-loader": "^3.0.1",
     "html-webpack-plugin": "^3.2.0",

src/js/components/App.js

@@ -59,31 +59,39 @@ class App extends Component {
   @observable changeset = {}
   @observable formErrors = {}
 
-  @computed get changesetWithDefaults() {
+  @computed get project() {
-    const { service, projects, lastProjectId, lastTaskId } = this.props
+    const { service, projects, lastProjectId } = this.props
-
+    return (
-    // TODO: extract project, task and billable to own methods
-
-    const project =
       findProjectByValue(this.changeset.assignment_id)(projects) ||
       findProjectByIdentifier(service?.projectId)(projects) ||
       findProjectByValue(Number(lastProjectId))(projects) ||
       head(projects)
+    )
+  }
 
-    const task =
+  @computed get task() {
-      findTask(this.changeset.task_id || service?.taskId || lastTaskId)(project) ||
+    const { service, lastTaskId } = this.props
-      head(project?.tasks)
+    return (
+      findTask(this.changeset.task_id || service?.taskId || lastTaskId)(this.project) ||
+      head(this.project?.tasks)
+    )
+  }
 
-    const billable = /\(.+\)/.test(this.changeset.hours) === true ? false : !!task?.billable
+  @computed get billable() {
+    return /\(.+\)/.test(this.changeset.hours) === true ? false : !!this.task?.billable
+  }
+
+  @computed get changesetWithDefaults() {
+    const { service } = this.props
 
     const defaults = {
       remote_service: service?.name,
       remote_id: service?.id,
       remote_url: service?.url,
       date: formatDate(new Date()),
-      assignment_id: project?.value,
+      assignment_id: this.project?.value,
-      task_id: task?.value,
+      task_id: this.task?.value,
-      billable,
+      billable: this.billable,
       hours: "",
       seconds: this.changeset.hours && new TimeInputParser(this.changeset.hours).parseSeconds(),
       description: service?.description,

src/js/remoteServices.js

@@ -5,33 +5,25 @@ export default {
     name: "asana",
     urlPatterns: [
       [/^https:\/\/app.asana.com\/0\/([^/]+)\/(\d+)/, ["domainUserId", "id"]],
-      [
+      [/^https:\/\/app.asana.com\/0\/search\/([^/]+)\/(\d+)/, ["domainUserId", "id"]],
-        /^https:\/\/app.asana.com\/0\/search\/([^/]+)\/(\d+)/,
-        ["domainUserId", "id"]
-      ]
     ],
     description: document =>
-      document
+      document.querySelector(".ItemRow--highlighted textarea")?.textContent?.trim() ||
-        .querySelector(".ItemRow--highlighted textarea")
+      document.querySelector(".ItemRow--focused textarea")?.textContent?.trim() ||
-        ?.textContent?.trim() ||
-      document
-        .querySelector(".ItemRow--focused textarea")
-        ?.textContent?.trim() ||
       document.querySelector(".SingleTaskPane textarea")?.textContent?.trim(),
     projectId: document => {
       const match = document
-        .querySelector(".ProjectPageHeader-projectName")
+        .querySelector(".TaskProjectPill-projectName")
         ?.textContent?.trim()
         ?.match(projectRegex)
       return match && match[1]
-    }
+    },
   },
 
   "github-pr": {
     name: "github",
     urlPatterns: ["https\\://github.com/:org/:repo/pull/:id(/:tab)"],
-    id: (document, service, { org, repo, id }) =>
+    id: (document, service, { org, repo, id }) => [service.key, org, repo, id].join("."),
-      [service.key, org, repo, id].join("."),
     description: (document, service, { org, repo, id }) =>
       document.querySelector(".js-issue-title")?.textContent?.trim(),
     projectId: document => {
@@ -40,16 +32,15 @@ export default {
         ?.textContent.trim()
         ?.match(projectRegex)
       return match && match[1]
-    }
+    },
   },
 
   "github-issue": {
     name: "github",
     urlPatterns: ["https\\://github.com/:org/:repo/issues/:id"],
-    id: (document, service, { org, repo, id }) =>
+    id: (document, service, { org, repo, id }) => [service.key, org, repo, id].join("."),
-      [service.key, org, repo, id].join("."),
     description: (document, service, { org, repo, id }) =>
-      document.querySelector(".js-issue-title")?.textContent?.trim()
+      document.querySelector(".js-issue-title")?.textContent?.trim(),
   },
 
   jira: {
@@ -58,11 +49,11 @@ export default {
       "https\\://:org.atlassian.net/secure/RapidBoard.jspa",
       "https\\://:org.atlassian.net/browse/:id",
       "https\\://:org.atlassian.net/jira/software/projects/:projectId/boards/:board",
-      "https\\://:org.atlassian.net/jira/software/projects/:projectId/boards/:board/backlog"
+      "https\\://:org.atlassian.net/jira/software/projects/:projectId/boards/:board/backlog",
     ],
     queryParams: {
       id: "selectedIssue",
-      projectId: "projectKey"
+      projectId: "projectKey",
     },
     description: (document, service, { id }) => {
       const title =
@@ -70,45 +61,38 @@ export default {
           .querySelector('[aria-label="Edit Summary"]')
           ?.parentNode?.querySelector("h1")
           ?.textContent?.trim() ||
-        document
+        document.querySelector(".ghx-selected .ghx-summary")?.textContent?.trim()
-          .querySelector(".ghx-selected .ghx-summary")
-          ?.textContent?.trim()
       return `#${id} ${title || ""}`
-    }
+    },
   },
 
   meistertask: {
     name: "meistertask",
     urlPatterns: ["https\\://www.meistertask.com/app/task/:id/:slug"],
     description: document => {
-      const json =
+      const json = document.getElementById("mt-toggl-data")?.dataset?.togglJson || "{}"
-        document.getElementById("mt-toggl-data")?.dataset?.togglJson || "{}"
       const data = JSON.parse(json)
       return data.taskName
     },
     projectId: document => {
-      const json =
+      const json = document.getElementById("mt-toggl-data")?.dataset?.togglJson || "{}"
-        document.getElementById("mt-toggl-data")?.dataset?.togglJson || "{}"
       const data = JSON.parse(json)
-      const match =
+      const match = data.taskName?.match(projectRegex) || data.projectName?.match(projectRegex)
-        data.taskName?.match(projectRegex) ||
-        data.projectName?.match(projectRegex)
       return match && match[1]
-    }
+    },
   },
 
   trello: {
     name: "trello",
     urlPatterns: ["https\\://trello.com/c/:id/:title"],
     description: (document, service, { title }) =>
-      document.querySelector(".js-title-helper")?.textContent?.trim() || title
+      document.querySelector(".js-title-helper")?.textContent?.trim() || title,
   },
 
   youtrack: {
     name: "youtrack",
     urlPatterns: ["https\\://:org.myjetbrains.com/youtrack/issue/:id"],
-    description: document =>
+    description: document => document.querySelector("yt-issue-body h1")?.textContent?.trim(),
-      document.querySelector("yt-issue-body h1")?.textContent?.trim()
   },
 
   wunderlist: {
@@ -117,6 +101,6 @@ export default {
     description: document =>
       document
         .querySelector(".taskItem.selected .taskItem-titleWrapper-title")
-        ?.textContent?.trim()
+        ?.textContent?.trim(),
-  }
+  },
 }

yarn.lock

@@ -2589,11 +2589,25 @@ escodegen@^1.9.1:
   optionalDependencies:
     source-map "~0.6.1"
 
+eslint-config-prettier@^4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-4.1.0.tgz#181364895899fff9fd3605fecb5c4f20e7d5f395"
+  integrity sha512-zILwX9/Ocz4SV2vX7ox85AsrAgXV3f2o2gpIicdMIOra48WYqgUnWNH/cR/iHtmD2Vb3dLSC3LiEJnS05Gkw7w==
+  dependencies:
+    get-stdin "^6.0.0"
+
 eslint-plugin-jest@^22.2.2:
   version "22.2.2"
   resolved "https://registry.yarnpkg.com/eslint-plugin-jest/-/eslint-plugin-jest-22.2.2.tgz#2a80d70a20c27dfb1503a6f32cdcb647fe5476df"
   integrity sha512-hnWgh9o39VJfz6lJEyQJdTW7dN2yynlGkmPOlU/oMHh+d7WVMsJP1GeDTB520VCDljEdKExCwD5IBpQIUl4mJg==
 
+eslint-plugin-prettier@^3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-prettier/-/eslint-plugin-prettier-3.0.1.tgz#19d521e3981f69dd6d14f64aec8c6a6ac6eb0b0d"
+  integrity sha512-/PMttrarPAY78PLvV3xfWibMOdMDl57hmlQ2XqFeA37wd+CJ7WSxV7txqjVPHi/AAFKd2lX0ZqfsOc/i5yFCSQ==
+  dependencies:
+    prettier-linter-helpers "^1.0.0"
+
 eslint-plugin-react@^7.11.1:
   version "7.12.4"
   resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.12.4.tgz#b1ecf26479d61aee650da612e425c53a99f48c8c"
@@ -2863,6 +2877,11 @@ fast-deep-equal@^2.0.1:
   resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-2.0.1.tgz#7b05218ddf9667bf7f370bf7fdb2cb15fdd0aa49"
   integrity sha1-ewUhjd+WZ79/Nwv3/bLLFf3Qqkk=
 
+fast-diff@^1.1.2:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/fast-diff/-/fast-diff-1.2.0.tgz#73ee11982d86caaf7959828d519cfe927fac5f03"
+  integrity sha512-xJuoT5+L99XlZ8twedaRf6Ax2TgQVxvgZOYoPKqZufmJib0tL2tegPBOZb1pVNgIhlqDlA0eO0c3wBvQcmzx4w==
+
 fast-json-parse@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/fast-json-parse/-/fast-json-parse-1.0.3.tgz#43e5c61ee4efa9265633046b770fb682a7577c4d"
@@ -3174,6 +3193,11 @@ get-stdin@^4.0.1:
   resolved "https://registry.yarnpkg.com/get-stdin/-/get-stdin-4.0.1.tgz#b968c6b0a04384324902e8bf1a5df32579a450fe"
   integrity sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4=
 
+get-stdin@^6.0.0:
+  version "6.0.0"
+  resolved "https://registry.yarnpkg.com/get-stdin/-/get-stdin-6.0.0.tgz#9e09bf712b360ab9225e812048f71fde9c89657b"
+  integrity sha512-jp4tHawyV7+fkkSKyvjuLZswblUtz+SQKzSWnBbii16BuZksJlU1wuBYXY75r+duh/llF1ur6oNwi+2ZzjKZ7g==
+
 get-stream@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-3.0.0.tgz#8e943d1358dc37555054ecbe2edb05aa174ede14"
@@ -5770,6 +5794,13 @@ prelude-ls@~1.1.2:
   resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.1.2.tgz#21932a549f5e52ffd9a827f570e04be62a97da54"
   integrity sha1-IZMqVJ9eUv/ZqCf1cOBL5iqX2lQ=
 
+prettier-linter-helpers@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/prettier-linter-helpers/-/prettier-linter-helpers-1.0.0.tgz#d23d41fe1375646de2d0104d3454a3008802cf7b"
+  integrity sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w==
+  dependencies:
+    fast-diff "^1.1.2"
+
 prettier@^1.16.4:
   version "1.16.4"
   resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.16.4.tgz#73e37e73e018ad2db9c76742e2647e21790c9717"