feat(QuickTrackNav): add settings link

benji6 · Nov 11, 2024 · b0ee6a4 · b0ee6a4
1 parent 8eb8693
commit b0ee6a4
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 2 deletions.
diff --git a/client/src/components/pages/Home/QuickTrackNav/index.tsx b/client/src/components/pages/Home/QuickTrackNav/index.tsx
@@ -3,7 +3,7 @@ import { Button, Icon, Paper } from "eri";
 import { QuickTrackNavButton } from "./QuickTrackNavButton";
 import { TEST_IDS } from "../../../../constants";
 import appSlice from "../../../../store/appSlice";
-import { useNavigate } from "react-router-dom";
+import { Link, useNavigate } from "react-router-dom";
 import { useSelector } from "react-redux";
 
 export function QuickTrackNav() {
@@ -12,7 +12,14 @@ export function QuickTrackNav() {
 
   return (
     <Paper data-test-id={TEST_IDS.moodList}>
-      <h2>Home</h2>
+      <h2 className="quick-track-nav__heading">
+        Home
+        <div className="quick-track-nav__settings-icon">
+          <Link to="/settings/events">
+            <Icon name="settings" />
+          </Link>
+        </div>
+      </h2>
       <div className="quick-track-nav__links">
         {(["moods", "sleeps", "weights"] as const)
           .filter((eventType) => eventTypeTracking[eventType])

diff --git a/client/src/components/pages/Home/QuickTrackNav/style.css b/client/src/components/pages/Home/QuickTrackNav/style.css
@@ -1,6 +1,15 @@
+.quick-track-nav__heading {
+  display: flex;
+  justify-content: space-between;
+}
+
 .quick-track-nav__links {
   display: grid;
   gap: var(--space-2);
   grid-template-columns: repeat(auto-fit, minmax(10em, 1fr));
   justify-content: center;
 }
+
+.quick-track-nav__settings-icon {
+  font-size: var(--font-size-1);
+}