From 48aa51895b6afa644cf2dcd42d37770565bb641e Mon Sep 17 00:00:00 2001
From: HMS17 <84345306+HMS17@users.noreply.github.com>
Date: Tue, 5 Apr 2022 11:04:49 -0400
Subject: [PATCH 01/11] [BI-1339] Germplasm Details page

---
 .env.development                         |  2 +
 src/router/index.ts                      | 11 +++
 src/views/germplasm/GermplasmDetails.vue | 95 ++++++++++++++++++++++++
 src/views/germplasm/GermplasmTable.vue   | 12 +++
 4 files changed, 120 insertions(+)
 create mode 100644 src/views/germplasm/GermplasmDetails.vue

diff --git a/.env.development b/.env.development
index cbfcd9af4..6535555d4 100644
--- a/.env.development
+++ b/.env.development
@@ -13,3 +13,5 @@ VUE_APP_BI_API_ROOT=${API_BASE_URL}
 # The level of logging for our logger
 VUE_APP_LOG_LEVEL=${WEB_LOG_LEVEL}
 
+# The reference source
+VUE_APP_BI_REFERENCE_SOURCE=breeding-insight.org
diff --git a/src/router/index.ts b/src/router/index.ts
index 8e71272eb..1df577681 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -66,6 +66,7 @@ import OntologyArchivedTable from "@/components/ontology/OntologyArchivedTable.v
 import PageNotFound from "@/views/PageNotFound.vue";
 import Germplasm from "@/views/germplasm/Germplasm.vue";
 import GermplasmLists from "@/views/germplasm/GermplasmLists.vue";
+import GermplasmDetails from "@/views/germplasm/GermplasmDetails.vue";
 
 Vue.use(VueRouter);
 
@@ -293,6 +294,16 @@ const routes = [
       }
     ]
   },
+  {
+    path: '/programs/:programId/germplasm/:germplasmId',
+    name: 'germplasm-details',
+    component: GermplasmDetails,
+    meta: {
+      title: 'Germplasm Details',
+      layout: layouts.userSideBar
+    },
+    beforeEnter: processProgramNavigation
+  },
   {
     path: '/programs/:programId/traits',
     name: 'traits',
diff --git a/src/views/germplasm/GermplasmDetails.vue b/src/views/germplasm/GermplasmDetails.vue
new file mode 100644
index 000000000..b279cb8e5
--- /dev/null
+++ b/src/views/germplasm/GermplasmDetails.vue
@@ -0,0 +1,95 @@
+<template>
+  <div class="germplasm">
+    <h1 class="title">
+      Germplasm Details
+    </h1>
+
+    <div class="columns is-multiline is-align-items-stretch mt-4">
+    <article class="column ">
+    <section>
+      <ul style="list-style-type: none;">
+      <li><b>Preferred Name: </b> {{ }}</li>
+      <li><b>GID: </b> {{ }}</li>
+      <li><b>Breeding Method: </b> {{ }}</li>
+      <li><b>Source: </b> {{ }}</li>
+      <li><b>Synonyms: </b> {{ }}</li>
+      <li><b>External UID: </b> {{ }}</li>
+      <li><b>User: </b> {{ }}</li>
+      <li><b>Creation Date: </b> {{ }}</li>
+      </ul>
+    </section>
+    </article>
+    <article class="column px-2">
+      <section>
+        <ul style="list-style-type: none;">
+        <li><b>Female Parent: </b> {{ }}</li>
+        <li><b>Female Parent GID: </b> {{ }}</li>
+        <li><b>Male Parent: </b> {{ }}</li>
+        <li><b>Male Parent GID: </b> {{ }}</li>
+        <li><b>Cross: </b> {{ }}</li>
+        <li><b>Cross GID(s): </b> {{ }}</li>
+        </ul>
+      </section>
+    </article>
+      </div>
+
+    <section>
+      <nav class="tabs is-boxed">
+        <ul>
+            <router-link
+                v-bind:to="{name: '', params: {programId: activeProgram.id}}"
+                tag="li"
+            >
+              <a>Images</a>
+            </router-link>
+            <router-link
+                v-bind:to="{name: '', params: {programId: activeProgram.id}}"
+                tag="li"
+            >
+              <a>Pedigrees</a>
+            </router-link>
+              <router-link
+                  v-bind:to="{name: '', params: {programId: activeProgram.id}}"
+                  tag="li"
+              >
+                <a>Attributes</a>
+              </router-link>
+        </ul>
+      </nav>
+    </section>
+
+    <div class="tab-content">
+      <router-view
+          @show-success-notification="$emit('show-success-notification', $event)"
+          @show-info-notification="$emit('show-info-notification', $event)"
+          @show-error-notification="$emit('show-error-notification', $event)"
+      />
+    </div>
+  </div>
+</template>
+
+<script lang="ts">
+import { Component } from 'vue-property-decorator'
+import {mapGetters} from "vuex";
+import {Program} from "@/breeding-insight/model/Program";
+import GermplasmBase from "@/components/germplasm/GermplasmBase.vue";
+import {Germplasm} from "@/breeding-insight/brapi/model/germplasm";
+
+@Component({
+  components: {},
+  computed: {
+    ...mapGetters([
+      'activeProgram'
+    ])
+  },
+  data: () => ({})
+})
+export default class GermplasmDetails extends GermplasmBase {
+
+  private activeProgram?: Program;
+  private data!: Germplasm;
+
+  //when page loads get details for uuid, create service, axios, api, call reference dao components in frontend re pathing
+
+}
+</script>
\ No newline at end of file
diff --git a/src/views/germplasm/GermplasmTable.vue b/src/views/germplasm/GermplasmTable.vue
index e2f71a2d2..d33c1044b 100644
--- a/src/views/germplasm/GermplasmTable.vue
+++ b/src/views/germplasm/GermplasmTable.vue
@@ -37,6 +37,11 @@
       <b-table-column field="createdBy.userName" label="Created By" v-slot="props" :th-attrs="(column) => ({scope:'col'})">
         {{ props.row.data.additionalInfo.createdBy.userName }}
       </b-table-column>
+      <b-table-column field="germplasmId" v-slot="props" :th-attrs="(column) => ({scope:'col'})">
+        <router-link v-bind:to="{name: 'germplasm-details', params: {programId: activeProgram.id, germplasmId: getGermplasmUUID(props.row.data.externalReferences)}}">
+          Show Details
+        </router-link>
+      </b-table-column>
 
       <template v-slot:emptyMessage>
         <p class="has-text-weight-bold">
@@ -63,6 +68,7 @@ import {Pagination} from "@/breeding-insight/model/BiResponse";
 import ExpandableTable from "@/components/tables/expandableTable/ExpandableTable.vue";
 import {PaginationController} from "@/breeding-insight/model/view_models/PaginationController";
 import {Pedigree} from "@/breeding-insight/model/import/germplasm/Pedigree";
+import {ExternalReferences} from "@/breeding-insight/brapi/model/externalReferences";
 
 @Component({
   mixins: [validationMixin],
@@ -110,5 +116,11 @@ export default class GermplasmTable extends Vue {
 
   }
 
+  getGermplasmUUID(references: ExternalReferences){
+    let val = references.find(ref => ref.referenceSource === process.env.VUE_APP_BI_REFERENCE_SOURCE);
+    return val ? val.referenceID : ""; //todo error handling
+  }
+
+
 }
 </script>
\ No newline at end of file

From da4135cfeebe7ec9f1799beca6cf1601d0568365 Mon Sep 17 00:00:00 2001
From: HMS17 <84345306+HMS17@users.noreply.github.com>
Date: Wed, 6 Apr 2022 16:50:25 -0400
Subject: [PATCH 02/11] Germplasm Retrieval and Display

---
 src/breeding-insight/dao/GermplasmDAO.ts      | 18 +++++
 .../service/GermplasmService.ts               | 22 ++++++
 src/views/germplasm/GermplasmDetails.vue      | 71 ++++++++++++++-----
 3 files changed, 92 insertions(+), 19 deletions(-)

diff --git a/src/breeding-insight/dao/GermplasmDAO.ts b/src/breeding-insight/dao/GermplasmDAO.ts
index bcb1ce26c..f98b0deb3 100644
--- a/src/breeding-insight/dao/GermplasmDAO.ts
+++ b/src/breeding-insight/dao/GermplasmDAO.ts
@@ -41,4 +41,22 @@ export class GermplasmDAO {
             })
         }))
     }
