From bcfa6941e4e2eb64f774c32883fe143b4e835e0e Mon Sep 17 00:00:00 2001
From: "Cal H." <hendersoncal117@gmail.com>
Date: Mon, 18 Aug 2025 14:50:58 +0100
Subject: [PATCH] fix: Teleport Dropdown/OverflowMenu imports (#4211)

* fix: Teleport Dropdown/OverflowMenu imports

* fix: lint
---
 .../src/components/ui/servers/BackupSettingsModal.vue |  9 +++++++--
 .../components/ui/servers/ContentVersionEditModal.vue | 11 +++++++++--
 apps/frontend/src/components/ui/servers/FileItem.vue  |  6 ++++--
 .../src/components/ui/servers/FilesBrowseNavbar.vue   |  6 ++++--
 .../src/components/ui/servers/FilesEditingNavbar.vue  |  6 ++++--
 .../components/ui/servers/PanelServerActionButton.vue |  5 +++--
 .../ui/servers/PlatformChangeModpackVersionModal.vue  |  9 +++++++--
 .../ui/servers/PlatformVersionSelectModal.vue         |  1 +
 .../src/pages/servers/manage/[id]/content/index.vue   |  1 +
 .../pages/servers/manage/[id]/options/properties.vue  |  4 ++--
 .../src/pages/servers/manage/[id]/options/startup.vue |  6 +++---
 11 files changed, 45 insertions(+), 19 deletions(-)

diff --git a/apps/frontend/src/components/ui/servers/BackupSettingsModal.vue b/apps/frontend/src/components/ui/servers/BackupSettingsModal.vue
index 947f59b0..b3166d99 100644
--- a/apps/frontend/src/components/ui/servers/BackupSettingsModal.vue
+++ b/apps/frontend/src/components/ui/servers/BackupSettingsModal.vue
@@ -27,7 +27,7 @@
 					</p>
 				</div>
 
-				<UiServersTeleportDropdownMenu
+				<TeleportDropdownMenu
 					:id="'interval-field'"
 					v-model="backupIntervalsLabel"
 					:disabled="!autoBackupEnabled || isSaving"
@@ -57,7 +57,12 @@
 
 <script setup lang="ts">
 import { SaveIcon, XIcon } from '@modrinth/assets'
-import { ButtonStyled, injectNotificationManager, NewModal } from '@modrinth/ui'
+import {
+	ButtonStyled,
+	injectNotificationManager,
+	NewModal,
+	TeleportDropdownMenu,
+} from '@modrinth/ui'
 import { computed, ref } from 'vue'
 
 import type { ModrinthServer } from '~/composables/servers/modrinth-servers.ts'
diff --git a/apps/frontend/src/components/ui/servers/ContentVersionEditModal.vue b/apps/frontend/src/components/ui/servers/ContentVersionEditModal.vue
index 1b37810a..f952f11b 100644
--- a/apps/frontend/src/components/ui/servers/ContentVersionEditModal.vue
+++ b/apps/frontend/src/components/ui/servers/ContentVersionEditModal.vue
@@ -60,7 +60,7 @@
 							</NuxtLink>
 						</div>
 					</div>
-					<UiServersTeleportDropdownMenu
+					<TeleportDropdownMenu
 						v-model="selectedVersion"
 						name="Project"
 						:options="filteredVersions"
@@ -237,7 +237,14 @@ import {
 	LockOpenIcon,
 	XIcon,
 } from '@modrinth/assets'
-import { Admonition, Avatar, ButtonStyled, CopyCode, NewModal } from '@modrinth/ui'
+import {
+	Admonition,
+	Avatar,
+	ButtonStyled,
+	CopyCode,
+	NewModal,
+	TeleportDropdownMenu,
+} from '@modrinth/ui'
 import TagItem from '@modrinth/ui/src/components/base/TagItem.vue'
 import { formatCategory, formatVersionsForDisplay, type Mod, type Version } from '@modrinth/utils'
 import { computed, ref } from 'vue'
diff --git a/apps/frontend/src/components/ui/servers/FileItem.vue b/apps/frontend/src/components/ui/servers/FileItem.vue
index 6187d14b..3cb3961b 100644
--- a/apps/frontend/src/components/ui/servers/FileItem.vue
+++ b/apps/frontend/src/components/ui/servers/FileItem.vue
@@ -51,14 +51,14 @@
 				{{ formattedModifiedDate }}
 			</span>
 			<ButtonStyled circular type="transparent">
-				<UiServersTeleportOverflowMenu :options="menuOptions" direction="left" position="bottom">
+				<TeleportOverflowMenu :options="menuOptions" direction="left" position="bottom">
 					<MoreHorizontalIcon class="h-5 w-5 bg-transparent" />
 					<template #extract><PackageOpenIcon /> Extract</template>
 					<template #rename><EditIcon /> Rename</template>
 					<template #move><RightArrowIcon /> Move</template>
 					<template #download><DownloadIcon /> Download</template>
 					<template #delete><TrashIcon /> Delete</template>
-				</UiServersTeleportOverflowMenu>
+				</TeleportOverflowMenu>
 			</ButtonStyled>
 		</div>
 	</li>
@@ -90,6 +90,8 @@ import {
 } from '#components'
 import PaletteIcon from '~/assets/icons/palette.svg?component'
 
+import TeleportOverflowMenu from './TeleportOverflowMenu.vue'
+
 interface FileItemProps {
 	name: string
 	type: 'directory' | 'file'
diff --git a/apps/frontend/src/components/ui/servers/FilesBrowseNavbar.vue b/apps/frontend/src/components/ui/servers/FilesBrowseNavbar.vue
index 8d0f61fe..165d13fa 100644
--- a/apps/frontend/src/components/ui/servers/FilesBrowseNavbar.vue
+++ b/apps/frontend/src/components/ui/servers/FilesBrowseNavbar.vue
@@ -73,7 +73,7 @@
 		<div class="flex flex-shrink-0 items-center gap-1">
 			<div class="flex w-full flex-row-reverse sm:flex-row">
 				<ButtonStyled type="transparent">
-					<UiServersTeleportOverflowMenu
+					<TeleportOverflowMenu
 						position="bottom"
 						direction="left"
 						aria-label="Filter view"
@@ -93,7 +93,7 @@
 						<template #all>Show all</template>
 						<template #filesOnly>Files only</template>
 						<template #foldersOnly>Folders only</template>
-					</UiServersTeleportOverflowMenu>
+					</TeleportOverflowMenu>
 				</ButtonStyled>
 				<div class="mx-1 w-full text-sm sm:w-48">
 					<label for="search-folder" class="sr-only">Search folder</label>
@@ -171,6 +171,8 @@ import { ButtonStyled, OverflowMenu } from '@modrinth/ui'
 import { useIntersectionObserver } from '@vueuse/core'
 import { computed, ref } from 'vue'
 
+import TeleportOverflowMenu from './TeleportOverflowMenu.vue'
+
 const props = defineProps<{
 	breadcrumbSegments: string[]
 	searchQuery: string
diff --git a/apps/frontend/src/components/ui/servers/FilesEditingNavbar.vue b/apps/frontend/src/components/ui/servers/FilesEditingNavbar.vue
index a852ef1e..1aed3308 100644
--- a/apps/frontend/src/components/ui/servers/FilesEditingNavbar.vue
+++ b/apps/frontend/src/components/ui/servers/FilesEditingNavbar.vue
@@ -71,7 +71,7 @@
 				<ShareIcon />
 			</Button>
 			<ButtonStyled type="transparent">
-				<UiServersTeleportOverflowMenu
+				<TeleportOverflowMenu
 					position="bottom"
 					direction="left"
 					aria-label="Save file"
@@ -100,7 +100,7 @@
 						</svg>
 						Save & restart
 					</template>
-				</UiServersTeleportOverflowMenu>
+				</TeleportOverflowMenu>
 			</ButtonStyled>
 		</div>
 	</header>
@@ -112,6 +112,8 @@ import { Button, ButtonStyled } from '@modrinth/ui'
 import { computed } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 
+import TeleportOverflowMenu from './TeleportOverflowMenu.vue'
+
 const props = defineProps<{
 	breadcrumbSegments: string[]
 	fileName?: string
diff --git a/apps/frontend/src/components/ui/servers/PanelServerActionButton.vue b/apps/frontend/src/components/ui/servers/PanelServerActionButton.vue
index 9985abfe..c7ff4c38 100644
--- a/apps/frontend/src/components/ui/servers/PanelServerActionButton.vue
+++ b/apps/frontend/src/components/ui/servers/PanelServerActionButton.vue
@@ -78,7 +78,7 @@
 				</ButtonStyled>
 
 				<ButtonStyled circular type="transparent">
-					<UiServersTeleportOverflowMenu :options="[...menuOptions]">
+					<TeleportOverflowMenu :options="[...menuOptions]">
 						<MoreVerticalIcon aria-hidden="true" />
 						<template #kill>
 							<SlashIcon class="h-5 w-5" />
@@ -96,7 +96,7 @@
 							<ClipboardCopyIcon class="h-5 w-5" aria-hidden="true" />
 							<span>Copy ID</span>
 						</template>
-					</UiServersTeleportOverflowMenu>
+					</TeleportOverflowMenu>
 				</ButtonStyled>
 			</template>
 		</div>
@@ -125,6 +125,7 @@ import { useRouter } from 'vue-router'
 import LoadingIcon from './icons/LoadingIcon.vue'
 import PanelSpinner from './PanelSpinner.vue'
 import ServerInfoLabels from './ServerInfoLabels.vue'
+import TeleportOverflowMenu from './TeleportOverflowMenu.vue'
 
 const flags = useFeatureFlags()
 
diff --git a/apps/frontend/src/components/ui/servers/PlatformChangeModpackVersionModal.vue b/apps/frontend/src/components/ui/servers/PlatformChangeModpackVersionModal.vue
index 3005cb3d..87cf2c6e 100644
--- a/apps/frontend/src/components/ui/servers/PlatformChangeModpackVersionModal.vue
+++ b/apps/frontend/src/components/ui/servers/PlatformChangeModpackVersionModal.vue
@@ -17,7 +17,7 @@
 			</div>
 
 			<div class="flex w-full flex-col gap-4">
-				<UiServersTeleportDropdownMenu
+				<TeleportDropdownMenu
 					v-if="props.versions?.length"
 					v-model="selectedVersion"
 					:options="versionOptions"
@@ -68,7 +68,12 @@
 
 <script setup lang="ts">
 import { DownloadIcon, XIcon } from '@modrinth/assets'
-import { ButtonStyled, injectNotificationManager, NewModal } from '@modrinth/ui'
+import {
+	ButtonStyled,
+	injectNotificationManager,
+	NewModal,
+	TeleportDropdownMenu,
+} from '@modrinth/ui'
 import { ModrinthServersFetchError } from '@modrinth/utils'
 
 import type { ModrinthServer } from '~/composables/servers/modrinth-servers.ts'
diff --git a/apps/frontend/src/components/ui/servers/PlatformVersionSelectModal.vue b/apps/frontend/src/components/ui/servers/PlatformVersionSelectModal.vue
index c8a7a0c4..ebbab8e0 100644
--- a/apps/frontend/src/components/ui/servers/PlatformVersionSelectModal.vue
+++ b/apps/frontend/src/components/ui/servers/PlatformVersionSelectModal.vue
@@ -203,6 +203,7 @@ import {
 	ButtonStyled,
 	injectNotificationManager,
 	NewModal,
+	TeleportDropdownMenu,
 	Toggle,
 } from '@modrinth/ui'
 import { type Loaders, ModrinthServersFetchError } from '@modrinth/utils'
diff --git a/apps/frontend/src/pages/servers/manage/[id]/content/index.vue b/apps/frontend/src/pages/servers/manage/[id]/content/index.vue
index e7763cb7..80b1fc7c 100644
--- a/apps/frontend/src/pages/servers/manage/[id]/content/index.vue
+++ b/apps/frontend/src/pages/servers/manage/[id]/content/index.vue
@@ -364,6 +364,7 @@ import FilesUploadDragAndDrop from '~/components/ui/servers/FilesUploadDragAndDr
 import FilesUploadDropdown from '~/components/ui/servers/FilesUploadDropdown.vue'
 import LoaderIcon from '~/components/ui/servers/icons/LoaderIcon.vue'
 import LoadingIcon from '~/components/ui/servers/icons/LoadingIcon.vue'
+import TeleportOverflowMenu from '~/components/ui/servers/TeleportOverflowMenu.vue'
 import type { ModrinthServer } from '~/composables/servers/modrinth-servers.ts'
 import { acceptFileFromProjectType } from '~/helpers/fileUtils.js'
 
diff --git a/apps/frontend/src/pages/servers/manage/[id]/options/properties.vue b/apps/frontend/src/pages/servers/manage/[id]/options/properties.vue
index 6a907a80..f0c59b2e 100644
--- a/apps/frontend/src/pages/servers/manage/[id]/options/properties.vue
+++ b/apps/frontend/src/pages/servers/manage/[id]/options/properties.vue
@@ -77,7 +77,7 @@
 							v-if="overrides[index] && overrides[index].type === 'dropdown'"
 							class="mt-2 flex w-full sm:w-[320px] sm:justify-end"
 						>
-							<UiServersTeleportDropdownMenu
+							<TeleportDropdownMenu
 								:id="`server-property-${index}`"
 								v-model="liveProperties[index]"
 								:name="formatPropertyName(index)"
@@ -144,7 +144,7 @@
 
 <script setup lang="ts">
 import { EyeIcon, IssuesIcon, SearchIcon } from '@modrinth/assets'
-import { ButtonStyled, injectNotificationManager } from '@modrinth/ui'
+import { ButtonStyled, injectNotificationManager, TeleportDropdownMenu } from '@modrinth/ui'
 import Fuse from 'fuse.js'
 import { computed, inject, ref, watch } from 'vue'
 
diff --git a/apps/frontend/src/pages/servers/manage/[id]/options/startup.vue b/apps/frontend/src/pages/servers/manage/[id]/options/startup.vue
index 853ef8ea..f1fbcc27 100644
--- a/apps/frontend/src/pages/servers/manage/[id]/options/startup.vue
+++ b/apps/frontend/src/pages/servers/manage/[id]/options/startup.vue
@@ -77,7 +77,7 @@
 							/>
 							<label for="show-all-versions" class="text-sm">Show all Java versions</label>
 						</div>
-						<UiServersTeleportDropdownMenu
+						<TeleportDropdownMenu
 							:id="'java-version-field'"
 							v-model="jdkVersion"
 							name="java-version"
@@ -90,7 +90,7 @@
 							<span class="text-lg font-bold text-contrast">Runtime</span>
 							<span> The Java runtime your server will use. </span>
 						</div>
-						<UiServersTeleportDropdownMenu
+						<TeleportDropdownMenu
 							:id="'runtime-field'"
 							v-model="jdkBuild"
 							name="runtime"
@@ -113,7 +113,7 @@
 
 <script setup lang="ts">
 import { IssuesIcon, UpdatedIcon } from '@modrinth/assets'
-import { ButtonStyled, injectNotificationManager } from '@modrinth/ui'
+import { ButtonStyled, injectNotificationManager, TeleportDropdownMenu } from '@modrinth/ui'
 
 import SaveBanner from '~/components/ui/servers/SaveBanner.vue'
 import type { ModrinthServer } from '~/composables/servers/modrinth-servers.ts'