Merge branch 'feature/MS-773-GrundlagenwissenRedesign' into develop

client/src/__generated__/gql.ts

@@ -24,6 +24,7 @@ const documents = {
     "\n  query ModuleEditModeQuery($slug: String) {\n    module(slug: $slug) {\n      inEditMode @client\n      slug\n    }\n  }\n": types.ModuleEditModeQueryDocument,
     "\n    query ChapterQuery($id: ID!) {\n      chapter(id: $id) {\n        path\n      }\n    }\n  ": types.ChapterQueryDocument,
     "\n    query ContentBlockQuery($id: ID!) {\n      contentBlock(id: $id) {\n        path\n      }\n    }\n  ": types.ContentBlockQueryDocument,
+    "\n        query MeLanguage {\n          me {\n            language @client\n          }\n        }\n      ": types.MeLanguageDocument,
     "\n    query ModuleSnapshotsQuery($slug: String!) {\n      module(slug: $slug) {\n        id\n        title\n        metaTitle\n        slug\n        topic {\n          title\n        }\n        snapshots {\n          ...SnapshotListItem\n        }\n      }\n    }\n  ": types.ModuleSnapshotsQueryDocument,
     "\n  query ModuleSolutions($slug: String) {\n    module(slug: $slug) {\n      solutionsEnabled\n      slug\n    }\n  }\n": types.ModuleSolutionsDocument,
 };
@@ -86,6 +87,10 @@ export function graphql(source: "\n    query ChapterQuery($id: ID!) {\n      cha
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
 export function graphql(source: "\n    query ContentBlockQuery($id: ID!) {\n      contentBlock(id: $id) {\n        path\n      }\n    }\n  "): (typeof documents)["\n    query ContentBlockQuery($id: ID!) {\n      contentBlock(id: $id) {\n        path\n      }\n    }\n  "];
+/**
+ * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
+ */
+export function graphql(source: "\n        query MeLanguage {\n          me {\n            language @client\n          }\n        }\n      "): (typeof documents)["\n        query MeLanguage {\n          me {\n            language @client\n          }\n        }\n      "];
 /**
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */

client/src/__generated__/graphql.ts

@@ -616,6 +616,7 @@ export type InstrumentNode = Node & {
   contents?: Maybe<Scalars['GenericStreamFieldType']['output']>;
   id: Scalars['ID']['output'];
   intro: Scalars['String']['output'];
+  language?: Maybe<Scalars['String']['output']>;
   slug: Scalars['String']['output'];
   title: Scalars['String']['output'];
   type?: Maybe<InstrumentTypeNode>;
@@ -2428,6 +2429,11 @@ export type ContentBlockQueryQueryVariables = Exact<{
 
 export type ContentBlockQueryQuery = { __typename?: 'Query', contentBlock?: { __typename?: 'ContentBlockNode', path?: string | null } | null };
 
+export type MeLanguageQueryVariables = Exact<{ [key: string]: never; }>;
+
+
+export type MeLanguageQuery = { __typename?: 'Query', me?: { __typename?: 'PrivateUserNode', language?: string | null } | null };
+
 export type ModuleSnapshotsQueryQueryVariables = Exact<{
   slug: Scalars['String']['input'];
 }>;
@@ -2456,5 +2462,6 @@ export const ModuleTitleQueryDocument = {"kind":"Document","definitions":[{"kind
 export const ModuleEditModeQueryDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"ModuleEditModeQuery"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"slug"}},"type":{"kind":"NamedType","name":{"kind":"Name","value":"String"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"module"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"slug"},"value":{"kind":"Variable","name":{"kind":"Name","value":"slug"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"inEditMode"},"directives":[{"kind":"Directive","name":{"kind":"Name","value":"client"}}]},{"kind":"Field","name":{"kind":"Name","value":"slug"}}]}}]}}]} as unknown as DocumentNode<ModuleEditModeQueryQuery, ModuleEditModeQueryQueryVariables>;
 export const ChapterQueryDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"ChapterQuery"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"id"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"ID"}}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"chapter"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"id"},"value":{"kind":"Variable","name":{"kind":"Name","value":"id"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"path"}}]}}]}}]} as unknown as DocumentNode<ChapterQueryQuery, ChapterQueryQueryVariables>;
 export const ContentBlockQueryDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"ContentBlockQuery"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"id"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"ID"}}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"contentBlock"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"id"},"value":{"kind":"Variable","name":{"kind":"Name","value":"id"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"path"}}]}}]}}]} as unknown as DocumentNode<ContentBlockQueryQuery, ContentBlockQueryQueryVariables>;
