Updated dox for #9; version bump

Also:
- rearranged API calls to be in alphabetical order (except the bearer
stuff at the top)
- modified the API base URL and Auth0 renewal URLs to be derived from
the browser's location (localhost / prod both work now with no change)

docs/index.md

@@ -38,7 +38,7 @@ myPrayerJournal tracks all of the actions related to a request; the fourth butto
 
 ## Answered Requests
 
-Next to "Journal" on the top navigation is the word "Answered." This page lists all answered requests, from most recent to least recent, along with the text of the request at the time it was marked as answered. It will also show you when it was marked answered. The button with the magnifying class at the words "Show Full Request" behave the same way as the paragraph immediately preceding this describes. _(This will likely change before a 0.9.x release, but this gives at least some way to find and review answered requests.)_
+Next to "Journal" on the top navigation is the word "Answered." This page lists all answered requests, from most recent to least recent, along with the text of the request at the time it was marked as answered. It will also show you when it was marked answered. The button at the bottom of each request, with the magnifying glass and the words "Show Full Request", link to a page that shows that request's complete history and notes, along with a few statistics about that request. The history and notes are listed from most recent to least recent; if you want to read it chronologically, just press the "End" key on your keyboard and read it from the bottom up.
 
 ## Known Issues
 

src/api/package.json

@@ -1,7 +1,7 @@
 {
   "name": "my-prayer-journal-api",
   "private": true,
-  "version": "0.8.4",
+  "version": "0.8.5",
   "description": "Server API for myPrayerJournal",
   "main": "index.js",
   "author": "Daniel J. Summers <daniel@bitbadger.solutions>",

src/api/src/routes/request.js

@@ -56,6 +56,19 @@ export default function (checkJwt) {
       }
       await next()
     })
