Port profile visibility select

Signed-off-by: Christopher Ng <chrng8@gmail.com>

1 files changed, 8 insertions, 9 deletions

diff --git a/apps/settings/src/components/PersonalInfo/ProfileVisibilitySection/VisibilityDropdown.vue b/apps/settings/src/components/PersonalInfo/ProfileVisibilitySection/VisibilityDropdown.vue
index 24f025f2da0..f00130ec0a4 100644
--- a/apps/settings/src/components/PersonalInfo/ProfileVisibilitySection/VisibilityDropdown.vue
+++ b/apps/settings/src/components/PersonalInfo/ProfileVisibilitySection/VisibilityDropdown.vue
@@ -26,13 +26,12 @@
 		<label :for="inputId">
 			{{ displayId }}
 		</label>
-		<NcMultiselect :id="inputId"
-			class="visibility-container__multiselect"
+		<NcSelect :input-id="inputId"
+			class="visibility-container__select"
+			:clearable="false"
 			:options="visibilityOptions"
-			track-by="name"
-			label="label"
 			:value="visibilityObject"
-			@change="onVisibilityChange" />
+			@option:selected="onVisibilityChange" />
 	</div>
 </template>
 
@@ -41,7 +40,7 @@ import { showError } from '@nextcloud/dialogs'
 import { loadState } from '@nextcloud/initial-state'
 import { subscribe, unsubscribe } from '@nextcloud/event-bus'
 
-import NcMultiselect from '@nextcloud/vue/dist/Components/NcMultiselect'
+import NcSelect from '@nextcloud/vue/dist/Components/NcSelect.js'
 
 import { saveProfileParameterVisibility } from '../../../service/ProfileService.js'
 import { VISIBILITY_PROPERTY_ENUM } from '../../../constants/ProfileConstants.js'
@@ -53,7 +52,7 @@ export default {
 	name: 'VisibilityDropdown',
 
 	components: {
-		NcMultiselect,
+		NcSelect,
 	},
 
 	props: {
@@ -173,8 +172,8 @@ export default {
 		line-height: 50px;
 	}
 
-	&__multiselect {
-		width: 260px;
+	&__select {
+		width: 270px;
 		max-width: 40vw;
 	}
 }