+export const MeLanguageDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"MeLanguage"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"me"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"language"},"directives":[{"kind":"Directive","name":{"kind":"Name","value":"client"}}]}]}}]}}]} as unknown as DocumentNode<MeLanguageQuery, MeLanguageQueryVariables>;
 export const ModuleSnapshotsQueryDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"ModuleSnapshotsQuery"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"slug"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"String"}}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"module"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"slug"},"value":{"kind":"Variable","name":{"kind":"Name","value":"slug"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"title"}},{"kind":"Field","name":{"kind":"Name","value":"metaTitle"}},{"kind":"Field","name":{"kind":"Name","value":"slug"}},{"kind":"Field","name":{"kind":"Name","value":"topic"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"title"}}]}},{"kind":"Field","name":{"kind":"Name","value":"snapshots"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"FragmentSpread","name":{"kind":"Name","value":"SnapshotListItem"}}]}}]}}]}},{"kind":"FragmentDefinition","name":{"kind":"Name","value":"SnapshotListItem"},"typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"SnapshotNode"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"shared"}}]}}]} as unknown as DocumentNode<ModuleSnapshotsQueryQuery, ModuleSnapshotsQueryQueryVariables>;
 export const ModuleSolutionsDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"ModuleSolutions"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"slug"}},"type":{"kind":"NamedType","name":{"kind":"Name","value":"String"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"module"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"slug"},"value":{"kind":"Variable","name":{"kind":"Name","value":"slug"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"solutionsEnabled"}},{"kind":"Field","name":{"kind":"Name","value":"slug"}}]}}]}}]} as unknown as DocumentNode<ModuleSolutionsQuery, ModuleSolutionsQueryVariables>;

client/src/components/content-blocks/assignment/FinalSubmission.vue

