fix: final content tab qa (#5611)

* fix: queued admonition always showing

* fix: dont apply grayscale to checkbox in content card item

* fix: actual stable id for disable/enable/bulk state

* fix: vue-router resolve workaround

* fix: show disable/enable btns same time

* fix: remove mr-2 on toggle

* fix: type errors + add ModpackAlreadyInstalledModal

* fix: bulk actions + overflow menu hitting ad container

* fix: responsiveness of ContentSelectionBar

* feat: better backup naming for inline backups + sorting fixes

* fix: lint

* fix: typo

apps/app-frontend/src/pages/instance/Mods.vue

@@ -20,6 +20,11 @@
 			<ConfirmModpackUpdateModal
 				ref="modpackUpdateConfirmModal"
 				:downgrade="isModpackUpdateDowngrade"
+				:backup-tip="
+					[linkedModpackProject?.title, pendingModpackUpdateVersion?.version_number]
+						.filter(Boolean)
+						.join(' ')
+				"
 				@confirm="handleModpackUpdateConfirm"
 				@cancel="handleModpackUpdateCancel"
 			/>
@@ -471,7 +476,7 @@ async function handleModpackContentToggle(item: ContentItem) {
 }
 
 async function handleModpackContentBulkToggle(items: ContentItem[]) {
-	await Promise.all(items.map((item) => toggleDisableMod(item)))
+	await Promise.all(items.map((item) => _toggleDisableMod(item)))
 }
 
 async function handleModpackContent() {
@@ -814,13 +819,12 @@ provideContentManager({
 	isPackLocked,
 	isBusy: isInstanceBusy,
 	isBulkOperating,
-	getItemId: (item) => item.file_path ?? item.file_name,
 	contentTypeLabel: ref(formatMessage(messages.contentTypeProject)),
 	toggleEnabled: toggleDisableMod,
 	bulkEnableItems: (items) =>
-		Promise.all(items.map((item) => toggleDisableMod(item))).then(() => {}),
+		Promise.all(items.map((item) => _toggleDisableMod(item))).then(() => {}),
 	bulkDisableItems: (items) =>
-		Promise.all(items.map((item) => toggleDisableMod(item))).then(() => {}),
+		Promise.all(items.map((item) => _toggleDisableMod(item))).then(() => {}),
 	deleteItem: removeMod,
 	bulkDeleteItems: (items) => Promise.all(items.map((item) => removeMod(item))).then(() => {}),
 	refresh: () => initProjects('must_revalidate'),
@@ -838,7 +842,7 @@ provideContentManager({
 	dismissContentHint,
 	shareItems: handleShareItems,
 	mapToTableItem: (item) => ({
-		id: item.file_path ?? item.file_name,
+		id: item.id,
 		project: item.project ?? {
 			id: item.file_name,
 			slug: null,