+
+    static getSingleGermplasm(programId: string, germplasmId: string): Promise<BiResponse> {
+        const config: any = {};
+        config.url = `${process.env.VUE_APP_BI_API_V1_PATH}/programs/${programId}/brapi/v2/germplasm/${germplasmId}`;
+        config.method = 'get';
+        config.programId = programId;
+        config.germplasmId = germplasmId;
+        config.params = {}; //todo check if needed
+
+        return new Promise<any>(((resolve, reject) => {
+            api.call(config)
+                .then((response: any) => {
+                    resolve(response);
+                }).catch((error) => {
+                reject(error);
+            })
+        }))
+    }
 }
diff --git a/src/breeding-insight/service/GermplasmService.ts b/src/breeding-insight/service/GermplasmService.ts
index 3953f0a78..8a1b99831 100644
--- a/src/breeding-insight/service/GermplasmService.ts
+++ b/src/breeding-insight/service/GermplasmService.ts
@@ -20,6 +20,7 @@ import {BiResponse, Metadata} from "@/breeding-insight/model/BiResponse";
 import {PaginationQuery} from "@/breeding-insight/model/PaginationQuery";
 import {PaginationController} from "@/breeding-insight/model/view_models/PaginationController";
 import {GermplasmDAO} from "@/breeding-insight/dao/GermplasmDAO";
+import {Germplasm} from "@/breeding-insight/brapi/model/germplasm";
 
 export class GermplasmService {
 
@@ -48,4 +49,25 @@ export class GermplasmService {
         }));
     }
 
+    static getSingleGermplasm(programId: string, germplasmId: string): Promise<Germplasm> {
+        return new Promise<Germplasm>(((resolve, reject) => {
+
+            let germplasm: Germplasm;
+
+            if (programId) {
+                GermplasmDAO.getSingleGermplasm(programId, germplasmId).then((response: any) => {
+                    if (response.data) {
+                        germplasm = response.data as Germplasm;
+                    }
+
+                    resolve(germplasm);
+                }).catch((error) => {
+                    reject(error);
+                })
+            } else {
+                reject();
+            }
+        }));
+    }
+
 }
