From 46d76013e8f77e350cb9f82f87ac140a33a2eccc Mon Sep 17 00:00:00 2001
From: Trent Larson <trent@trentlarson.com>
Date: Sat, 18 Nov 2023 14:49:38 -0700
Subject: [PATCH] make a back button at the top and the tabs at the bottom of
 each page

---
 project.task.yaml               |  3 ---
 src/views/HelpView.vue          |  3 ++-
 src/views/NewIdentifierView.vue | 24 +++++++++++++++++++-----
 src/views/SearchAreaView.vue    |  4 ++++
 src/views/StartView.vue         | 21 +++++++++++++++++----
 src/views/StatisticsView.vue    | 26 ++++++++++++++++++++------
 src/views/TestView.vue          | 24 +++++++++++++++++++-----
 7 files changed, 81 insertions(+), 24 deletions(-)

diff --git a/project.task.yaml b/project.task.yaml
index 8f30da6..e191f34 100644
--- a/project.task.yaml
+++ b/project.task.yaml
@@ -5,12 +5,9 @@ tasks:
 - 40 notifications :
   - push, where we trigger a ServiceWorker(?) in the app to reach out and check for new data assignee:matthew
 
-- .5 if there is no area search selected, make "anywhere" search the default
 - .5 allow to manage their notifications even without an identity
-- .1 put a "back" button at the top of the start page
 - .5 bug - on the discover page, enter a search term and search and see a duplicate project show at the end of the list
 - 01 Ensure each action sent to the server has a confirmation - eg registration (ie a toast something that dismisses after 5-10s)
-- 01 Make a new contact able to see me by default.
 
 - Home Feed & Quick Give screen :
   - 01 save the feed-viewed status in settings storage ("afterQuery")
diff --git a/src/views/HelpView.vue b/src/views/HelpView.vue
index ee38093..cb11292 100644
--- a/src/views/HelpView.vue
+++ b/src/views/HelpView.vue
@@ -1,5 +1,6 @@
 <template>
-  <QuickNav selected="Profile"></QuickNav>
+  <QuickNav />
+
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24">
     <!-- Breadcrumb -->
diff --git a/src/views/NewIdentifierView.vue b/src/views/NewIdentifierView.vue
index 0c3875d..a758be7 100644
--- a/src/views/NewIdentifierView.vue
+++ b/src/views/NewIdentifierView.vue
@@ -1,11 +1,25 @@
 <template>
-  <QuickNav selected="Profile"></QuickNav>
+  <QuickNav />
+
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24">
-    <!-- Heading -->
-    <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
-      Your Identity
-    </h1>
+    <!-- Breadcrumb -->
+    <div class="mb-8">
+      <!-- Back -->
+      <div class="text-lg text-center font-light relative px-7">
+        <h1
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+          @click="$router.back()"
+        >
+          <fa icon="chevron-left" class="fa-fw"></fa>
+        </h1>
+      </div>
+
+      <!-- Heading -->
+      <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
+        Your Identity
+      </h1>
+    </div>
 
     <div class="flex justify-center py-12">
       <span />
diff --git a/src/views/SearchAreaView.vue b/src/views/SearchAreaView.vue
index a536fe3..746574b 100644
--- a/src/views/SearchAreaView.vue
+++ b/src/views/SearchAreaView.vue
@@ -1,4 +1,6 @@
 <template>
+  <QuickNav />
+
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24">
     <!-- Breadcrumb -->
@@ -105,6 +107,7 @@ import {
 
 import { db } from "@/db/index";
 import { BoundingBox, MASTER_SETTINGS_KEY } from "@/db/tables/settings";
+import QuickNav from "@/components/QuickNav.vue";
 
 const DEFAULT_LAT_LONG_DIFF = 0.01;
 const WORLD_ZOOM = 2;
@@ -119,6 +122,7 @@ interface Notification {
 
 @Component({
   components: {
+    QuickNav,
     LRectangle,
     LMap,
     LMarker,
diff --git a/src/views/StartView.vue b/src/views/StartView.vue
index 84fb293..e772f11 100644
--- a/src/views/StartView.vue
+++ b/src/views/StartView.vue
@@ -3,10 +3,23 @@
     id="Content"
     class="p-6 pb-24 min-h-screen flex flex-col justify-center"
   >
-    <!-- Heading -->
-    <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
-      Start Here
-    </h1>
+    <!-- Breadcrumb -->
+    <div class="mb-8">
+      <!-- Back -->
+      <div class="text-lg text-center font-light relative px-7">
+        <h1
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+          @click="$router.back()"
+        >
+          <fa icon="chevron-left" class="fa-fw"></fa>
+        </h1>
+      </div>
+
+      <!-- Heading -->
+      <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
+        Start Here
+      </h1>
+    </div>
 
     <!-- id used by puppeteer test script -->
     <div id="start-question" class="mt-8">
diff --git a/src/views/StatisticsView.vue b/src/views/StatisticsView.vue
index 8cd258d..01d8c32 100644
--- a/src/views/StatisticsView.vue
+++ b/src/views/StatisticsView.vue
@@ -1,11 +1,25 @@
 <template>
-  <QuickNav selected="Profile"></QuickNav>
+  <QuickNav />
+
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24">
-    <!-- Heading -->
-    <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
-      Achievements & Statistics
-    </h1>
+    <!-- Breadcrumb -->
+    <div class="mb-8">
+      <!-- Back -->
+      <div class="text-lg text-center font-light relative px-7">
+        <h1
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+          @click="$router.back()"
+        >
+          <fa icon="chevron-left" class="fa-fw"></fa>
+        </h1>
+      </div>
+
+      <!-- Heading -->
+      <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
+        Achievements & Statistics
+      </h1>
+    </div>
 
     <div>
       Here is a view of the activity you can see.
@@ -32,7 +46,7 @@
         {{ worldProperties.animationDurationSeconds }} seconds
       </div>
     </div>
-    <button class="float-right" @click="captureGraphics()">Screenshot</button>
+    <button class="float-right text-blue-600" @click="captureGraphics()">Screenshot</button>
     <div id="scene-container" class="h-screen"></div>
   </section>
 </template>
diff --git a/src/views/TestView.vue b/src/views/TestView.vue
index d6bc860..1e0a7f8 100644
--- a/src/views/TestView.vue
+++ b/src/views/TestView.vue
@@ -1,11 +1,25 @@
 <template>
-  <QuickNav selected="Profile"></QuickNav>
+  <QuickNav />
+
   <!-- CONTENT -->
   <section id="Content" class="p-6 pb-24">
-    <!-- Heading -->
-    <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
-      Test
-    </h1>
+    <!-- Breadcrumb -->
+    <div class="mb-8">
+      <!-- Back -->
+      <div class="text-lg text-center font-light relative px-7">
+        <h1
+          class="text-lg text-center px-2 py-1 absolute -left-2 -top-1"
+          @click="$router.back()"
+        >
+          <fa icon="chevron-left" class="fa-fw"></fa>
+        </h1>
+      </div>
+
+      <!-- Heading -->
+      <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
+        Test
+      </h1>
+    </div>
 
     <div class="mb-8">
       <h2 class="text-xl font-bold mb-4">Notiwind Alert Test Suite</h2>