fix: default subscription interval in servers upgrade modal wrapper (#4585)

.vscode/settings.json

@@ -11,5 +11,20 @@
 		"source.fixAll.eslint": "explicit",
 		"source.organizeImports": "always"
 	},
-	"editor.defaultFormatter": "esbenp.prettier-vscode"
+	"editor.defaultFormatter": "esbenp.prettier-vscode",
+	"[vue]": {
+		"editor.defaultFormatter": "esbenp.prettier-vscode"
+	},
+	"[typescript]": {
+		"editor.defaultFormatter": "esbenp.prettier-vscode"
+	},
+	"[javascript]": {
+		"editor.defaultFormatter": "esbenp.prettier-vscode"
+	},
+	"[scss]": {
+		"editor.defaultFormatter": "esbenp.prettier-vscode"
+	},
+	"[css]": {
+		"editor.defaultFormatter": "esbenp.prettier-vscode"
+	}
 }

apps/frontend/src/components/ui/servers/ServersUpgradeModalWrapper.vue

@@ -158,6 +158,15 @@ const currentPlanFromSubscription = computed<ServerPlan | undefined>(() => {
 		: undefined
 })
 
+const currentInterval = computed(() => {
+	const interval = subscription.value?.interval
+
+	if (interval === 'monthly' || interval === 'quarterly') {
+		return interval
+	}
+	return 'monthly'
+})
+
 async function initiatePayment(body: any): Promise<any> {
 	if (subscription.value) {
 		const transformedBody = {
@@ -247,7 +256,7 @@ async function open(id?: string) {
 		subscription.value = null
 	}
 
-	purchaseModal.value?.show('quarterly')
+	purchaseModal.value?.show(currentInterval.value)
 }
 
 defineExpose({