fix(SettingsSortContacts): update it to latest NcSelect

Signed-off-by: Grigory Vodyanov <[email protected]>

Author: GVodyanov

src/components/AppNavigation/Settings/SettingsSortContacts.vue

@@ -8,14 +8,13 @@
 		<IconList class="settings-line__icon" />
 		<NcSelect
 			id="sort-by"
-			:value="orderKeyOption"
+			v-model="selected"
 			:searchable="false"
 			:allow-empty="false"
 			:options="options"
-			:custom-label="formatSortByLabel"
-			:get-option-key="(option) => option.key"
+			:input-label="t('contacts', 'Sort by')"
 			label="label"
-			@input="sortContacts" />
+			@update:model-value="sortContacts" />
 	</div>
 </template>
 
@@ -31,57 +30,54 @@ export default {
 		IconList,
 	},
 
+	data() {
+		return {
+			selected: null,
+		}
+	},
+
 	computed: {
 		/* Order Keys */
 		options() {
 			return [
 				{
 					label: t('contacts', 'First name'),
-					key: 'firstName',
+					value: 'firstName',
 				},
 				{
 					label: t('contacts', 'Last name'),
-					key: 'lastName',
+					value: 'lastName',
 				},
 				{
 					label: t('contacts', 'Phonetic first name'),
-					key: 'phoneticFirstName',
+					value: 'phoneticFirstName',
 				},
 				{
 					label: t('contacts', 'Phonetic last name'),
-					key: 'phoneticLastName',
+					value: 'phoneticLastName',
 				},
 				{
 					label: t('contacts', 'Display name'),
-					key: 'displayName',
+					value: 'displayName',
 				},
 				{
 					label: t('contacts', 'Last modified'),
-					key: 'rev',
+					value: 'rev',
 				},
 			]
 		},
+	},
 
-		/* Current order Key */
-		orderKey() {
-			return this.$store.getters.getOrderKey
-		},
-
-		orderKeyOption() {
-			return this.options.filter((option) => option.key === this.orderKey)[0]
-		},
+	beforeMount() {
+		this.selected = this.options.find((option) => option.value === this.$store.getters.getOrderKey)?.label ?? null
 	},
 
 	methods: {
-		sortContacts(orderKey) {
-			const key = orderKey && orderKey.key ? orderKey.key : 'displayName'
-			this.$store.commit('setOrder', key)
+		sortContacts(selected) {
+			const value = selected && selected.value ? selected.value : 'displayName'
+			this.$store.commit('setOrder', value)
 			this.$store.commit('sortContacts')
-			localStorage.setItem('orderKey', key)
-		},
-
-		formatSortByLabel(option) {
-			return t('contacts', 'Sort by {sorting}', { sorting: option.label })
+			localStorage.setItem('orderKey', value)
 		},
 	},
 }