feat: add timed docs to top nav

frontend/app/components/topnav.hbs

@@ -88,6 +88,17 @@
       </Topnav::List>
       <Topnav::List class="md:ml-auto md:border-t-0">
         <ReportReviewWarning @class="max-md:hidden" />
+        <Topnav::ListItem>
+          <Topnav::LinkTo
+            @onClick={{fn (mut this.expand) false}}
+            title="Open Timed documentation for current page"
+            href={{this.docs.endpoint}}
+            target="_blank"
+            data-test-docs-link
+          >
+            <FaIcon @icon="circle-question" @prefix="fa" />
+          </Topnav::LinkTo>
+        </Topnav::ListItem>
         <Topnav::ListItem>
           <Topnav::LinkTo
             @onClick={{fn (mut this.expand) false}}

frontend/app/components/topnav.js

@@ -7,6 +7,8 @@ export default class Topnav extends Component {
 
   @service media;
 
+  @service docs;
+
   @tracked expand = false;
 
   get navMobile() {

frontend/app/services/docs.js

@@ -0,0 +1,26 @@
+import Service, { service } from "@ember/service";
+
+import config from "timed/config/environment";
+
+export const ROUTE_DOCS_MAPPING = {
+  "index.attendances": "/tracking/attendances",
+  "index.reports": "/tracking/timesheet",
+  "analysis.index": "/analysis",
+  statistics: "/statistics",
+  projects: "/projects",
+  "users.index": "/users",
+  "users.edit.index": "/users",
+  "index.activities.index": "/tracking/activities",
+};
+
+export default class DocsService extends Service {
+  @service router;
+
+  get endpoint() {
+    return config.docsBaseUrl + this.docsURL;
+  }
+
+  get docsURL() {
+    return ROUTE_DOCS_MAPPING[this.router.currentRouteName] ?? "";
+  }
+}

frontend/app/tours/index/reports.js

@@ -65,4 +65,15 @@ export default [
     </p>
     `,
   },
+  {
+    id: "Docs",
+    target: "[data-test-docs-link]",
+    placement: "bottom",
+    title: "Timed Documentation",
+    content: `
+    <p>
+      You can access the Timed documentation with this link, which will redirect you to the corresponding page.
+    </p>
+    `,
+  },
 ];

frontend/config/environment.js

@@ -60,6 +60,7 @@ module.exports = function (environment) {
       userinfoEndpoint: "/userinfo",
       afterLogoutUri: "/sso-login",
     },
+    docsBaseUrl: process.env.DOCS_BASE_URL || "https://timed.dev/docs",
   };
 
   if (process.env.SENTRY_DSN) {

frontend/config/icons.js

@@ -49,6 +49,7 @@ module.exports = function () {
       "users",
       "question",
       "magic",
+      "circle-question",
     ],
   };
 };

frontend/tests/acceptance/docs-test.js

@@ -0,0 +1,36 @@
+import { visit } from "@ember/test-helpers";
+import { setupMirage } from "ember-cli-mirage/test-support";
+import { setupApplicationTest } from "ember-qunit";
+import { authenticateSession } from "ember-simple-auth/test-support";
+import { module, test } from "qunit";
+
+import config from "timed/config/environment";
+import { ROUTE_DOCS_MAPPING } from "timed/services/docs";
+
+module("Acceptance | docs", function (hooks) {
+  setupApplicationTest(hooks);
+  setupMirage(hooks);
+
+  hooks.beforeEach(async function () {
+    const user = this.server.create("user", { tourDone: true });
+
+    await authenticateSession({ user_id: user.id });
+  });
+
+  test("Each route renders a link to the corresponding documentation page", async function (assert) {
+    const routesKey = Object.keys(ROUTE_DOCS_MAPPING);
+    const router = this.owner.lookup("service:router");
+
+    for (const routeKey of routesKey) {
+      if (routeKey === "users.edit.index") continue;
+      // eslint-disable-next-line no-await-in-loop
+      await visit(router.urlFor(routeKey));
+      assert.dom("[data-test-docs-link]").exists();
+
+      assert.strictEqual(
+        document.querySelector("[data-test-docs-link]").href,
+        `${config.docsBaseUrl}${ROUTE_DOCS_MAPPING[routeKey]}`,
+      );
+    }
+  });
+});

frontend/tests/acceptance/external-employee-test.js

@@ -50,7 +50,7 @@ module("Acceptance | external employee", function (hooks) {
   test("can only view tracking in top navigation", async function (assert) {
     await visit("/");
 
-    assert.dom("section > ul > li").exists({ count: 3 });
+    assert.dom("section > ul > li").exists({ count: 4 });
     assert.dom("section > ul > li").includesText("Tracking");
   });