diff --git a/src/views/germplasm/GermplasmDetails.vue b/src/views/germplasm/GermplasmDetails.vue
index b279cb8e5..756f77a4b 100644
--- a/src/views/germplasm/GermplasmDetails.vue
+++ b/src/views/germplasm/GermplasmDetails.vue
@@ -1,33 +1,33 @@
 <template>
   <div class="germplasm">
+    <router-link v-bind:to="{name: 'germplasm-all', params: {programId: activeProgram.id}}">
+      All Germplasm
+    </router-link>
+    <p></p>
     <h1 class="title">
       Germplasm Details
     </h1>
 
+    <template v-if="!germplasmLoading">
     <div class="columns is-multiline is-align-items-stretch mt-4">
     <article class="column ">
     <section>
       <ul style="list-style-type: none;">
-      <li><b>Preferred Name: </b> {{ }}</li>
-      <li><b>GID: </b> {{ }}</li>
-      <li><b>Breeding Method: </b> {{ }}</li>
-      <li><b>Source: </b> {{ }}</li>
-      <li><b>Synonyms: </b> {{ }}</li>
-      <li><b>External UID: </b> {{ }}</li>
-      <li><b>User: </b> {{ }}</li>
-      <li><b>Creation Date: </b> {{ }}</li>
+      <li><b>Preferred Name: </b> {{germplasm.defaultDisplayName}}</li>
+      <li><b>GID: </b> {{ germplasm.accessionNumber }}</li>
+      <li><b>Breeding Method: </b> {{ germplasm.additionalInfo.breedingMethod }}</li>
+      <li><b>Source: </b> {{ germplasm.seedSource }}</li>
+        <li><b>Pedigree: </b> {{ germplasm.additionalInfo.pedigreeByName }}</li>
+        <li><b>Pedigree GID(s): </b> {{ germplasm.pedigree }}</li>
       </ul>
     </section>
     </article>
     <article class="column px-2">
       <section>
         <ul style="list-style-type: none;">
-        <li><b>Female Parent: </b> {{ }}</li>
-        <li><b>Female Parent GID: </b> {{ }}</li>
-        <li><b>Male Parent: </b> {{ }}</li>
-        <li><b>Male Parent GID: </b> {{ }}</li>
-        <li><b>Cross: </b> {{ }}</li>
-        <li><b>Cross GID(s): </b> {{ }}</li>
+          <li><b>External UID: </b> {{ getExternalUID() }}</li>
+          <li><b>User: </b> {{ germplasm.additionalInfo.createdBy.userName }}</li>
+          <li><b>Creation Date: </b> {{ getCreatedDate() }}</li>
         </ul>
       </section>
     </article>
@@ -65,15 +65,20 @@
           @show-error-notification="$emit('show-error-notification', $event)"
       />
     </div>
+    </template>
   </div>
 </template>
 
 <script lang="ts">
-import { Component } from 'vue-property-decorator'
+import {Component, Watch} from 'vue-property-decorator'
 import {mapGetters} from "vuex";
 import {Program} from "@/breeding-insight/model/Program";
 import GermplasmBase from "@/components/germplasm/GermplasmBase.vue";
 import {Germplasm} from "@/breeding-insight/brapi/model/germplasm";
+import {PaginationQuery} from "@/breeding-insight/model/PaginationQuery";
+import {PaginationController} from "@/breeding-insight/model/view_models/PaginationController";
+import {GermplasmService} from "@/breeding-insight/service/GermplasmService";
+import {Pagination} from "@/breeding-insight/model/BiResponse";
 
 @Component({
   components: {},
@@ -81,15 +86,43 @@ import {Germplasm} from "@/breeding-insight/brapi/model/germplasm";
     ...mapGetters([
       'activeProgram'
     ])
-  },
-  data: () => ({})
+  }
 })
 export default class GermplasmDetails extends GermplasmBase {
 
   private activeProgram?: Program;
-  private data!: Germplasm;
+  private germplasm: Germplasm;
+  private germplasmLoading: boolean = true;
+  private germplasmUUID: string = this.$route.params.germplasmId;
+  //private femaleParent: string = "";
+  //todo create empty obj then as germplasm
+  //todo take away time in datetime
 
-  //when page loads get details for uuid, create service, axios, api, call reference dao components in frontend re pathing
+  mounted() {
+    this.getGermplasm();
+  }
+
+  getGermplasm() {
+    this.germplasmLoading = true;
+    GermplasmService.getSingleGermplasm(this.activeProgram!.id!, this.germplasmUUID).then((germplasm) => {
+      this.germplasm = germplasm;
+    }).catch((error) => {
+      // Display error that germplasm cannot be loaded
+      this.$emit('show-error-notification', 'Error while trying to load germplasm');
+      throw error;
+    }).finally(() => this.germplasmLoading = false);
+  }
+
+  getExternalUID() {
+    let val = this.germplasm.externalReferences.filter(ref => ref.referenceSource == this.germplasm.seedSource)
+        .map(ref => ref.referenceID);
+    return val ? val[0]: "";
+  }
+
+  getCreatedDate(){
+    let dateTime = new Date(this.germplasm.additionalInfo.createdDate);
+    return dateTime.toLocaleDateString();
+  }
 
 }
 </script>
