Merge pull request #1346 from microbiomedata/1303-add-gold-tooltip

1303 add gold tooltip

web/package.json

@@ -78,6 +78,7 @@
     "sass-loader": "^10.1.1",
     "typescript": "^4.5.3",
     "vue-cli-plugin-vuetify": "^2.4.5",
+    "vue-cli-plugin-yaml": "^1.0.2",
     "vue-template-compiler": "^2.6.14",
     "vuetify-loader": "^1.7.3"
   },

web/src/components/FacetedSearch.vue

@@ -1,6 +1,10 @@
 <script lang="ts">
 import Vue, { PropType } from 'vue';
 import { groupBy } from 'lodash';
+
+// @ts-ignore
+import NmdcSchema from 'nmdc-schema/nmdc_schema/nmdc_materialized_patterns.yaml';
+
 import { fieldDisplayName } from '@/util';
 import * as encoding from '@/encoding';
 import { Condition, entityType } from '@/data/api';
@@ -76,6 +80,11 @@ export default Vue.extend({
           return ai - bi;
         });
     },
+    goldDescription() {
+      // @ts-ignore
+      const schema = NmdcSchema.slots.gold_path_field;
+      return schema.annotations.tooltip.value || '';
+    },
   },
   methods: {
     fieldDisplayName,
@@ -130,6 +139,24 @@ export default Vue.extend({
           v-show="groupedFields.length > 1 && filteredFields.length > 0"
         >
           {{ groupname !== 'undefined' ? groupname : 'Other' }}
+          <v-tooltip
+            v-if="groupname === 'GOLD Ecosystems'"
+            right
+            open-delay="600"
+          >
+            <template #activator="{ on, attrs }">
+              <v-btn
+                icon
+                x-small
+                v-bind="attrs"
+                class="ml-2"
+                v-on="on"
+              >
+                <v-icon>mdi-help-circle</v-icon>
+              </v-btn>
+            </template>
+            <span> {{ goldDescription }}</span>
+          </v-tooltip>
         </v-subheader>
         <template v-for="sf in filteredFields">
           <v-menu

web/src/components/MenuContent.vue

@@ -2,10 +2,11 @@
 import {
   defineComponent, PropType, onBeforeUnmount, computed,
 } from '@vue/composition-api';
-import NmdcSchema from 'nmdc-schema/nmdc_schema/nmdc.schema.json';
+// @ts-ignore
+import NmdcSchema from 'nmdc-schema/nmdc_schema/nmdc_materialized_patterns.yaml';
 
 import { fieldDisplayName } from '@/util';
-import { getField, types } from '@/encoding';
+import { getField } from '@/encoding';
 import FacetSummaryWrapper from '@/components/Wrappers/FacetSummaryWrapper.vue';
 import FilterDate from '@/components/Presentation/FilterDate.vue';
 import FilterFloat from '@/components/Presentation/FilterFloat.vue';
@@ -59,12 +60,13 @@ export default defineComponent({
 
     const description = computed(() => {
       const fieldSchemaName = getField(props.field, props.table);
-      const { schemaName } = types[props.table];
+      const schemaName = fieldSchemaName.schemaName || props.field;
       if (schemaName !== undefined) {
-        // @ts-ignore
-        const schema = NmdcSchema.$defs[schemaName];
-        // @ts-ignore
-        return schema.properties?.[fieldSchemaName.schemaName || props.field]?.description || '';
+        const schema = NmdcSchema.classes[schemaName] || NmdcSchema.slots[schemaName];
+        // Avoid restating the field name as a description
+        if (schema && schema.description !== schemaName) {
+          return schema?.description || '';
+        }
       }
       return '';
     });

web/src/data/api.ts

@@ -1,7 +1,8 @@
 import { merge } from 'lodash';
 import axios, { AxiosError } from 'axios';
 import { setupCache } from 'axios-cache-adapter';
-import NmdcSchema from 'nmdc-schema/nmdc_schema/nmdc.schema.json';
+// @ts-ignore
+import NmdcSchema from 'nmdc-schema/nmdc_schema/nmdc_materialized_patterns.yaml';
 import { clearRefreshToken, getRefreshToken, setRefreshToken } from '@/store/localStorage';
 
 // The token refresh and retry logic stores an extra bit of state on the request config
@@ -60,7 +61,7 @@ export type entityType = 'biosample'
  * we get build-time typescript support for the dynamic types coming
  * out of an entirely different repository.
  */
-export type entitySchemaType = keyof typeof NmdcSchema.$defs;
+export type entitySchemaType = keyof typeof NmdcSchema.classes;
 
 export interface BaseSearchResult {
   id: string;

web/src/views/Search/SearchSidebar.vue

@@ -2,7 +2,8 @@
 import {
   computed, defineComponent, ref, watch,
 } from '@vue/composition-api';
-import NmdcSchema from 'nmdc-schema/nmdc_schema/nmdc.schema.json';
+// @ts-ignore
+import NmdcSchema from 'nmdc-schema/nmdc_schema/nmdc_materialized_patterns.yaml';
 
 import { types } from '@/encoding';
 import {
@@ -120,11 +121,12 @@ export default defineComponent({
       const { schemaName } = types.biosample;
       if (schemaName !== undefined) {
         // @ts-ignore
-        const schema = NmdcSchema.$defs[schemaName];
+        const schema = NmdcSchema.classes[schemaName];
         return schema.description || '';
       }
       return '';
     });
+
     api.getDatabaseSummary().then((s) => { dbSummary.value = s; });
 
     function dbSummaryForTable(table: entityType, field: string) {

web/src/views/SubmissionPortal/Components/StudyForm.vue

@@ -1,5 +1,6 @@
 <script lang="ts">
-import NmdcSchema from 'nmdc-schema/nmdc_schema/nmdc.schema.json';
+// @ts-ignore
+import NmdcSchema from 'nmdc-schema/nmdc_schema/nmdc_materialized_patterns.yaml';
 import {
   computed,
   defineComponent,
@@ -123,7 +124,7 @@ export default defineComponent({
       <submission-docs-link anchor="study" />
     </div>
     <div class="text-h5">
-      {{ NmdcSchema.$defs.Study.description }}
+      {{ NmdcSchema.classes.Study.description }}
     </div>
     <submission-permission-banner
       v-if="!canEditSubmissionMetadata()"
@@ -317,7 +318,7 @@ export default defineComponent({
             <v-select
               v-model="contributor.roles"
               :rules="[v => v.length >= 1 || 'At least one role is required']"
-              :items="NmdcSchema.$defs.CreditEnum.enum"
+              :items="Object.keys(NmdcSchema.enums.CreditEnum.permissible_values)"
               label="CRediT Roles *"
               :hint="Definitions.contributorRoles"
               deletable-chips

web/src/views/SubmissionPortal/Components/SubmissionContextForm.vue

@@ -6,7 +6,8 @@ import {
   watch,
   nextTick,
 } from '@vue/composition-api';
-import NmdcSchema from 'nmdc-schema/nmdc_schema/nmdc.schema.json';
+// @ts-ignore
+import NmdcSchema from 'nmdc-schema/nmdc_schema/nmdc_materialized_patterns.yaml';
 import Definitions from '@/definitions';
 import {
   contextForm,
@@ -23,7 +24,7 @@ export default defineComponent({
   components: { SubmissionContextShippingForm, SubmissionDocsLink, SubmissionPermissionBanner },
   setup() {
     const formRef = ref();
-    const facilityEnum = NmdcSchema.$defs.ProcessingInstitutionEnum.enum.filter(
+    const facilityEnum = Object.keys(NmdcSchema.enums.processing_institution_enum.permissible_values).filter(
       (facility: string) => ['EMSL', 'JGI'].includes(facility),
     );
     const projectAwardValidationRules = () => [(v: string) => {

web/src/views/SubmissionPortal/Components/SubmissionContextShippingForm.vue

@@ -7,7 +7,8 @@ import {
   ref,
   watch,
 } from '@vue/composition-api';
-import NmdcSchema from 'nmdc-schema/nmdc_schema/nmdc.schema.json';
+// @ts-ignore
+import NmdcSchema from 'nmdc-schema/nmdc_schema/nmdc_materialized_patterns.yaml';
 import {
   addressForm,
   addressFormValid,
@@ -24,7 +25,7 @@ export default defineComponent({
     const showAddressForm = ref(false);
     const datePicker = ref(false);
     const sampleItems = ref(['water_extract_soil']);
-    const sampleEnumValues = NmdcSchema.$defs.SampleTypeEnum.enum;
+    const sampleEnumValues = Object.keys(NmdcSchema.enums.SampleTypeEnum.permissible_values);
     const biosafetyLevelValues = Object.values(BiosafetyLevels);
     const shippingConditionsItems = [
       'Store frozen: transported within a cold chain and stored at -70°C to -80°C upon delivery.',

web/yarn.lock

@@ -6873,6 +6873,11 @@ jsesc@~0.5.0:
   resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-0.5.0.tgz#e7dee66e35d6fc16f710fe91d5cf69f70f08911d"
   integrity sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0=
 
+json-loader@^0.5.7:
+  version "0.5.7"
+  resolved "https://registry.yarnpkg.com/json-loader/-/json-loader-0.5.7.tgz#dca14a70235ff82f0ac9a3abeb60d337a365185d"
+  integrity sha512-QLPs8Dj7lnf3e3QYS1zkCo+4ZwqOiF9d/nZnYozTISxXWCfNs9yuky5rJw4/W34s7POaNlbZmQGaB5NiXCbP4w==
+
 json-parse-better-errors@^1.0.1, json-parse-better-errors@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz#bb867cfb3450e69107c131d1c514bab3dc8bcaa9"
@@ -10651,6 +10656,14 @@ vue-cli-plugin-vuetify@^2.4.5:
     semver "^7.1.2"
     shelljs "^0.8.3"
 
+vue-cli-plugin-yaml@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/vue-cli-plugin-yaml/-/vue-cli-plugin-yaml-1.0.2.tgz#f87fad162a4545e498febdc26d7b76941b7b6a54"
+  integrity sha512-gdPdHWjLyynzy97krmeSBDarkoYO8MVZUYu38CthNvLDBL+xJoM1jclBneI85x2nLtnqfaf753nMnsV6iIDl3A==
+  dependencies:
+    json-loader "^0.5.7"
+    yaml-loader "^0.6.0"
+
 vue-eslint-parser@^7.0.0:
   version "7.11.0"
   resolved "https://registry.yarnpkg.com/vue-eslint-parser/-/vue-eslint-parser-7.11.0.tgz#214b5dea961007fcffb2ee65b8912307628d0daf"
@@ -11140,7 +11153,15 @@ yallist@^4.0.0:
   resolved "https://registry.yarnpkg.com/yallist/-/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72"
   integrity sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==
 
-yaml@^1.7.2:
+yaml-loader@^0.6.0:
+  version "0.6.0"
+  resolved "https://registry.yarnpkg.com/yaml-loader/-/yaml-loader-0.6.0.tgz#fe1c48b9f4803dace55a59a1474e790ba6ab1b48"
+  integrity sha512-1bNiLelumURyj+zvVHOv8Y3dpCri0F2S+DCcmps0pA1zWRLjS+FhZQg4o3aUUDYESh73+pKZNI18bj7stpReow==
+  dependencies:
+    loader-utils "^1.4.0"
+    yaml "^1.8.3"
+
+yaml@^1.7.2, yaml@^1.8.3:
   version "1.10.2"
   resolved "https://registry.yarnpkg.com/yaml/-/yaml-1.10.2.tgz#2301c5ffbf12b467de8da2333a459e29e7920e4b"
   integrity sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==