[Cleanup] Adopt eslint vue/recommended: Grant Finder: core views (#2813)

* Remove core view files from eslint ignore list

* Fix auto-fixable lint errors

* Remove unused script portion of Home view

* Rename views with View postfix

* Remove unused Home view

packages/client/.eslintrc.js

@@ -85,11 +85,6 @@ module.exports = {
         './src/main.js',
         './src/components/Layout.vue',
 
-        // Grant Finder: core views
-        './src/views/Home.vue',
-        './src/views/Login.vue',
-        './src/views/NotFound.vue',
-
         // Grant Finder: search modals
         './src/components/Modals/AddKeyword.vue',
         './src/components/Modals/SavedSearchPanel.vue',

packages/client/src/router/index.js

@@ -1,7 +1,7 @@
 import VueRouter from 'vue-router';
 
 import { myProfileEnabled, newTerminologyEnabled, newGrantsDetailPageEnabled } from '@/helpers/featureFlags';
-import Login from '../views/Login.vue';
+import LoginView from '@/views/LoginView.vue';
 import Layout from '../components/Layout.vue';
 import ArpaAnnualPerformanceReporter from '../views/ArpaAnnualPerformanceReporter.vue';
 
@@ -11,7 +11,7 @@ export const routes = [
   {
     path: '/login',
     name: 'login',
-    component: Login,
+    component: LoginView,
   },
   {
     path: '/arpa-annual-performance-reporter',
@@ -156,7 +156,7 @@ export const routes = [
   },
   {
     path: '*',
-    component: () => import('../views/NotFound.vue'),
+    component: () => import('../views/NotFoundView.vue'),
     name: 'notFound',
     meta: {
       requiresAuth: true,

packages/client/src/views/Login.vue → packages/client/src/views/LoginView.vue

@@ -6,26 +6,30 @@
     class="mx-auto border-0"
   >
     <b-card-img
-        :src="require('../assets/usdr_logo_standard_wide.svg')"
-        style="max-width: 14rem"
-        alt="United States Digital Response logo"
-        class="mx-auto mb-3"
-        top
-      ></b-card-img>
+      :src="require('../assets/usdr_logo_standard_wide.svg')"
+      style="max-width: 14rem"
+      alt="United States Digital Response logo"
+      class="mx-auto mb-3"
+      top
+    />
     <b-card-text class="mt-4 p-3 dropshadow-card">
-      <h1 class="h3 my-4">Log in to Federal Grant Finder</h1>
-      <p class="mb-4">Enter your email to receive a one-time login link.</p>
+      <h1 class="h3 my-4">
+        Log in to Federal Grant Finder
+      </h1>
+      <p class="mb-4">
+        Enter your email to receive a one-time login link.
+      </p>
       <form @submit="login">
         <div>
           <label for="email">Email</label>
           <input
-            class="form-control mb-4"
             id="email"
+            v-model="email"
+            class="form-control mb-4"
             name="email"
             placeholder="Email address"
-            v-model="email"
             autofocus
-          />
+          >
         </div>
         <div
           class="d-flex justify-content-center"
@@ -40,11 +44,20 @@
           </b-button>
         </div>
       </form>
-      <div :class="messageClass" class="mt-3" v-if="message">{{ message }}</div>
-      <hr class="my-4"/>
+      <div
+        v-if="message"
+        :class="messageClass"
+        class="mt-3"
+      >
+        {{ message }}
+      </div>
+      <hr class="my-4">
       <p>
         Don't have an account? Please fill out
-        <a href="https://form.jotform.com/201195733501145" target="_blank">USDR's request form</a>
+        <a
+          href="https://form.jotform.com/201195733501145"
+          target="_blank"
+        >USDR's request form</a>
         and indicate you'd like to create one.
       </p>
       <p>Need help? <a href="mailto:[email protected]?subject=Federal Grant Finder Login Issue">Contact us</a> for support.</p>
@@ -58,7 +71,7 @@ import { apiURL } from '@/helpers/fetchApi';
 import _ from 'lodash-checkit';
 
 export default {
-  name: 'Login',
+  name: 'LoginView',
   data() {
     const message = _.get(this, '$route.query.message', null);
     const messageClass = message ? 'alert alert-danger' : '';

packages/client/src/views/NotFoundView.vue

@@ -0,0 +1,13 @@
+<template>
+  <div style="text-align: center;">
+    <h1 style="font-size: 100px;">
+      404
+    </h1>
+    <h1>Page not found</h1>
+    <h1>
+      The page you are looking for does not exist. Click here to go to the <b-link to="/">
+        home page
+      </b-link>.
+    </h1>
+  </div>
+</template>