enh: Add unique DOM identifiers for nav entries

Signed-off-by: Christopher Ng <chrng8@gmail.com> (cherry picked from commit cdb9513)
nextcloud · Nov 15, 2023 · 3cecb0b · 3cecb0b
1 parent 0cb4655
commit 3cecb0b
Showing 1 changed file with 36 additions and 12 deletions.
diff --git a/src/Photos.vue b/src/Photos.vue
@@ -27,49 +27,73 @@
 				<NcAppNavigationItem :to="{name: 'all_media'}"
 					class="app-navigation__all_media"
 					:title="t('photos', 'All media')"
+					data-id-app-nav-item="all-media"
 					exact>
 					<ImageIcon slot="icon" :size="20" />
 				</NcAppNavigationItem>
-				<NcAppNavigationItem to="/photos" :title="t('photos', 'Photos')">
+				<NcAppNavigationItem to="/photos"
+					:title="t('photos', 'Photos')"
+					data-id-app-nav-item="photos">
 					<Camera slot="icon" :size="20" />
 				</NcAppNavigationItem>
-				<NcAppNavigationItem to="/videos" :title="t('photos', 'Videos')">
+				<NcAppNavigationItem to="/videos"
+					:title="t('photos', 'Videos')"
+					data-id-app-nav-item="videos">
 					<VideoIcon slot="icon" :size="20" />
 				</NcAppNavigationItem>
-				<NcAppNavigationItem :to="{name: 'albums'}" :title="t('photos', 'Albums')">
+				<NcAppNavigationItem :to="{name: 'albums'}"
+					:title="t('photos', 'Albums')"
+					data-id-app-nav-item="albums">
 					<FolderMultipleImage slot="icon" :size="20" />
 				</NcAppNavigationItem>
-				<NcAppNavigationItem :to="{name: 'sharedAlbums'}" :title="t('photos', 'Collaborative albums')">
+				<NcAppNavigationItem :to="{name: 'sharedAlbums'}"
+					:title="t('photos', 'Collaborative albums')"
+					data-id-app-nav-item="shared-albums">
 					<AccountGroup slot="icon" :size="20" />
 				</NcAppNavigationItem>
-				<NcAppNavigationItem v-if="showPeopleMenuEntry" :to="{name: 'faces'}" :title="t('photos', 'People')">
+				<NcAppNavigationItem v-if="showPeopleMenuEntry"
+					:to="{name: 'faces'}"
+					:title="t('photos', 'People')"
+					data-id-app-nav-item="faces">
 					<template #icon>
 						<AccountBoxMultipleOutline :size="20" />
 					</template>
 				</NcAppNavigationItem>
-				<NcAppNavigationItem :to="{name: 'folders'}" :title="t('photos', 'Folders')">
+				<NcAppNavigationItem :to="{name: 'folders'}"
+					:title="t('photos', 'Folders')"
+					data-id-app-nav-item="folders">
 					<Folder slot="icon" :size="20" />
 				</NcAppNavigationItem>
-				<NcAppNavigationItem to="/favorites" :title="t('photos', 'Favorites')">
+				<NcAppNavigationItem to="/favorites"
+					:title="t('photos', 'Favorites')"
+					data-id-app-nav-item="favorites">
 					<Star slot="icon" :size="20" />
 				</NcAppNavigationItem>
-				<NcAppNavigationItem :to="{name: 'thisday'}" :title="t('photos', 'On this day')">
+				<NcAppNavigationItem :to="{name: 'thisday'}"
+					:title="t('photos', 'On this day')"
+					data-id-app-nav-item="this-day">
 					<CalendarToday slot="icon" :size="20" />
 				</NcAppNavigationItem>
-				<NcAppNavigationItem :to="{name: 'shared'}" :title="t('photos', 'Shared with you')">
+				<NcAppNavigationItem :to="{name: 'shared'}"
+					:title="t('photos', 'Shared with you')"
+					data-id-app-nav-item="shared">
 					<ShareVariant slot="icon" :size="20" />
 				</NcAppNavigationItem>
 				<NcAppNavigationItem v-if="areTagsInstalled"
 					:to="{name: 'tags'}"
-					:title="t('photos', 'Tags')">
+					:title="t('photos', 'Tags')"
+					data-id-app-nav-item="tags">
 					<Tag slot="icon" :size="20" />
 				</NcAppNavigationItem>
-				<NcAppNavigationItem :to="{name: 'places'}" :title="t('photos', 'Places')">
+				<NcAppNavigationItem :to="{name: 'places'}"
+					:title="t('photos', 'Places')"
+					data-id-app-nav-item="places">
 					<MapMarker slot="icon" :size="20" />
 				</NcAppNavigationItem>
 				<NcAppNavigationItem v-if="showLocationMenuEntry"
 					:to="{name: 'maps'}"
-					:title="t('photos', 'Map')">
+					:title="t('photos', 'Map')"
+					data-id-app-nav-item="maps">
 					<MapIcon slot="icon" :size="20" />
 				</NcAppNavigationItem>
 			</template>