\ No newline at end of file

From 1766326493ae543e1e62acc5d71607f0b9efc10d Mon Sep 17 00:00:00 2001
From: HMS17 <84345306+HMS17@users.noreply.github.com>
Date: Thu, 7 Apr 2022 11:43:53 -0400
Subject: [PATCH 03/11] DateTime fix

---
 src/views/germplasm/GermplasmDetails.vue | 23 ++++++++++++-----------
 1 file changed, 12 insertions(+), 11 deletions(-)

diff --git a/src/views/germplasm/GermplasmDetails.vue b/src/views/germplasm/GermplasmDetails.vue
index 756f77a4b..25eda0222 100644
--- a/src/views/germplasm/GermplasmDetails.vue
+++ b/src/views/germplasm/GermplasmDetails.vue
@@ -75,10 +75,8 @@ import {mapGetters} from "vuex";
 import {Program} from "@/breeding-insight/model/Program";
 import GermplasmBase from "@/components/germplasm/GermplasmBase.vue";
 import {Germplasm} from "@/breeding-insight/brapi/model/germplasm";
-import {PaginationQuery} from "@/breeding-insight/model/PaginationQuery";
-import {PaginationController} from "@/breeding-insight/model/view_models/PaginationController";
 import {GermplasmService} from "@/breeding-insight/service/GermplasmService";
