From 23600cedee340cc000a4777ac0ed08bbe07ab7b9 Mon Sep 17 00:00:00 2001
From: Jonathan Bernard <jonathan@jdbernard.com>
Date: Sun, 15 Mar 2020 17:18:40 -0500
Subject: [PATCH] web: Adjust to new API URLs, implement update for Measure.

---
 .../measure-config/measure-config-form.ts         | 10 +++++++++-
 web/src/services/pm-api-client.ts                 | 10 +++++-----
 web/src/views/EditMeasure.vue                     |  2 +-
 web/src/views/edit-measure.ts                     | 15 ++++++++++++++-
 4 files changed, 29 insertions(+), 8 deletions(-)

diff --git a/web/src/components/measure-config/measure-config-form.ts b/web/src/components/measure-config/measure-config-form.ts
index ad50aab..71c416c 100644
--- a/web/src/components/measure-config/measure-config-form.ts
+++ b/web/src/components/measure-config/measure-config-form.ts
@@ -12,7 +12,7 @@ import moment from 'moment';
 export class MeasureConfigForm extends Vue {
   @Prop({}) public value!: MeasureConfig;
   @Prop({}) public disabled: boolean = false;
-  @Prop({}) public measureExists: boolean = false;
+  @Prop({}) public measureExists!: boolean;
 
   public now = moment();
   public formatStrings = [
@@ -47,6 +47,14 @@ export class MeasureConfigForm extends Vue {
       this.value.timestampDisplayFormat = this.selectedFormat;
     }
   }
+
+  private mounted() {
+    if (this.formatStrings.includes(this.value.timestampDisplayFormat)) {
+      this.selectedFormat = this.value.timestampDisplayFormat;
+    } else {
+      this.selectedFormat = 'custom';
+    }
+  }
 }
 
 export default MeasureConfigForm;
diff --git a/web/src/services/pm-api-client.ts b/web/src/services/pm-api-client.ts
index 97fff4d..144a054 100644
--- a/web/src/services/pm-api-client.ts
+++ b/web/src/services/pm-api-client.ts
@@ -136,7 +136,7 @@ export class PmApiClient {
   public async getMeasurements(measureSlug: string)
     : Promise<Array<Measurement<MeasurementMeta>>> {
 
-    const resp = await this.http.get(`/measure/${measureSlug}`);
+    const resp = await this.http.get(`/measurements/${measureSlug}`);
     return resp.data.map(this.fromMeasurementDTO);
   }
 
@@ -146,7 +146,7 @@ export class PmApiClient {
     : Promise<Measurement<MeasurementMeta>> {
 
      const resp = await this.http.post(
-       `/measure/${measureSlug}`,
+       `/measurements/${measureSlug}`,
        this.toMeasurementDTO(measurement));
      return this.fromMeasurementDTO(resp.data);
   }
@@ -157,7 +157,7 @@ export class PmApiClient {
     : Promise<Measurement<MeasurementMeta>> {
 
     const resp = await this.http
-      .get(`/measure/${measureSlug}/${measurementId}`);
+      .get(`/measurements/${measureSlug}/${measurementId}`);
     return this.fromMeasurementDTO(resp.data);
   }
 
@@ -167,7 +167,7 @@ export class PmApiClient {
     : Promise<Measurement<MeasurementMeta>> {
 
     const resp = await this.http.put(
-      `/measure/${measureSlug}/${measurement.id}`,
+      `/measurements/${measureSlug}/${measurement.id}`,
       this.toMeasurementDTO(measurement));
     return this.fromMeasurementDTO(resp.data);
   }
@@ -178,7 +178,7 @@ export class PmApiClient {
     : Promise<boolean> {
 
     const resp = await this.http
-      .delete(`/measure/${measureSlug}/${measurementId}`);
+      .delete(`/measurements/${measureSlug}/${measurementId}`);
     return true;
   }
 
diff --git a/web/src/views/EditMeasure.vue b/web/src/views/EditMeasure.vue
index 7dbb05f..35bbbea 100644
--- a/web/src/views/EditMeasure.vue
+++ b/web/src/views/EditMeasure.vue
@@ -1,5 +1,5 @@
 <template>
-  <div id=edit-measure>
+  <div id=edit-measure v-if=measure>
     <div class=header>
       <h1>Edit Measure</h1>
       <h2>{{measure.name}}</h2>
diff --git a/web/src/views/edit-measure.ts b/web/src/views/edit-measure.ts
index 2e73001..adaae7e 100644
--- a/web/src/views/edit-measure.ts
+++ b/web/src/views/edit-measure.ts
@@ -18,7 +18,11 @@ export class EditMeasure extends Vue {
   }
 
   private get slugFromName() {
-    return slugify(this.measure.name);
+    if (this.measure) {
+      return slugify(this.measure.name);
+    } else {
+      return null;
+    }
   }
 
   private async updateMeasure() {
@@ -38,6 +42,15 @@ export class EditMeasure extends Vue {
       }
     }
   }
+
+  private async mounted() {
+    // good chance we've already fetched this
+    // TODO: centralize this caching behavior?
+    if (!this.measure) {
+      await measureStore.fetchMeasure(this.$route.params.slug);
+    }
+  }
+
 }
 
 export default EditMeasure;