diff --git a/src/content/linear.js b/src/content/linear.js index 04caddf76..424a68961 100644 --- a/src/content/linear.js +++ b/src/content/linear.js @@ -1,50 +1,66 @@ -'use strict'; /** * @name Linear * @urlAlias linear.app * @urlRegex *://linear.app/* */ +'use strict' + // Add linear integration in table view only togglbutton.render( 'a[data-dnd-dragging]:not(.toggl)', { observe: true }, function (elem) { - const idElem = elem.querySelector('span[data-column-id="issueId"]'); - const id = idElem ? idElem.textContent : ''; - const titleElem = idElem.parentElement.nextSibling; - const title = titleElem ? titleElem.textContent : ''; + const idElem = elem.querySelector('span[data-column-id="issueId"]') + const id = idElem ? idElem.textContent : '' + const titleElem = idElem.parentElement.nextSibling + const title = titleElem ? titleElem.textContent : '' const link = togglbutton.createTimerLink({ description: title, className: 'linear-table', buttonType: 'minimal', // button type, if skipped will render full size - }); - const existingTogglButton = elem.querySelector('.toggl-button'); + }) + const existingTogglButton = elem.querySelector('.toggl-button') if (existingTogglButton) { // we need to remove any existing toggl buttons - existingTogglButton.replaceChildren(link); + existingTogglButton.replaceChildren(link) - return; + return } - titleElem.parentElement.insertBefore(link, titleElem.nextSibling); - } -); - + titleElem.parentElement.insertBefore(link, titleElem.nextSibling) + }, +) // Add linear integration in board view only togglbutton.render( 'a[data-board-item]:not(.toggl)', { observe: true }, function (elem) { - const id = elem.querySelector('div:first-child>div:first-child>div:first-child>span:first-child')?.textContent?.split('›')[0]; - const title = elem.querySelector('div:first-child>div:first-child>div:first-child>span:first-child+div')?.textContent; + // Get the first contextual menu which contains ID and title + const mainContainer = elem.querySelector('div[data-contextual-menu="true"]') + + // ID is in the first span, title is in the next sibling container's span + const id = mainContainer?.querySelector('span > span')?.textContent + const title = mainContainer + ?.querySelector('div > span:last-child') + ?.textContent?.trim() - // Project selection only works if an existing Toggl project matches the name of the project from the linear card - const project = elem.querySelector(':scope>div:first-child>div:nth-child(2)>div:not(:first-child):not([role="button"])>span:only-child>div:only-child[role="button"]>div+span[type="micro"]')?.textContent; + // Find project by looking for the span after the Project svg icon + const project = elem + .querySelector('svg[aria-label="Project"]') + ?.closest('div') + ?.nextElementSibling?.textContent?.trim() - // Gets the labels on the card as a string array. - const labels = [...elem.querySelectorAll(':scope>div:first-child>div:nth-child(2)>div:not([role="button"])>div[role="button"]')].map((n)=>n.textContent) + // Get labels from elements that have a color indicator div + const labels = [...elem.querySelectorAll('.sc-gHYhXS')] // Elements with color indicators + .map((colorDiv) => + colorDiv + .closest('div[data-contextual-menu="true"]') + ?.querySelector('span:last-child') + ?.textContent?.trim(), + ) + .filter(Boolean) const link = togglbutton.createTimerLink({ description: title, @@ -52,11 +68,13 @@ togglbutton.render( projectName: project, // For some reason, tag selection isn't working even if the like-named tags have already been created in Toggl tags: [id, ...labels], - }); - elem.style.position = 'relative'; - link.style.bottom = '13px'; - link.style.right = '13px'; - link.style.position = 'absolute'; - elem.appendChild(link); - } -); + }) + + elem.style.position = 'relative' + link.style.bottom = '13px' + link.style.right = '13px' + link.style.position = 'absolute' + + elem.appendChild(link) + }, +)