From 58afd4c3d30f3cb99bac823140c780ad9ad4894d Mon Sep 17 00:00:00 2001
From: Luna Morris <127158867+lunamoonmoon@users.noreply.github.com>
Date: Tue, 19 Nov 2024 10:19:43 -0800
Subject: [PATCH] feat(frontend): #173 Blank Page Setup for X-Tool (#177)

Co-authored-by: raarielgrace <raarielgrace@gmail.com>
Co-authored-by: Fergus MacConnell <f.macconnell@gmail.com>
---
 frontend/src/common/components/Header.vue     |  1 +
 frontend/src/crosssection/views/CrossHome.vue | 29 +++++++++++++++++++
 frontend/src/router.js                        | 16 ++++++++++
 .../specs/crosssection/CrossToolHome.spec.js  | 29 +++++++++++++++++++
 4 files changed, 75 insertions(+)
 create mode 100644 frontend/src/crosssection/views/CrossHome.vue
 create mode 100644 frontend/tests/unit/specs/crosssection/CrossToolHome.spec.js

diff --git a/frontend/src/common/components/Header.vue b/frontend/src/common/components/Header.vue
index 764174ff9..351dba1df 100644
--- a/frontend/src/common/components/Header.vue
+++ b/frontend/src/common/components/Header.vue
@@ -41,6 +41,7 @@
           <b-navbar-nav class="gwells-nav">
             <b-nav-item id="ribbon-search" class="navbar-link lvl2-link" :to="{ name: 'wells-home'}">Well Search</b-nav-item>
             <b-nav-item id="ribbon-aquifers" v-if="show.aquifers" class="navbar-link lvl2-link" :to="{ name: 'aquifers-home' }">Aquifer Search</b-nav-item>
+            <b-nav-item id="ribbon-crosssection" v-if="show.bulk" class="navbar-link lvl2-link" :to="{ name: 'CrossHome' }">Cross Section</b-nav-item>
             <b-nav-item id="ribbon-registry" class="navbar-link lvl2-link" :to="{ name: 'SearchHome'}">Registry Search</b-nav-item>
             <b-nav-item class="navbar-link lvl2-link" v-if="show.dataEntry" :to="{ name: 'SubmissionsHome'}">Submit Report</b-nav-item>
             <b-nav-item id="ribbon-bulk" class="navbar-link lvl2-link" v-if="show.bulk" :to="{ name: 'bulk-home' }">Bulk Upload</b-nav-item>
diff --git a/frontend/src/crosssection/views/CrossHome.vue b/frontend/src/crosssection/views/CrossHome.vue
new file mode 100644
index 000000000..b116195f5
--- /dev/null
+++ b/frontend/src/crosssection/views/CrossHome.vue
@@ -0,0 +1,29 @@
+/*
+Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+        http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+*/
+<template>
+  <b-card class="container p-1">
+      <h1 class="card-title" id="CrossSectionTitle">Cross Section Home</h1>
+      <div>
+      </div>
+    </b-card>
+</template>
+
+<script>
+export default {
+  name: 'CrossHome',
+}
+</script>
+
+<style>
+</style>
diff --git a/frontend/src/router.js b/frontend/src/router.js
index 8fd8a7a91..a66e78509 100644
--- a/frontend/src/router.js
+++ b/frontend/src/router.js
@@ -21,6 +21,9 @@ import WellDetail from '@/wells/views/WellDetail.vue'
 import EditWellAquifers from '@/wells/views/EditWellAquifers.vue'
 import GroundwaterInformation from '@/wells/views/GroundwaterInformation.vue'
 
+// Crossection components
+import CrossHome from './crosssection/views/CrossHome.vue'
+
 // Registries components
 import SearchHome from '@/registry/components/search/SearchHome.vue'
 import PersonDetail from '@/registry/components/people/PersonDetail.vue'
@@ -135,6 +138,19 @@ const router = new Router({
       }
     },
 
+    // Cross section tool routes
+    {
+      path: '/crosssection',
+      name: 'CrossHome',
+      component: CrossHome,
+      beforeEnter: AuthGuard,
+      meta: {
+        // list of required permissions (e.g. "edit: true" means user needs edit permission)
+        edit: true,
+        app: 'registry'
+      }
+    },
+
     // Registries routes
     {
       path: '/registries/people/edit/:person_guid',
diff --git a/frontend/tests/unit/specs/crosssection/CrossToolHome.spec.js b/frontend/tests/unit/specs/crosssection/CrossToolHome.spec.js
new file mode 100644
index 000000000..ed93fbf02
--- /dev/null
+++ b/frontend/tests/unit/specs/crosssection/CrossToolHome.spec.js
@@ -0,0 +1,29 @@
+import { shallowMount, createLocalVue } from '@vue/test-utils'
+import Vuex from 'vuex'
+import { merge } from 'lodash'
+import CrossHome from '../../../../src/crosssection/views/CrossHome.vue'
+import auth from '@/common/store/auth.js'
+
+const localVue = createLocalVue()
+localVue.use(Vuex)
+
+describe('CrossHome.vue', () => {
+  const getters = {
+    userRoles: () => ({ wells: { view: true } })
+  }
+
+  const component = (options, storeState = {}) => {
+    const store = new Vuex.Store({
+      getters,
+      modules: { auth }
+    })
+    store.replaceState(merge(store.state, storeState))
+
+    return shallowMount(CrossHome, { store, localVue })
+  }
+
+  it('the page renders', () => {
+    const wrapper = component()
+    expect(wrapper.find('#CrossSectionTitle').text()).toBe('Cross Section Home')
+  })
+})