-import {Pagination} from "@/breeding-insight/model/BiResponse";
+import moment from "moment";
 
 @Component({
   components: {},
@@ -91,12 +89,9 @@ import {Pagination} from "@/breeding-insight/model/BiResponse";
 export default class GermplasmDetails extends GermplasmBase {
 
   private activeProgram?: Program;
-  private germplasm: Germplasm;
+  private germplasm?: Germplasm;
   private germplasmLoading: boolean = true;
   private germplasmUUID: string = this.$route.params.germplasmId;
-  //private femaleParent: string = "";
-  //todo create empty obj then as germplasm
-  //todo take away time in datetime
 
   mounted() {
     this.getGermplasm();
@@ -114,14 +109,20 @@ export default class GermplasmDetails extends GermplasmBase {
   }
 
   getExternalUID() {
-    let val = this.germplasm.externalReferences.filter(ref => ref.referenceSource == this.germplasm.seedSource)
-        .map(ref => ref.referenceID);
+    let val = "";
+    if (this.germplasm.externalReferences && this.germplasm.seedSource) {
+      val = this.germplasm.externalReferences.filter(ref => ref.referenceSource == this.germplasm.seedSource)
+          .map(ref => ref.referenceID);
+    }
     return val ? val[0]: "";
   }
 
   getCreatedDate(){
-    let dateTime = new Date(this.germplasm.additionalInfo.createdDate);
-    return dateTime.toLocaleDateString();
+    if (this.germplasm.additionalInfo && this.germplasm.additionalInfo.createdDate) {
+      let dateTime = moment(this.germplasm.additionalInfo.createdDate, "DD/MM/YYYY h:mm:ss");
+      return dateTime.format("DD/MM/YYYY");
+    }
+    return "";
   }
 
 }

From f6010dcc5f4b7f49ddf8c3e77105fbe9ef9a5445 Mon Sep 17 00:00:00 2001
From: HMS17 <84345306+HMS17@users.noreply.github.com>
Date: Thu, 7 Apr 2022 11:54:43 -0400
Subject: [PATCH 04/11] Linting

---
 src/views/germplasm/GermplasmDetails.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/views/germplasm/GermplasmDetails.vue b/src/views/germplasm/GermplasmDetails.vue
index 25eda0222..075dddc27 100644
--- a/src/views/germplasm/GermplasmDetails.vue
+++ b/src/views/germplasm/GermplasmDetails.vue
@@ -110,7 +110,7 @@ export default class GermplasmDetails extends GermplasmBase {
 
   getExternalUID() {
     let val = "";
-    if (this.germplasm.externalReferences && this.germplasm.seedSource) {
+    if (this.germplasm!.externalReferences && this.germplasm!.seedSource) {
       val = this.germplasm.externalReferences.filter(ref => ref.referenceSource == this.germplasm.seedSource)
           .map(ref => ref.referenceID);
     }
@@ -118,7 +118,7 @@ export default class GermplasmDetails extends GermplasmBase {
   }
 
   getCreatedDate(){
-    if (this.germplasm.additionalInfo && this.germplasm.additionalInfo.createdDate) {
+    if (this.germplasm!.additionalInfo && this.germplasm!.additionalInfo.createdDate) {
       let dateTime = moment(this.germplasm.additionalInfo.createdDate, "DD/MM/YYYY h:mm:ss");
       return dateTime.format("DD/MM/YYYY");
     }

From 6fb61e8f9fc736800ccba02bedae6024c3b21c4c Mon Sep 17 00:00:00 2001
From: HMS17 <84345306+HMS17@users.noreply.github.com>
Date: Thu, 7 Apr 2022 13:20:57 -0400
Subject: [PATCH 05/11] Linting again

---
 src/views/germplasm/GermplasmDetails.vue | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/views/germplasm/GermplasmDetails.vue b/src/views/germplasm/GermplasmDetails.vue
index 075dddc27..b15309447 100644
--- a/src/views/germplasm/GermplasmDetails.vue
+++ b/src/views/germplasm/GermplasmDetails.vue
@@ -109,17 +109,18 @@ export default class GermplasmDetails extends GermplasmBase {
   }
 
   getExternalUID() {
-    let val = "";
+    let val;
     if (this.germplasm!.externalReferences && this.germplasm!.seedSource) {
-      val = this.germplasm.externalReferences.filter(ref => ref.referenceSource == this.germplasm.seedSource)
+      val = this.germplasm.externalReferences.filter(ref => ref.referenceSource == this.germplasm.seedSource!)
           .map(ref => ref.referenceID);
+      return val ? val[0]: "";
     }
-    return val ? val[0]: "";
+    return "";
   }
 
   getCreatedDate(){
     if (this.germplasm!.additionalInfo && this.germplasm!.additionalInfo.createdDate) {
-      let dateTime = moment(this.germplasm.additionalInfo.createdDate, "DD/MM/YYYY h:mm:ss");
+      let dateTime = moment(this.germplasm.additionalInfo.createdDate!, "DD/MM/YYYY h:mm:ss");
       return dateTime.format("DD/MM/YYYY");
     }
     return "";

From 53936173977a0245117418ff4407190b13f38bb7 Mon Sep 17 00:00:00 2001
From: HMS17 <84345306+HMS17@users.noreply.github.com>
Date: Thu, 7 Apr 2022 13:50:03 -0400
Subject: [PATCH 06/11] Linting some more

---
 src/views/germplasm/GermplasmDetails.vue | 5 +++--
 src/views/germplasm/GermplasmTable.vue   | 2 +-
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/views/germplasm/GermplasmDetails.vue b/src/views/germplasm/GermplasmDetails.vue
index b15309447..4ea9b1dd3 100644
--- a/src/views/germplasm/GermplasmDetails.vue
+++ b/src/views/germplasm/GermplasmDetails.vue
@@ -89,7 +89,7 @@ import moment from "moment";
 export default class GermplasmDetails extends GermplasmBase {
 
   private activeProgram?: Program;
-  private germplasm?: Germplasm;
+  private germplasm: Germplasm;
   private germplasmLoading: boolean = true;
   private germplasmUUID: string = this.$route.params.germplasmId;
 
@@ -120,7 +120,8 @@ export default class GermplasmDetails extends GermplasmBase {
 
   getCreatedDate(){
     if (this.germplasm!.additionalInfo && this.germplasm!.additionalInfo.createdDate) {
-      let dateTime = moment(this.germplasm.additionalInfo.createdDate!, "DD/MM/YYYY h:mm:ss");
+      let createdDate = this.germplasm.additionalInfo.createdDate;
+      let dateTime = moment(createdDate, "DD/MM/YYYY h:mm:ss");
       return dateTime.format("DD/MM/YYYY");
     }
     return "";
diff --git a/src/views/germplasm/GermplasmTable.vue b/src/views/germplasm/GermplasmTable.vue
index d33c1044b..f78aeefa6 100644
--- a/src/views/germplasm/GermplasmTable.vue
+++ b/src/views/germplasm/GermplasmTable.vue
@@ -118,7 +118,7 @@ export default class GermplasmTable extends Vue {
 
   getGermplasmUUID(references: ExternalReferences){
     let val = references.find(ref => ref.referenceSource === process.env.VUE_APP_BI_REFERENCE_SOURCE);
-    return val ? val.referenceID : ""; //todo error handling
+    return val ? val.referenceID : "";
   }
 
 

From 3804d3c240e25d1bac0cb10032f70bd24b0725b1 Mon Sep 17 00:00:00 2001
From: HMS17 <84345306+HMS17@users.noreply.github.com>
Date: Thu, 7 Apr 2022 14:02:12 -0400
Subject: [PATCH 07/11] Linting some more

---
 src/views/germplasm/GermplasmDetails.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/germplasm/GermplasmDetails.vue b/src/views/germplasm/GermplasmDetails.vue
index 4ea9b1dd3..371662c29 100644
--- a/src/views/germplasm/GermplasmDetails.vue
+++ b/src/views/germplasm/GermplasmDetails.vue
@@ -89,7 +89,7 @@ import moment from "moment";
 export default class GermplasmDetails extends GermplasmBase {
 
   private activeProgram?: Program;
-  private germplasm: Germplasm;
+  private germplasm?: Germplasm;
   private germplasmLoading: boolean = true;
   private germplasmUUID: string = this.$route.params.germplasmId;
 

From 063dc189fecae1478569edbb66215eca8279c9e4 Mon Sep 17 00:00:00 2001
From: HMS17 <84345306+HMS17@users.noreply.github.com>
Date: Thu, 7 Apr 2022 14:20:10 -0400
Subject: [PATCH 08/11] Linting some more

---
 src/views/germplasm/GermplasmDetails.vue | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/views/germplasm/GermplasmDetails.vue b/src/views/germplasm/GermplasmDetails.vue
index 371662c29..ced01627f 100644
--- a/src/views/germplasm/GermplasmDetails.vue
+++ b/src/views/germplasm/GermplasmDetails.vue
@@ -111,7 +111,7 @@ export default class GermplasmDetails extends GermplasmBase {
   getExternalUID() {
     let val;
     if (this.germplasm!.externalReferences && this.germplasm!.seedSource) {
-      val = this.germplasm.externalReferences.filter(ref => ref.referenceSource == this.germplasm.seedSource!)
+      val = this.germplasm!.externalReferences!.filter(ref => ref.referenceSource == this.germplasm!.seedSource!)
           .map(ref => ref.referenceID);
       return val ? val[0]: "";
     }
@@ -120,8 +120,7 @@ export default class GermplasmDetails extends GermplasmBase {
 
   getCreatedDate(){
     if (this.germplasm!.additionalInfo && this.germplasm!.additionalInfo.createdDate) {
-      let createdDate = this.germplasm.additionalInfo.createdDate;
-      let dateTime = moment(createdDate, "DD/MM/YYYY h:mm:ss");
+      let dateTime = moment(this.germplasm!.additionalInfo!.createdDate!, "DD/MM/YYYY h:mm:ss");
       return dateTime.format("DD/MM/YYYY");
     }
     return "";

From 242f44fc033e64e3d1651aa314fd0947c7786a99 Mon Sep 17 00:00:00 2001
From: HMS17 <84345306+HMS17@users.noreply.github.com>
Date: Thu, 7 Apr 2022 14:47:29 -0400
Subject: [PATCH 09/11] Cleanup

---
 src/views/germplasm/GermplasmDetails.vue | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/src/views/germplasm/GermplasmDetails.vue b/src/views/germplasm/GermplasmDetails.vue
index ced01627f..187a2d971 100644
--- a/src/views/germplasm/GermplasmDetails.vue
+++ b/src/views/germplasm/GermplasmDetails.vue
@@ -1,3 +1,20 @@
+<!--
+  - See the NOTICE file distributed with this work for additional information
+  - regarding copyright ownership.
+  -
+  - 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>
   <div class="germplasm">
     <router-link v-bind:to="{name: 'germplasm-all', params: {programId: activeProgram.id}}">

From bedba79aa3e0deb1e316c5c08292a133d837e4a7 Mon Sep 17 00:00:00 2001
From: HMS17 <84345306+HMS17@users.noreply.github.com>
Date: Wed, 13 Apr 2022 11:50:49 -0400
Subject: [PATCH 10/11] Code review fixes

---
 src/breeding-insight/dao/GermplasmDAO.ts      | 23 ++++-----
 .../service/GermplasmService.ts               | 28 ++++-------
 src/breeding-insight/utils/GermplasmUtils.ts  | 46 ++++++++++++++++++
 src/views/germplasm/GermplasmDetails.vue      | 47 +++++++------------
 src/views/germplasm/GermplasmTable.vue        | 13 ++---
 5 files changed, 87 insertions(+), 70 deletions(-)
 create mode 100644 src/breeding-insight/utils/GermplasmUtils.ts

diff --git a/src/breeding-insight/dao/GermplasmDAO.ts b/src/breeding-insight/dao/GermplasmDAO.ts
index f98b0deb3..151777ffe 100644
--- a/src/breeding-insight/dao/GermplasmDAO.ts
+++ b/src/breeding-insight/dao/GermplasmDAO.ts
@@ -15,9 +15,11 @@
  * limitations under the License.
  */
 
-import {BiResponse} from "@/breeding-insight/model/BiResponse";
+import {BiResponse, Response} from "@/breeding-insight/model/BiResponse";
 import * as api from "@/util/api";
 import {PaginationQuery} from "@/breeding-insight/model/PaginationQuery";
+import {Result, ResultGenerator} from "@/breeding-insight/model/Result";
+import {Germplasm} from "@/breeding-insight/brapi/model/germplasm";
 
 export class GermplasmDAO {
 
@@ -42,21 +44,20 @@ export class GermplasmDAO {
         }))
     }
 
-    static getSingleGermplasm(programId: string, germplasmId: string): Promise<BiResponse> {
+    static async getSingleGermplasm(programId: string, germplasmId: string): Promise<Result<Error, Germplasm>> {
         const config: any = {};
         config.url = `${process.env.VUE_APP_BI_API_V1_PATH}/programs/${programId}/brapi/v2/germplasm/${germplasmId}`;
         config.method = 'get';
         config.programId = programId;
         config.germplasmId = germplasmId;
-        config.params = {}; //todo check if needed
+        config.params = {};
 
-        return new Promise<any>(((resolve, reject) => {
-            api.call(config)
-                .then((response: any) => {
-                    resolve(response);
-                }).catch((error) => {
-                reject(error);
-            })
-        }))
+        try {
+            const res = await api.call(config) as Response;
+            let { result } = res.data;
+            return ResultGenerator.success(result);
+        } catch (error) {
+            return ResultGenerator.err(error);
+        }
     }
 }
diff --git a/src/breeding-insight/service/GermplasmService.ts b/src/breeding-insight/service/GermplasmService.ts
index 8a1b99831..fc1933721 100644
--- a/src/breeding-insight/service/GermplasmService.ts
+++ b/src/breeding-insight/service/GermplasmService.ts
@@ -21,6 +21,7 @@ import {PaginationQuery} from "@/breeding-insight/model/PaginationQuery";
 import {PaginationController} from "@/breeding-insight/model/view_models/PaginationController";
 import {GermplasmDAO} from "@/breeding-insight/dao/GermplasmDAO";
 import {Germplasm} from "@/breeding-insight/brapi/model/germplasm";
+import {Result, ResultGenerator} from "@/breeding-insight/model/Result";
 
 export class GermplasmService {
 
@@ -49,25 +50,14 @@ export class GermplasmService {
         }));
     }
 
-    static getSingleGermplasm(programId: string, germplasmId: string): Promise<Germplasm> {
-        return new Promise<Germplasm>(((resolve, reject) => {
-
-            let germplasm: Germplasm;
-
-            if (programId) {
-                GermplasmDAO.getSingleGermplasm(programId, germplasmId).then((response: any) => {
-                    if (response.data) {
-                        germplasm = response.data as Germplasm;
-                    }
-
-                    resolve(germplasm);
-                }).catch((error) => {
-                    reject(error);
-                })
-            } else {
-                reject();
-            }
-        }));
+    static async getSingleGermplasm(programId: string, germplasmId: string): Promise<Result<Error, Germplasm>> {
+        try {
+              if (!programId) throw new Error('Missing or invalid program id');
+              let response: Result<Error, Germplasm> = await GermplasmDAO.getSingleGermplasm(programId, germplasmId);
+              return response;
+          } catch(error) {
+              return ResultGenerator.err(error);
+          }
     }
 
 }
diff --git a/src/breeding-insight/utils/GermplasmUtils.ts b/src/breeding-insight/utils/GermplasmUtils.ts
new file mode 100644
index 000000000..1fd51735c
--- /dev/null
+++ b/src/breeding-insight/utils/GermplasmUtils.ts
@@ -0,0 +1,46 @@
+/*
+ * See the NOTICE file distributed with this work for additional information
+ * regarding copyright ownership.
+ *
+ * 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.
+ */
+
+import moment from "moment";
+import {Germplasm} from "@/breeding-insight/brapi/model/germplasm";
+import {ExternalReferences} from "@/breeding-insight/brapi/model/externalReferences";
+
+export class GermplasmUtils {
+    static getExternalUID(germplasm: Germplasm): string | undefined {
+        let val;
+        if (germplasm.externalReferences && germplasm.seedSource) {
+            val = germplasm.externalReferences!.filter(ref => ref.referenceSource == germplasm.seedSource!)
+                .map(ref => ref.referenceID);
+            return val ? val[0]: "";
+        }
+        return "";
+    }
+
+    static getCreatedDate(germplasm: Germplasm): string | undefined {
+        if (germplasm.additionalInfo && germplasm.additionalInfo.createdDate) {
+            let dateTime = moment(germplasm.additionalInfo!.createdDate!, "DD/MM/YYYY h:mm:ss");
+            return dateTime.format("DD/MM/YYYY");
+        }
+        return "";
+    }
+
+    static getGermplasmUUID(references: ExternalReferences): string | undefined {
+        let val = references.find(ref => ref.referenceSource === process.env.VUE_APP_BI_REFERENCE_SOURCE);
+        return val ? val.referenceID : "";
+    }
+
+}
\ No newline at end of file
diff --git a/src/views/germplasm/GermplasmDetails.vue b/src/views/germplasm/GermplasmDetails.vue
index 187a2d971..cc65b6bd5 100644
--- a/src/views/germplasm/GermplasmDetails.vue
+++ b/src/views/germplasm/GermplasmDetails.vue
@@ -20,12 +20,12 @@
     <router-link v-bind:to="{name: 'germplasm-all', params: {programId: activeProgram.id}}">
       All Germplasm
     </router-link>
-    <p></p>
+    <div class="mb-4"></div>
     <h1 class="title">
       Germplasm Details
     </h1>
 
-    <template v-if="!germplasmLoading">
+    <template v-if="!germplasmLoading && germplasm!=null">
     <div class="columns is-multiline is-align-items-stretch mt-4">
     <article class="column ">
     <section>
@@ -42,9 +42,9 @@
     <article class="column px-2">
       <section>
         <ul style="list-style-type: none;">
-          <li><b>External UID: </b> {{ getExternalUID() }}</li>
+          <li><b>External UID: </b> {{ GermplasmUtils.getExternalUID(germplasm) }}</li>
           <li><b>User: </b> {{ germplasm.additionalInfo.createdBy.userName }}</li>
-          <li><b>Creation Date: </b> {{ getCreatedDate() }}</li>
+          <li><b>Creation Date: </b> {{ GermplasmUtils.getCreatedDate(germplasm) }}</li>
         </ul>
       </section>
     </article>
@@ -93,7 +93,8 @@ import {Program} from "@/breeding-insight/model/Program";
 import GermplasmBase from "@/components/germplasm/GermplasmBase.vue";
 import {Germplasm} from "@/breeding-insight/brapi/model/germplasm";
 import {GermplasmService} from "@/breeding-insight/service/GermplasmService";
-import moment from "moment";
+import {GermplasmUtils} from '@/breeding-insight/utils/GermplasmUtils';
+import { Result } from '@/breeding-insight/model/Result';
 
 @Component({
   components: {},
@@ -101,7 +102,8 @@ import moment from "moment";
     ...mapGetters([
       'activeProgram'
     ])
-  }
+  },
+  data: () => ({GermplasmUtils})
 })
 export default class GermplasmDetails extends GermplasmBase {
 
@@ -114,34 +116,19 @@ export default class GermplasmDetails extends GermplasmBase {
     this.getGermplasm();
   }
 
-  getGermplasm() {
+  async getGermplasm() {
     this.germplasmLoading = true;
-    GermplasmService.getSingleGermplasm(this.activeProgram!.id!, this.germplasmUUID).then((germplasm) => {
-      this.germplasm = germplasm;
-    }).catch((error) => {
+    try {
+      const response: Result<Error, Germplasm> = await GermplasmService.getSingleGermplasm(this.activeProgram!.id!, this.germplasmUUID);
+      if(response.isErr()) throw response.value;
+      this.germplasm = response.value;
+    } catch (err) {
       // Display error that germplasm cannot be loaded
       this.$emit('show-error-notification', 'Error while trying to load germplasm');
-      throw error;
-    }).finally(() => this.germplasmLoading = false);
-  }
-
-  getExternalUID() {
-    let val;
-    if (this.germplasm!.externalReferences && this.germplasm!.seedSource) {
-      val = this.germplasm!.externalReferences!.filter(ref => ref.referenceSource == this.germplasm!.seedSource!)
-          .map(ref => ref.referenceID);
-      return val ? val[0]: "";
+      throw err;
+    } finally {
+      this.germplasmLoading = false
     }
-    return "";
   }
-
-  getCreatedDate(){
-    if (this.germplasm!.additionalInfo && this.germplasm!.additionalInfo.createdDate) {
-      let dateTime = moment(this.germplasm!.additionalInfo!.createdDate!, "DD/MM/YYYY h:mm:ss");
-      return dateTime.format("DD/MM/YYYY");
-    }
-    return "";
-  }
-
 }
 </script>
\ No newline at end of file
diff --git a/src/views/germplasm/GermplasmTable.vue b/src/views/germplasm/GermplasmTable.vue
index f78aeefa6..8c7d0f771 100644
--- a/src/views/germplasm/GermplasmTable.vue
+++ b/src/views/germplasm/GermplasmTable.vue
@@ -38,7 +38,7 @@
         {{ props.row.data.additionalInfo.createdBy.userName }}
       </b-table-column>
       <b-table-column field="germplasmId" v-slot="props" :th-attrs="(column) => ({scope:'col'})">
-        <router-link v-bind:to="{name: 'germplasm-details', params: {programId: activeProgram.id, germplasmId: getGermplasmUUID(props.row.data.externalReferences)}}">
+        <router-link v-bind:to="{name: 'germplasm-details', params: {programId: activeProgram.id, germplasmId: GermplasmUtils.getGermplasmUUID(props.row.data.externalReferences)}}">
           Show Details
         </router-link>
       </b-table-column>
@@ -68,7 +68,7 @@ import {Pagination} from "@/breeding-insight/model/BiResponse";
 import ExpandableTable from "@/components/tables/expandableTable/ExpandableTable.vue";
 import {PaginationController} from "@/breeding-insight/model/view_models/PaginationController";
 import {Pedigree} from "@/breeding-insight/model/import/germplasm/Pedigree";
-import {ExternalReferences} from "@/breeding-insight/brapi/model/externalReferences";
+import {GermplasmUtils} from '@/breeding-insight/utils/GermplasmUtils';
 
 @Component({
   mixins: [validationMixin],
@@ -78,7 +78,7 @@ import {ExternalReferences} from "@/breeding-insight/brapi/model/externalReferen
       'activeProgram'
     ])
   },
-  data: () => ({Trait, StringFormatters, TraitStringFormatters, Pedigree})
+  data: () => ({Trait, StringFormatters, TraitStringFormatters, Pedigree, GermplasmUtils})
 })
 export default class GermplasmTable extends Vue {
 
@@ -115,12 +115,5 @@ export default class GermplasmTable extends Vue {
     }
 
   }
-
-  getGermplasmUUID(references: ExternalReferences){
-    let val = references.find(ref => ref.referenceSource === process.env.VUE_APP_BI_REFERENCE_SOURCE);
-    return val ? val.referenceID : "";
-  }
-
-
 }
 </script>
\ No newline at end of file

From 2f73f76695d2acd86b34d1baf0b43a089bd54425 Mon Sep 17 00:00:00 2001
From: HMS17 <84345306+HMS17@users.noreply.github.com>
Date: Wed, 13 Apr 2022 18:19:00 -0400
Subject: [PATCH 11/11] Code review changes 3

---
 .env.development | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.env.development b/.env.development
index 6535555d4..9fabf4eb6 100644
--- a/.env.development
+++ b/.env.development
@@ -14,4 +14,4 @@ VUE_APP_BI_API_ROOT=${API_BASE_URL}
 VUE_APP_LOG_LEVEL=${WEB_LOG_LEVEL}
 
 # The reference source
-VUE_APP_BI_REFERENCE_SOURCE=breeding-insight.org
+VUE_APP_BI_REFERENCE_SOURCE=breedinginsight.org