diff --git a/src/content/outlook.js b/src/content/outlook.js index 5f0ec6b3e..acaf5dbcc 100644 --- a/src/content/outlook.js +++ b/src/content/outlook.js @@ -3,7 +3,7 @@ * @urlAlias outlook.office.com * @urlRegex *://outlook.office.com/* */ - + "use strict"; // Inbox emails @@ -16,10 +16,14 @@ togglbutton.render( 'div[role="tabpanel"] div[role="group"]' )[1]; + // If the container is not found or the button is already there, do nothing + if (!container || container.querySelector('.toggl-button')) { + return; + } + const link = togglbutton.createTimerLink({ - className: `outlook`, - description: () => - document.querySelector('div[role="heading"][title]').textContent + className: "outlook-panel", + description: getOpenedEmailSubject, }); container.appendChild(link); @@ -29,21 +33,37 @@ togglbutton.render( // Composing emails togglbutton.render( - '[role="menubar"] .ms-CommandBar-primaryCommand:not(.toggl)', + '#ReadingPaneContainerId div[data-testid="ComposeSendButton"]:not(.toggl)', { observe: true }, (elem) => { - const isComposingEmail = document.querySelector('div[data-testid="ComposeSendButton"]'); + const composeSendButton = $('div[data-testid="ComposeSendButton"]'); - if (isComposingEmail) { - const subject = () => - document.querySelector('input.ms-TextField-field').value; + if (!composeSendButton) { + return; + } - const link = togglbutton.createTimerLink({ - className: "outlook", - description: subject, - }); + function getDescription() { + // If making a reply, the subject is already filled + const emailSubject = getOpenedEmailSubject(); + if (emailSubject) { + return emailSubject; + } - elem.appendChild(link); + // If composing a new email or making a forward + return document.querySelector('input.ms-TextField-field').value; } + + const link = togglbutton.createTimerLink({ + className: "outlook", + description: getDescription, + }); + + composeSendButton.after(link); } ); + +function getOpenedEmailSubject() { + const emailSubjectElement = document.querySelector('div[role="heading"][title]'); + + return emailSubjectElement ? emailSubjectElement.textContent.trim() : ''; +} diff --git a/src/styles/style.css b/src/styles/style.css index 62f26e4ed..3391a7aca 100644 --- a/src/styles/style.css +++ b/src/styles/style.css @@ -1293,16 +1293,17 @@ li .toggl-button.heflo { } /********* OUTLOOK *********/ -.toggl-button.outlook { - margin-left: 10px; - color: rgb(102, 102, 102); +.toggl-button.outlook-panel { + margin: 0 5px; text-decoration: none; - position: relative; - bottom: 3px; + display: flex !important; + justify-content: center; + align-items: center; + height: 100%; } -.ms-CommandBar-primaryCommand .toggl-button.outlook { - align-self: center; +.toggl-button.outlook { + margin: 0 10px; } /********* NOTION *********/