@@ -71,7 +71,7 @@ export default {
     padding: 15px;
     font-size: toRem(17px);
     font-family: $sans-serif-font-family;
-    margin-bottom: 20px;
+    margin-bottom: $medium-spacing;
     font-weight: $font-weight-regular;
 
     overflow-wrap: break-word;
@@ -90,10 +90,10 @@ export default {
   }
 
   &__explanation-icon {
-    width: 40px;
+    width: $large-icon-dimension;
-    height: 40px;
+    height: $large-icon-dimension;
     fill: $color-brand;
-    margin-right: 8px;
+    margin-right: $small-spacing;
   }
 
   &__explanation-text {

client/src/components/icons/SearchMagnifyingGlass.vue

@@ -0,0 +1,12 @@
+`<template>
+  <svg
+    data-name="shape"
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 100 100"
+  >
+    <path
+      d="m82.3799,17.6201c-6.5254-6.5264-15.2012-10.1201-24.4297-10.1201s-17.9053,3.5938-24.4307,10.1201c-6.5264,6.5254-10.1201,15.2012-10.1201,24.4297,0,8.3906,2.9788,16.3176,8.4223,22.5933l-23.5893,23.5894c-.9766.9766-.9766,2.5586,0,3.5352.4883.4883,1.1279.7324,1.7676.7324s1.2793-.2441,1.7676-.7324l23.5893-23.5894c6.2757,5.4436,14.2028,8.4224,22.5933,8.4224,9.2285,0,17.9043-3.5938,24.4297-10.1201,6.5254-6.5254,10.1201-15.2021,10.1201-24.4307s-3.5938-17.9043-10.1201-24.4297Zm-3.5352,45.3252c-5.5811,5.5811-13.002,8.6553-20.8945,8.6553s-15.3145-3.0742-20.8955-8.6553-8.6553-13.002-8.6553-20.8955,3.0742-15.3135,8.6553-20.8945,13.002-8.6553,20.8955-8.6553,15.3135,3.0742,20.8945,8.6553,8.6553,13.002,8.6553,20.8945-3.0742,15.3145-8.6553,20.8955Z"
+    />
+  </svg>
+</template>
+`

client/src/components/instruments/FilterBar.vue

@@ -0,0 +1,66 @@
+<template>
+  <div class="filter-bar">
+    <div class="filter-bar__input-wrapper">
+      <input
+        class="filter-bar__search-input skillbox-input"
+        type="text"
+        placeholder="Suchbegriff eingeben..."
+        ref="searchInputRef"
+        v-model="searchQuery"
+        @input="updateSearchQuery"
+      />
+      <search-magnifying-glass class="filter-bar__search-icon"></search-magnifying-glass>
+    </div>
+    <language-switcher class="filter-bar__language-selection" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted } from 'vue';
+import SearchMagnifyingGlass from '@/components/icons/SearchMagnifyingGlass.vue';
+import LanguageSwitcher from '@/components/LanguageSwitcher.vue';
+
+const searchQuery = ref('');
+const searchInputRef = ref(null);
+
+const emit = defineEmits(['update:searchQuery']);
+
+const updateSearchQuery = () => {
+  emit('update:searchQuery', searchQuery.value);
+};
+
+onMounted(() => {
+  searchInputRef.value?.focus();
+});
+</script>
+
+<style scoped lang="scss">
+@import 'styles/helpers';
+
+.filter-bar {
+  display: flex;
+  margin-bottom: $large-spacing;
+
+  &__input-wrapper {
+    position: relative;
+  }
+
+  &__search-input {
+    width: $medium-input-width;
+    border: 1px solid $color-silver;
+  }
+
+  &__search-icon {
+    position: absolute;
+    width: $default-icon-dimension;
+    height: $default-icon-dimension;
+    right: $medium-spacing;
+    top: 50%;
+    transform: translateY(-50%);
+  }
+
+  &__language-selection {
+    margin-left: auto;
+  }
+}
+</style>

client/src/components/instruments/FilterGroup.vue

@@ -9,7 +9,7 @@
       :id="category.id"
       @filter="setCategoryFilter(category.id)"
     />
-    <div class="filter-group__children">
+    <div class="filter-group__children" v-if="$flavor.showInstrumentSubCategories">
       <filter-entry
         :data-cy="`filter-${type.type}`"
         :category="type.category"
@@ -26,9 +26,7 @@
 <script>
 import { defineComponent } from 'vue';
 import FilterEntry from '@/components/instruments/FilterEntry.vue';
-
 import SET_FILTER_MUTATION from 'gql/local/mutations/setInstrumentFilter.gql';
-import INSTRUMENT_FILTER_QUERY from 'gql/local/instrumentFilter.gql';
 
 export default defineComponent({
   props: {
@@ -48,20 +46,6 @@ export default defineComponent({
   components: {
     FilterEntry,
   },
-
-  apollo: {
-    instrumentFilter: {
-      query: INSTRUMENT_FILTER_QUERY,
-    },
-  },
-
-  data() {
-    return {
-      instrumentFilter: {
-        currentFilter: '',
-      },
-    };
-  },
   inheritAttrs: false,
 
   methods: {

client/src/components/modules/Module.vue

@@ -13,7 +13,7 @@
           {{ module.metaTitle }}
         </h2>
 
-      <div class="module__categoryindicators">
+      <div class="module__categoryindicators" v-if="$flavor.showModuleFilter">
         <pill :text="module.level?.name"></pill>
         <pill :text="module.category?.name"></pill>
       </div>

client/src/components/modules/ModuleFilter.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="module-filter">
-    <div class="module-filter__filter-selection">
+    <div class="module-filter__filter-selection" v-if="$flavor.showModuleFilter">
       <Dropdown
         class="module-filter__dropdown"
         :selected-item="selectedLevel"
@@ -17,6 +17,11 @@
 
       <language-switcher class="module-filter__language-switcher" />
     </div>
+    <info-message
+      class="module-filter__no-modules-text"
+      v-if="modules.length > 1 && filteredModules.length === 0"
+      >Für die ausgewählten Filtereinstellungen sind keine {{ $flavor.textModules }} vorhanden
+    </info-message>
     <div class="topic__modules">
       <module-teaser
         v-for="module in filteredModules"
@@ -35,6 +40,7 @@ import Dropdown from '@/components/ui/Dropdown.vue';
 import LanguageSwitcher from '@/components/LanguageSwitcher.vue';
 import { graphql } from '@/__generated__';
 import { ModuleCategoryNode, ModuleLevelNode, ModuleNode, PrivateUserNode } from '@/__generated__/graphql';
+import InfoMessage from '@/components/ui/InfoMessage.vue';
 
 const props = defineProps<{
   modules: ModuleNode[];
@@ -113,15 +119,14 @@ const updateLevel = (level: ModuleLevelNode) => {
 };
 
 const filterByLevel = (module: ModuleNode, level: ModuleLevelNode) => {
-  return level.filterAttributeType === 'ALL' || module.level?.id === level.id;
+  return level.filterAttributeType === 'ALL' || module.level?.id === level.id || !module.level;
 };
 
 const filterByCategory = (module: ModuleNode, category: ModuleCategoryNode) => {
-  return category.filterAttributeType === 'ALL' || module.category?.id === category.id;
+  return category.filterAttributeType === 'ALL' || module.category?.id === category.id || !module.category;
 };
 
 const filterByLanguage = (module: ModuleNode, language: string) => {
-  // TODO: implement filter by language here.
   return module.language === language;
 };
 
@@ -155,13 +160,11 @@ const updateLastModuleLevelUser = (moduleLevel: ModuleLevelNode) => {
 @import 'styles/helpers';
 
 .module-filter {
-  // TODO: how do I correcty set the with of the whole thig including the grid for the modules?
-  // TODO: Farbe des Arrows für Dropdowns muss platfrom habhängig sein MS-775
-
   &__filter-selection {
     display: flex;
     justify-content: flex-start;
     column-gap: $medium-spacing;
+    margin-bottom: $medium-spacing;
   }
 
   &__dropdown {

client/src/components/modules/ModuleTeaser.vue

@@ -15,7 +15,7 @@
       <p class="module-teaser__description">
         {{ teaser }}
       </p>
-      <div class="module-teaser__pills">
+      <div class="module-teaser__pills" v-if="$flavor.showModuleFilter">
         <pill :text="level?.name"></pill>
         <pill :text="category?.name"></pill>
       </div>

client/src/components/ui/InfoMessage.vue

@@ -0,0 +1,33 @@
+<template>
+  <div class="info-message">
+    <info-icon class="info-message__icon" />
+    <span class="info-message__text"><slot></slot> </span>
+  </div>
+</template>
+
+<script setup lang="ts">
+import InfoIcon from '@/components/icons/InfoIcon.vue';
+</script>
+
+
+<style scoped lang="scss">
+@import 'styles/helpers';
+
+.info-message {
+  display: flex;
+  align-items: center;
+
+  &__icon {
+    width: $large-icon-dimension;
+    height: $large-icon-dimension;
+    fill: $color-brand;
+    margin-right: $small-spacing;
+  }
+
+  &__text {
+    @include regular-text;
+    color: $color-brand;
+    margin-right: $medium-spacing;
+  }
+}
+</style>

client/src/graphql/gql/fragments/instrumentParts.gql

@@ -3,6 +3,7 @@ fragment InstrumentParts on InstrumentNode {
   title
   intro
   slug
+  language
   bookmarks {
     uuid
     note {

client/src/graphql/gql/queries/instrumentsQuery.gql

@@ -4,6 +4,7 @@ query InstrumentsQuery {
     title
     contents
     slug
+    language
     type {
       id
       type

client/src/helpers/app-flavor.constants.ts

@@ -20,9 +20,11 @@ export const defaultFlavorValues: FlavorValues = {
   showFooter: true,
   showObjectivesTitle: true,
   showInstrumentFilterSidebar: true,
+  showInstrumentSubCategories: true,
   showPortfolio: true,
   showEHB: true,
   helloIllustration: 'HelloIllustration',
+  showModuleFilter: false,
 };
 
 export const myKvValues: FlavorValues = {
@@ -46,8 +48,10 @@ export const myKvValues: FlavorValues = {
   showObjectivesTitle: false,
   showInstrumentFilterSidebar: true,
   showPortfolio: true,
+  showInstrumentSubCategories: false,
   showEHB: false,
   helloIllustration: 'HelloMyKVIllustration',
+  showModuleFilter: true,
 };
 
 export const dhaValues: FlavorValues = Object.assign({}, myKvValues, {

client/src/helpers/types.ts

@@ -14,7 +14,9 @@ export interface FlavorValues {
   showFooter: boolean;
   showObjectivesTitle: boolean;
   showInstrumentFilterSidebar: boolean;
+  showInstrumentSubCategories: boolean;
   showPortfolio: boolean;
   showEHB: boolean;
   helloIllustration: string;
+  showModuleFilter: boolean;
 }

client/src/pages/instrumentOverview.vue

@@ -10,6 +10,17 @@
       v-else
     />
     <div class="instrument-overview__list">
+      <filter-bar
+        :search-query="searchText"
+        @update:searchQuery="(val) => (searchText = val)"
+      ></filter-bar>
+
+      <info-message
+        class="instrument-overview__no-instruments"
+        v-if="instruments.length > 1 && filteredInstruments.length === 0"
+      >
+        Für die ausgewählten Filtereinstellungen sind keine Einträge vorhanden
+      </info-message>
       <router-link
         :to="{ name: 'instrument', params: { slug: instrument.slug } }"
         data-cy="instrument"
@@ -27,9 +38,16 @@ import InstrumentFilter from '@/components/instruments/InstrumentFilter.vue';
 import InstrumentEntry from '@/components/instruments/InstrumentEntry.vue';
 import INSTRUMENTS_QUERY from '@/graphql/gql/queries/instrumentsQuery.gql';
 import INSTRUMENT_FILTER_QUERY from 'gql/local/instrumentFilter.gql';
+import FilterBar from '@/components/instruments/FilterBar.vue';
+import { graphql } from '@/__generated__';
+import InfoIcon from '@/components/icons/InfoIcon.vue';
+import InfoMessage from '@/components/ui/InfoMessage.vue';
 
 export default {
   components: {
+    InfoMessage,
+    InfoIcon,
+    FilterBar,
     InstrumentFilter,
     InstrumentEntry,
   },
@@ -58,6 +76,15 @@ export default {
         return instrumentFilter;
       },
     },
+    me: {
+      query: graphql(`
+        query MeLanguage {
+          me {
+            language @client
+          }
+        }
+      `),
+    },
   },
 
   data() {
@@ -67,12 +94,20 @@ export default {
       instrumentFilter: {
         currentFilter: '',
       },
+      searchText: '',
+      me: { language: 'de' },
     };
   },
 
   computed: {
     filteredInstruments() {
-      return this.instruments.filter((i) => this.filter(i));
+      // Filter by category and category type
+      let instruments = this.instruments.filter((i) => this.filter(i));
+      // Filter by language
+      instruments = instruments.filter((i) => i.language === this.me.language);
+      // Filter by search text
+      instruments = instruments.filter((i) => i.title.toLowerCase().includes(this.searchText.toLowerCase()));
+      return instruments;
     },
   },
 
@@ -110,7 +145,6 @@ export default {
 
   &__list-item {
     padding: $medium-spacing 0;
-
     @include regular-text;
     @include table-row($color-silver);
   }

client/src/styles/_variables.scss

@@ -83,7 +83,11 @@ $popover-default-bottom: -110px;
 $footer-width: 800px;
 $news-width: 550px;
 
+
+$medium-input-width: 380px;
+
 $screen-width: 1200px;
 
-$default-icon-dimension: 25px;
 $small-icon-dimension: 14px;
+$default-icon-dimension: 25px;
+$large-icon-dimension: 40px;

server/basicknowledge/queries.py

@@ -44,6 +44,7 @@ class InstrumentNode(DjangoObjectType):
     bookmarks = graphene.List(InstrumentBookmarkNode)
     type = graphene.Field(InstrumentTypeNode)
     contents = GenericStreamFieldType()
+    language = graphene.String()
 
     class Meta:
         model = BasicKnowledge
@@ -63,6 +64,9 @@ class InstrumentNode(DjangoObjectType):
             instrument=self
         )
 
+    def resolve_language(self, info, **kwargs):
+        return self.locale.language_code
+
 
 class InstrumentQuery(object):
     instrument = graphene.Field(InstrumentNode, slug=graphene.String(), id=graphene.ID())

server/schema.graphql

@@ -559,6 +559,7 @@ type InstrumentNode implements Node {
   id: ID!
   bookmarks: [InstrumentBookmarkNode]
   type: InstrumentTypeNode
+  language: String
 }
 
 type InstrumentNodeConnection {