Fix legacy tabs

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>

apps/files/js/filelist.js

@@ -3658,10 +3658,9 @@
 		 */
 		registerTabView: function(tabView) {
 			console.warn('registerTabView is deprecated! It will be removed in nextcloud 20.');
-			const name = tabView.getLabel()
 			const enabled = tabView.canDisplay || undefined
-			if (name) {
-				OCA.Files.Sidebar.registerTab(new OCA.Files.Sidebar.Tab(name, tabView, enabled, true))
+			if (tabView.id) {
+				OCA.Files.Sidebar.registerTab(new OCA.Files.Sidebar.Tab(tabView.id, tabView, enabled, true))
 			}
 		},
 

apps/files/src/components/LegacyTab.vue

@@ -21,7 +21,9 @@
   -->
 
 <template>
-	<AppSidebarTab :icon="icon"
+	<AppSidebarTab
+		:id="id"
+		:icon="icon"
 		:name="name"
 		:active-tab="activeTab" />
 </template>
@@ -38,7 +40,7 @@ export default {
 			type: Object,
 			required: true,
 		},
-		name: {
+		id: {
 			type: String,
 			required: true,
 		},
@@ -52,9 +54,8 @@ export default {
 		icon() {
 			return this.component.getIcon()
 		},
-		id() {
-			// copied from AppSidebarTab
-			return this.name.toLowerCase().replace(/ /g, '-')
+		name() {
+			return this.component.getLabel()
 		},
 		order() {
 			return this.component.order

apps/files/src/models/Tab.js

@@ -24,23 +24,23 @@ export default class Tab {
 
 	#component
 	#legacy
-	#name
+	#id
 	#enabled
 
 	/**
 	 * Create a new tab instance
 	 *
-	 * @param {string} name the name of this tab
+	 * @param {string} id the unique id of this tab
 	 * @param {Object} component the vue component
 	 * @param {Function} [enabled] function that returns if the tab should be shown or not
 	 * @param {boolean} [legacy] is this a legacy tab
 	 */
-	constructor(name, component, enabled = () => true, legacy) {
+	constructor(id, component, enabled = () => true, legacy) {
 		if (typeof enabled !== 'function') {
 			throw new Error('The enabled argument should be a function')
 		}
 
-		this.#name = name
+		this.#id = id
 		this.#component = component
 		this.#enabled = enabled
 		this.#legacy = legacy === true
@@ -51,8 +51,8 @@ export default class Tab {
 
 	}
 
-	get name() {
-		return this.#name
+	get id() {
+		return this.#id
 	}
 
 	get component() {

apps/files/src/services/Sidebar.js

@@ -56,17 +56,17 @@ export default class Sidebar {
 	 * @returns {Boolean}
 	 */
 	registerTab(tab) {
-		const hasDuplicate = this.#state.tabs.findIndex(check => check.name === tab.name) > -1
+		const hasDuplicate = this.#state.tabs.findIndex(check => check.id === tab.id) > -1
 		if (!hasDuplicate) {
 			this.#state.tabs.push(tab)
 			return true
 		}
-		console.error(`An tab with the same name ${tab.name} already exists`, tab)
+		console.error(`An tab with the same id ${tab.id} already exists`, tab)
 		return false
 	}
 
 	registerSecondaryView(view) {
-		const hasDuplicate = this.#state.views.findIndex(check => check.name === view.name) > -1
+		const hasDuplicate = this.#state.views.findIndex(check => check.id === view.id) > -1
 		if (!hasDuplicate) {
 			this.#state.views.push(view)
 			return true

apps/files/src/views/Sidebar.vue

@@ -62,6 +62,7 @@
 			<component
 				:is="tabComponent(tab).is"
 				v-if="canDisplay(tab)"
+				:id="tab.id"
 				:key="tab.id"
 				:component="tabComponent(tab).component"
 				:name="tab.name"