+    // Get a complete request; equivalent to full + notes
+    .get('/:id/complete', checkJwt, async (ctx, next) => {
+      const req = await db.request.fullById(ctx.state.user.sub, ctx.params.id)
+      if ('Not Found' === req.text) {
+        ctx.response.status = 404
+      } else {
+        ctx.response.status = 200
+        req.notes = await db.request.notesById(ctx.state.user.sub, ctx.params.id)
+        ctx.body = req
+      }
+      await next()
+    })
+    // Get all answered requests
     .get('/answered', checkJwt, async (ctx, next) => {
       ctx.body = await db.request.answered(ctx.state.user.sub)
       ctx.response.status = 200

src/app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "my-prayer-journal",
-  "version": "0.8.4",
+  "version": "0.8.5",
   "description": "myPrayerJournal - Front End",
   "author": "Daniel J. Summers <daniel@bitbadger.solutions>",
   "private": true,

src/app/src/App.vue

@@ -6,7 +6,10 @@
     vue-progress-bar
     toast(ref='toast')
   footer
-    p.text-right: i myPrayerJournal v0.8.4
+    p.text-right.text-muted: i.
+      myPrayerJournal v{{ version }} •
+      #[a(href='https://github.com/danieljsummers/myprayerjournal') Developed] and hosted by
+      #[a(href='https://bitbadger.solutions') Bit Badger Solutions]
 </template>
 
 <script>
@@ -14,11 +17,16 @@
 
 import Navigation from './components/Navigation.vue'
 
+import { version } from '../package.json'
+
 export default {
   name: 'app',
   components: {
     Navigation
   },
+  data () {
+    return { version }
+  },
   mounted () {
     this.$refs.toast.setOptions({ position: 'bottom right' })
   },
@@ -45,6 +53,9 @@ footer {
 footer p {
   margin: 0;
 }
+a:link, a:visited {
+  color: #050;
+}
 .mpj-request-text {
   white-space: pre-line;
 }

src/app/src/api/index.js

@@ -1,7 +1,7 @@
 import axios from 'axios'
 
 const http = axios.create({
-  baseURL: 'http://localhost:3000/api/'
+  baseURL: `${location.protocol}//${location.host}/api/`
 })
 
 /**
@@ -20,11 +20,6 @@ export default {
    */
   removeBearer: () => delete http.defaults.headers.common['authorization'],
 
-  /**
-   * Get all prayer requests and their most recent updates
-   */
-  journal: () => http.get('journal/'),
-
   /**
    * Add a note for a prayer request
    * @param {string} requestId The Id of the request to which the note applies
@@ -39,19 +34,9 @@ export default {
   addRequest: requestText => http.post('request/', { requestText }),
 
   /**
-   * Update a prayer request
+   * Get all answered requests, along with the text they had when it was answered
-   * @param request The request (should have requestId, status, and updateText properties)
    */
-  updateRequest: request => http.post(`request/${request.requestId}/history`, {
+  getAnsweredRequests: () => http.get('request/answered'),
-    status: request.status,
-    updateText: request.updateText
-  }),
-
-  /**
-   * Get a prayer request (journal-style; only latest update)
-   * @param {string} requestId The Id of the request to retrieve
-   */
-  getRequest: requestId => http.get(`request/${requestId}`),
 
   /**
    * Get a prayer request (full; includes all history)
@@ -59,15 +44,35 @@ export default {
    */
   getFullRequest: requestId => http.get(`request/${requestId}/full`),
 
-  /**
-   * Get all answered requests, along with the text they had when it was answered
-   */
-  getAnsweredRequests: () => http.get('request/answered'),
-
   /**
    * Get past notes for a prayer request
    * @param {string} requestId The Id of the request for which notes should be retrieved
    */
-  getNotes: requestId => http.get(`request/${requestId}/notes`)
+  getNotes: requestId => http.get(`request/${requestId}/notes`),
+
+  /**
+   * Get a prayer request (journal-style; only latest update)
+   * @param {string} requestId The Id of the request to retrieve
+   */
+  getRequest: requestId => http.get(`request/${requestId}`),
+
+  /**
+   * Get a complete request; equivalent of "full" and "notes" combined
+   */
+  getRequestComplete: requestId => http.get(`request/${requestId}/complete`),
+
+  /**
+   * Get all prayer requests and their most recent updates
+   */
+  journal: () => http.get('journal/'),
+
+  /**
+   * Update a prayer request
+   * @param request The request (should have requestId, status, and updateText properties)
+   */
+  updateRequest: request => http.post(`request/${request.requestId}/history`, {
+    status: request.status,
+    updateText: request.updateText
+  })
 
 }

src/app/src/components/Answered.vue

@@ -2,36 +2,29 @@
 article
   page-title(title='Answered Requests')
   p(v-if='!loaded') Loading answered requests...
-  div(v-if='loaded')
+  div(v-if='loaded').mpj-answered-list
     p.mpj-request-text(v-for='req in requests' :key='req.requestId')
-      b-btn(@click='showFull(req.requestId)'
+      | {{ req.text }}
+      br
+      br
+      b-btn(:to='{ name: "AnsweredDetail", params: { id: req.requestId }}'
             size='sm'
             variant='outline-secondary')
         icon(name='search')
-        |  View Full Request
+        = ' View Full Request'
-      |     {{ req.text }}  
       small.text-muted: em.
-        (Answered #[date-from-now(:value='req.asOf')])
+          Answered #[date-from-now(:value='req.asOf')]
-  full-request(:events='eventBus')
 </template>
 
 <script>
 'use static'
 
-import Vue from 'vue'
-
-import FullRequest from './request/FullRequest'
-
 import api from '@/api'
 
 export default {
   name: 'answered',
-  components: {
-    FullRequest
-  },
   data () {
     return {
-      eventBus: new Vue(),
       requests: [],
       loaded: false
     }
@@ -54,11 +47,15 @@ export default {
     } finally {
       this.loaded = true
     }
-  },
-  methods: {
-    showFull (requestId) {
-      this.eventBus.$emit('full', requestId)
-    }
   }
 }
 </script>
+
+<style>
+.mpj-answered-list p {
+  border-top: solid 1px lightgray;
+}
+.mpj-answered-list p:first-child {
+  border-top: none;
+}
+</style>

src/app/src/components/AnsweredDetail.vue

@@ -0,0 +1,81 @@
+<template lang="pug">
+article
+  page-title(title='Answered Request')
+  p(v-if='!request') Loading request...
+  template(v-if='request')
+    p.
+      Answered {{ formatDate(answered) }} (#[date-from-now(:value='answered')]) &nbsp;
+      #[small: em.text-muted prayed {{ prayedCount }} times, open {{ openDays }} days]
+    p.mpj-request-text {{ lastText }}
+    b-table(small hover :fields='fields' :items='log')
+      template(slot='action' scope='data') {{ data.item.status }} on {{ formatDate(data.item.asOf) }}
+</template>
+
+<script>
+'use strict'
+
+import moment from 'moment'
+
+import api from '@/api'
+
+const asOfDesc = (a, b) => b.asOf - a.asOf
+
+export default {
+  name: 'answer-detail',
+  props: {
+    id: {
+      type: String,
+      required: true
+    }
+  },
+  data () {
+    return {
+      request: null,
+      fields: [
+        { key: 'action', label: 'Action' },
+        { key: 'text', label: 'Update / Notes' }
+      ]
+    }
+  },
+  computed: {
+    answered () {
+      return this.request.history.find(hist => hist.status === 'Answered').asOf
+    },
+    lastText () {
+      return this.request.history
+        .filter(hist => hist.text > '')
+        .sort(asOfDesc)[0].text
+    },
+    log () {
+      return this.request.notes
+        .map(note => ({ asOf: note.asOf, text: note.notes, status: 'Notes' }))
+        .concat(this.request.history)
+        .sort(asOfDesc)
+        .slice(1)
+    },
+    openDays () {
+      return Math.floor(
+        (this.answered - this.request.history.find(hist => hist.status === 'Created').asOf) / 1000 / 60 / 60 / 24)
+    },
+    prayedCount () {
+      return this.request.history.filter(hist => hist.status === 'Prayed').length
+    }
+  },
+  async mounted () {
+    this.$Progress.start()
+    try {
+      const req = await api.getRequestComplete(this.id)
+      this.request = req.data
+      this.$Progress.finish()
+    } catch (e) {
+      console.log(e)
+      this.$Progress.fail()
+    }
+  },
+  methods: {
+    formatDate (asOf) {
+      return moment(asOf).format('LL')
+    }
+  }
+}
+</script>

src/app/src/components/request/NotesEdit.vue

@@ -21,8 +21,8 @@ b-modal(v-model='notesVisible'
         small.text-muted: date-from-now(:value='note.asOf')
         br
         div.mpj-request-text {{ note.notes }}
-  div(v-if='noPriorNotes').text-center.text-muted There are no prior notes for this request
+  div(v-else-if='noPriorNotes').text-center.text-muted There are no prior notes for this request
-  div(v-if='!priorNotesLoaded').text-center
+  div(v-else).text-center
     b-btn(variant='outline-secondary'
           @click='loadNotes()') Load Prior Notes
   div.w-100.text-right(slot='modal-footer')

src/app/src/components/request/RequestListItem.vue

@@ -17,7 +17,7 @@ div
           = '(last activity '
           date-from-now(:value='request.asOf')
           | )
-    b-card(v-for='it in 3 - row.length')
+    b-card(v-for='it in 3 - row.length' key='-1')
   br
 </template>
 

src/app/src/router/index.js

@@ -2,6 +2,7 @@ import Vue from 'vue'
 import Router from 'vue-router'
 
 import Answered from '@/components/Answered'
+import AnsweredDetail from '@/components/AnsweredDetail'
 import Home from '@/components/Home'
 import Journal from '@/components/Journal'
 import LogOn from '@/components/user/LogOn'
@@ -11,9 +12,31 @@ Vue.use(Router)
 export default new Router({
   mode: 'history',
   routes: [
-    { path: '/', name: 'Home', component: Home },
+    {
-    { path: '/answered', name: 'Answered', component: Answered },
+      path: '/',
-    { path: '/journal', name: 'Journal', component: Journal },
+      name: 'Home',
-    { path: '/user/log-on', name: 'LogOn', component: LogOn }
+      component: Home
+    },
+    {
+      path: '/answered/:id',
+      name: 'AnsweredDetail',
+      component: AnsweredDetail,
+      props: true
+    },
+    {
+      path: '/answered',
+      name: 'Answered',
+      component: Answered
+    },
+    {
+      path: '/journal',
+      name: 'Journal',
+      component: Journal
+    },
+    {
+      path: '/user/log-on',
+      name: 'LogOn',
+      component: LogOn
+    }
   ]
 })

src/app/static/silent.html

@@ -9,12 +9,12 @@
       clientID: 'Of2s0RQCQ3mt3dwIkOBY5h85J9sXbF2n',
       scope: 'openid profile email',
       responseType: 'token id_token',
-      redirectUri: 'http://localhost:3000/static/silent.html'
+      redirectUri: location.protocol + '//' + location.host + '/static/silent.html'
     })
   </script>
   <script>
     webAuth.parseHash(window.location.hash, function (err, response) {
-      parent.postMessage(err || response, 'http://localhost:3000');
+      parent.postMessage(err || response, location.protocol + '//' + location.host);
     })
   </script>
 </head>