[IMP] devtools: Add a button to navigate to the doc

This commit adds a button to the devtools navbar which links
to the documentation.

tools/devtools/src/background.js

@@ -77,6 +77,15 @@ browserInstance.runtime.onMessage.addListener(async (message, sender, sendRespon
     setOwlStatus(message.data);
     // Dummy message to test if the extension context is still valid
   } else if (message.type === "keepAlive") {
+    return;
+    // Open the devtools documentation in a new tab
+  } else if (message.type === "openDoc") {
+    browserInstance.tabs.create(
+      { url: "https://github.com/odoo/owl/blob/master/doc/tools/devtools_guide.md", active: false },
+      function (tab) {
+        browserInstance.tabs.update(tab.id, { active: true });
+      }
+    );
     return;
     // Relay the received message to the devtools app
   } else if (message.type === "newDevtoolsPanel") {

tools/devtools/src/devtools_app/devtools_window/devtools_window.xml

@@ -16,7 +16,8 @@
               <option t-att-value="frame"><t t-esc="frame"/></option>
             </t>
           </select>
-          <i class="ms-auto p-1 me-1 lg-icon fa pointer-icon" title="Toggle dark mode" t-att-class="{ 'fa-sun-o': store.settings.darkMode, 'fa-moon-o' : !store.settings.darkMode}" t-on-click.stop="() => this.store.toggleDarkMode()"></i>
+          <i class="ms-auto p-1 me-1 lg-icon fa fa-question-circle pointer-icon" title="Open devtools doc" t-on-click.stop="() => this.store.openDocumentation()"></i>
+          <i class="p-1 me-1 lg-icon fa pointer-icon" title="Toggle dark mode" t-att-class="{ 'fa-sun-o': store.settings.darkMode, 'fa-moon-o' : !store.settings.darkMode}" t-on-click.stop="() => this.store.toggleDarkMode()"></i>
           <i class="p-1 me-1 lg-icon fa fa-repeat pointer-icon" title="Refresh extension" t-on-click.stop="() => this.store.refreshExtension()"></i>
         </div>
         <ComponentsTab t-if="store.page === 'ComponentsTab'"/>

tools/devtools/src/devtools_app/store/store.js

@@ -618,6 +618,10 @@ export const store = reactive({
     }
     browserInstance.storage.local.set({ owl_devtools_dark_mode: this.settings.darkMode });
   },
+
+  openDocumentation() {
+    browserInstance.runtime.sendMessage({ type: "openDoc" });
+  },
 });
 
 // Instantiate the store