1 files changed, 58 insertions, 0 deletions
diff --git a/app/assets/javascripts/vue_shared/components/filtered_search_bar/tokens/weight_token.vue b/app/assets/javascripts/vue_shared/components/filtered_search_bar/tokens/weight_token.vue
new file mode 100644
index 00000000000..72116f0e991
--- /dev/null
+++ b/app/assets/javascripts/vue_shared/components/filtered_search_bar/tokens/weight_token.vue
@@ -0,0 +1,58 @@
+<script>
+import { GlDropdownDivider, GlFilteredSearchSuggestion, GlFilteredSearchToken } from '@gitlab/ui';
+import { DEFAULT_NONE_ANY } from '../constants';
+
+export default {
+  baseWeights: ['0', '1', '2', '3', '4', '5'],
+  components: {
+    GlDropdownDivider,
+    GlFilteredSearchSuggestion,
+    GlFilteredSearchToken,
+  },
+  props: {
+    config: {
+      type: Object,
+      required: true,
+    },
+    value: {
+      type: Object,
+      required: true,
+    },
+  },
+  data() {
+    return {
+      weights: this.$options.baseWeights,
+      defaultWeights: this.config.defaultWeights || DEFAULT_NONE_ANY,
+    };
+  },
+  methods: {
+    updateWeights({ data }) {
+      const weight = parseInt(data, 10);
+      this.weights = Number.isNaN(weight) ? this.$options.baseWeights : [String(weight)];
+    },
+  },
+};
+</script>
+
+<template>
+  <gl-filtered-search-token
+    :config="config"
+    v-bind="{ ...$props, ...$attrs }"
+    v-on="$listeners"
+    @input="updateWeights"
+  >
+    <template #suggestions>
+      <gl-filtered-search-suggestion
+        v-for="weight in defaultWeights"
+        :key="weight.value"
+        :value="weight.value"
+      >
+        {{ weight.text }}
+      </gl-filtered-search-suggestion>
+      <gl-dropdown-divider v-if="defaultWeights.length" />
+      <gl-filtered-search-suggestion v-for="weight of weights" :key="weight" :value="weight">
+        {{ weight }}
+      </gl-filtered-search-suggestion>
+    </template>
+  </gl-filtered-search-token>
+</template>