[BI-85,BI-646] - Create new trait UI #58

ctucker3 · 2020-11-30T16:32:58Z

Adds the ability to create a basic trait from the UI.

Error display is not implemented yet, so you will get a generic error when trait creation fails. Open the developer console to see the errors printed out. You might need the console open before submitting for the errors to be printed.

Some scale classes may fail because the specific scale additionals aren't in there yet. You will get errors like "Missing categories for scale class 'Categories'" or something along those lines.

Some updates to the components. One to allow hiding of the label. One to allow the select field component to accept strings and objects.

nickpalladino

Form looks good, on mobile too.

nickpalladino · 2020-12-01T19:00:41Z

src/breeding-insight/dao/ProgramDAO.ts

+  static async getObservationLevels(programId: string): Promise<BiResponse> {
+
+    const { data } =  await api.call({
+      url: `${process.env.VUE_APP_BI_API_V1_PATH}/programs/${programId}/observation_level`,


I think this should be /programs/${programId}/observation-levels to be consistent with other endpoints.

Yep, good catch. Changed and pushed.

nickpalladino · 2020-12-01T19:16:55Z

src/breeding-insight/service/TraitService.ts

@@ -48,6 +54,8 @@ export class TraitService {
          let traits: Trait[] = [];

          if (biResponse.result.data) {
+            //TODO: Remove when backend default sorting is implemented
+            biResponse.result.data = PaginationController.mockSortRecords(biResponse.result.data);


Messin with my field book stuff man, haha. Think I removed this so that the order in bi-web and in field book matched but not a big deal if it's needed.

I think this is needed for now to show the new trait at the top when it is added from the new trait from. Otherwise, it could appear on a different page and the user wouldn't see it.

Ah ya, that's right. Now you can do that on this page.

nickpalladino · 2020-12-01T22:00:26Z

src/components/trait/forms/BaseTraitForm.vue

+    this.$emit('trait-change', val);
+  }
+
+  filteredDataObj(data: string[]): string[] {


May be a nice to have but this seems to match any letter in the observation level rather than a sequence starting with the first letter.

Yeah it should match any substring with the options. So if typed, lo that should match Plot and Lot and Slot and.... well I'll stop showing off my rhyming skills! When I'm on the interwebs, I usually like search bars like this instead of stricter search bars that search from the beginning.

ok, works for me.

nickpalladino · 2020-12-02T18:32:33Z

src/breeding-insight/dao/ProgramDAO.ts

+  static async getObservationLevels(programId: string): Promise<BiResponse> {
+
+    const { data } =  await api.call({
+      url: `${process.env.VUE_APP_BI_API_V1_PATH}/programs/${programId}/observation-level`,


can you add an 's' making it observation-levels

changed and pushed

nickpalladino · 2020-12-02T18:34:10Z

src/breeding-insight/model/Scale.ts

@@ -18,7 +18,6 @@
 import {Category} from "@/breeding-insight/model/Category";

 export enum DataType {
-  Code = "CODE",


This is used in TraitDetailPanel, granted it's not really doing anything with it at this point.

timparsons

Looks great!! I did have a couple of things:

I accidentally ran into an issue where I clicked "Save" twice before the form closed (for whatever reason the app was being slow the first time I tried saving), and the trait table was updated. After the table was updated, I had two records with duplicate information. I verified this again, and was indeed able to create identical traits by double clicking the "Save" button. @ctucker3 and I talked about this, and agreed that it would be best to disable the "Save" button after it's clicked to prevent double clicking, AND to add database constraints to check for uniqueness in the case that two identical trait POST requests are made simultaneously.
For the observation level input, I noticed that the autocomplete values are visible when focus is put on the input. It wasn't obvious to me that a new observation level could be made by typing it into the input. @eawoods could messaging be added to the input (or maybe even in the autocomplete box), and what should that look like?

timparsons · 2020-12-02T20:37:56Z

src/breeding-insight/dao/ProgramDAO.ts

+  static async getObservationLevels(programId: string): Promise<BiResponse> {
+
+    const { data } =  await api.call({
+      url: `${process.env.VUE_APP_BI_API_V1_PATH}/programs/${programId}/observation-level`,


timparsons · 2020-12-02T21:01:21Z

src/components/trait/TraitListsTable.vue

+  private methodClassOptions: string[] = Object.values(MethodClass);
+  private observationLevelOptions?: string[];
+  private scaleClassOptions: string[] = Object.values(DataType);


Would it be possible to change the method and scale classes to be arrays of option -> {id: <enum value>, name: <enum but with only first letter capitalized>}?

changed and pushed

eawoods · 2020-12-03T17:59:44Z

For the observation level input, I noticed that the autocomplete values are visible when focus is put on the input. It wasn't obvious to me that a new observation level could be made by typing it into the input. @eawoods could messaging be added to the input (or maybe even in the autocomplete box), and what should that look like?

How about having placeholder text in the field that says "Start typing to see suggestions" ?

ctucker3 · 2020-12-04T16:26:36Z

Looks great!! I did have a couple of things:

I accidentally ran into an issue where I clicked "Save" twice before the form closed (for whatever reason the app was being slow the first time I tried saving), and the trait table was updated. After the table was updated, I had two records with duplicate information. I verified this again, and was indeed able to create identical traits by double clicking the "Save" button. @ctucker3 and I talked about this, and agreed that it would be best to disable the "Save" button after it's clicked to prevent double clicking, AND to add database constraints to check for uniqueness in the case that two identical trait POST requests are made simultaneously.

My database constraints didn't work with the double click, although they would work with a regular query. I'm thinking those queries are being executed simultaneously so the duplicates aren't being caught. I created a new card to look into this:

https://breedinginsight.atlassian.net/browse/BI-689

The prevention of the double click on the UI is implemented for traits. It needs to be added to the other forms still though.

For the observation level input, I noticed that the autocomplete values are visible when focus is put on the input. It wasn't obvious to me that a new observation level could be made by typing it into the input. @eawoods could messaging be added to the input (or maybe even in the autocomplete box), and what should that look like?

Implemented Liz's suggestion of the placeholder.

github-actions bot added the feature label Nov 30, 2020

ctucker3 force-pushed the feature/BI-85 branch from 502dc86 to e957521 Compare November 30, 2020 16:36

ctucker3 changed the title ~~[BI-85] - Create new trait UI~~ [BI-85,BI-646] - Create new trait UI Nov 30, 2020

ctucker3 requested review from nickpalladino and timparsons November 30, 2020 20:45

Chris T added 4 commits December 1, 2020 10:08

[BI-85] new trait form

0e8db00

[BI-85] fix npm packages after rebase

b4df9b0

[BI-85] set main abbreviation on trait create

a666fa2

[BI-85] remove console.logs

b0ad618

ctucker3 force-pushed the feature/BI-85 branch from 3e77bba to b0ad618 Compare December 1, 2020 15:08

ctucker3 marked this pull request as ready for review December 1, 2020 15:15

nickpalladino requested changes Dec 1, 2020

View reviewed changes

[BI-85] change GET observation levels path

ba916ae

ctucker3 requested a review from nickpalladino December 2, 2020 15:29

[BI-85] small fixes to new trait form code

ca094f2

nickpalladino requested changes Dec 2, 2020

View reviewed changes

timparsons requested changes Dec 2, 2020

View reviewed changes

[BI-85] update call to observation levels

7ad8f40

Chris T added 2 commits December 3, 2020 14:18

[BI-85] code review changes

9a2b2cd

[BI-85] disable save btn on trait create

fa2adb0

ctucker3 requested review from timparsons and nickpalladino December 4, 2020 16:27

timparsons approved these changes Dec 4, 2020

View reviewed changes

nickpalladino approved these changes Dec 7, 2020

View reviewed changes

ctucker3 merged commit 7f0b1f2 into develop Dec 7, 2020

ctucker3 deleted the feature/BI-85 branch December 7, 2020 16:41

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[BI-85,BI-646] - Create new trait UI #58

[BI-85,BI-646] - Create new trait UI #58

ctucker3 commented Nov 30, 2020 •

edited

Loading

nickpalladino left a comment

nickpalladino Dec 1, 2020

ctucker3 Dec 2, 2020

nickpalladino Dec 1, 2020

ctucker3 Dec 2, 2020

nickpalladino Dec 2, 2020

nickpalladino Dec 1, 2020

ctucker3 Dec 2, 2020 •

edited

Loading

nickpalladino Dec 2, 2020

nickpalladino Dec 2, 2020

timparsons Dec 2, 2020

ctucker3 Dec 2, 2020

nickpalladino Dec 2, 2020

ctucker3 Dec 3, 2020

timparsons left a comment

timparsons Dec 2, 2020

timparsons Dec 2, 2020

ctucker3 Dec 3, 2020

eawoods commented Dec 3, 2020

ctucker3 commented Dec 4, 2020

[BI-85,BI-646] - Create new trait UI #58

[BI-85,BI-646] - Create new trait UI #58

Conversation

ctucker3 commented Nov 30, 2020 • edited Loading

nickpalladino left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ctucker3 Dec 2, 2020 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

timparsons left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

eawoods commented Dec 3, 2020

ctucker3 commented Dec 4, 2020

ctucker3 commented Nov 30, 2020 •

edited

Loading

ctucker3 Dec 2, 2020 •

edited

Loading