From 789ec8966c6fdfa6c56cdec57bd361078f08efd6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fran=C3=A7ois-Xavier=20Talbot?=
 <108630700+fetchfern@users.noreply.github.com>
Date: Mon, 9 Mar 2026 15:16:01 -0400
Subject: [PATCH] Add refresh button in files tab behind feature flag (#5431)

---
 apps/frontend/src/composables/featureFlags.ts       |  1 +
 .../src/pages/hosting/manage/[id]/files.vue         |  5 ++++-
 .../ui/src/components/servers/files/FileNavbar.vue  | 13 +++++++++++++
 packages/ui/src/pages/hosting/manage/files.vue      |  3 +++
 4 files changed, 21 insertions(+), 1 deletion(-)

diff --git a/apps/frontend/src/composables/featureFlags.ts b/apps/frontend/src/composables/featureFlags.ts
index 96748eec5..2536c545e 100644
--- a/apps/frontend/src/composables/featureFlags.ts
+++ b/apps/frontend/src/composables/featureFlags.ts
@@ -32,6 +32,7 @@ export const DEFAULT_FEATURE_FLAGS = validateValues({
 	projectBackground: false,
 	searchBackground: false,
 	advancedDebugInfo: false,
+	FilesRefreshButton: false,
 	showProjectPageDownloadModalServersPromo: false,
 	showProjectPageCreateServersTooltip: true,
 	showProjectPageQuickServerButton: false,
diff --git a/apps/frontend/src/pages/hosting/manage/[id]/files.vue b/apps/frontend/src/pages/hosting/manage/[id]/files.vue
index 83b7fff59..82a33ae15 100644
--- a/apps/frontend/src/pages/hosting/manage/[id]/files.vue
+++ b/apps/frontend/src/pages/hosting/manage/[id]/files.vue
@@ -10,5 +10,8 @@ useHead({
 </script>
 
 <template>
-	<ServersManageFilesPage :show-debug-info="flags.advancedDebugInfo" />
+	<ServersManageFilesPage
+		:show-debug-info="flags.advancedDebugInfo"
+		:show-refresh-button="flags.FilesRefreshButton"
+	/>
 </template>
diff --git a/packages/ui/src/components/servers/files/FileNavbar.vue b/packages/ui/src/components/servers/files/FileNavbar.vue
index dbfcbd52d..9ba0bc11d 100644
--- a/packages/ui/src/components/servers/files/FileNavbar.vue
+++ b/packages/ui/src/components/servers/files/FileNavbar.vue
@@ -80,6 +80,17 @@
 				@update:model-value="$emit('update:searchQuery', $event)"
 			/>
 
+			<ButtonStyled v-if="showRefreshButton" type="outlined">
+				<button
+					type="button"
+					class="flex h-10 items-center gap-2 !border-[1px] !border-surface-5"
+					@click="$emit('refresh')"
+				>
+					<RefreshCwIcon aria-hidden="true" class="h-5 w-5" />
+					Refresh
+				</button>
+			</ButtonStyled>
+
 			<ButtonStyled type="outlined">
 				<OverflowMenu
 					:dropdown-id="`create-new-${baseId}`"
@@ -178,6 +189,7 @@ const props = defineProps<{
 	editingFilePath?: string
 	isEditingImage?: boolean
 	searchQuery: string
+	showRefreshButton?: boolean
 	baseId: string
 }>()
 
@@ -190,6 +202,7 @@ defineEmits<{
 	upload: []
 	uploadZip: []
 	unzipFromUrl: [cf: boolean]
+	refresh: []
 	save: []
 	saveAs: []
 	saveRestart: []
diff --git a/packages/ui/src/pages/hosting/manage/files.vue b/packages/ui/src/pages/hosting/manage/files.vue
index 941c197e1..996d0c9a9 100644
--- a/packages/ui/src/pages/hosting/manage/files.vue
+++ b/packages/ui/src/pages/hosting/manage/files.vue
@@ -30,6 +30,7 @@
 						:editing-file-path="editingFile?.path"
 						:is-editing-image="fileEditorRef?.isEditingImage"
 						:search-query="searchQuery"
+						:show-refresh-button="showRefreshButton"
 						:base-id="baseId"
 						@navigate="navigateToSegment"
 						@navigate-home="() => navigateToSegment(-1)"
@@ -39,6 +40,7 @@
 						@upload="initiateFileUpload"
 						@upload-zip="() => {}"
 						@unzip-from-url="showUnzipFromUrlModal"
+						@refresh="refreshList"
 						@save="() => fileEditorRef?.saveFileContent(true)"
 						@save-as="() => fileEditorRef?.saveFileContent(false)"
 						@save-restart="() => fileEditorRef?.saveAndRestart()"
@@ -303,6 +305,7 @@ import {
 
 defineProps<{
 	showDebugInfo?: boolean
+	showRefreshButton?: boolean
 }>()
 
 const notifications = injectNotificationManager()