diff --git a/apps/frontend/src/pages/settings/billing/index.vue b/apps/frontend/src/pages/settings/billing/index.vue
index e203f858dfc..2d60f9cd3d1 100644
--- a/apps/frontend/src/pages/settings/billing/index.vue
+++ b/apps/frontend/src/pages/settings/billing/index.vue
@@ -1,6 +1,12 @@
 <template>
 	<ServersUpgradeModalWrapper ref="upgradeModal" />
-	<ResubscribeModal ref="pyroResubscribeModal" @resubscribe="handlePyroResubscribeConfirm" />
+	<ResubscribeModal
+		ref="pyroResubscribeModal"
+		:payment-methods="paymentMethods"
+		:regions="regions"
+		:on-add-payment-method="addPaymentMethod"
+		@resubscribe="handlePyroResubscribeConfirm"
+	/>
 	<section class="universal-card">
 		<h2>{{ formatMessage(messages.subscriptionTitle) }}</h2>
 		<p>{{ formatMessage(messages.subscriptionDescription) }}</p>
@@ -1057,6 +1063,11 @@ const { data: serverFullList } = useQuery({
 	queryFn: () => client.archon.servers_v1.list(),
 })
 
+const { data: regions } = useQuery({
+	queryKey: ['servers', 'regions'],
+	queryFn: () => client.archon.servers_v1.getRegions(),
+})
+
 const midasProduct = ref(products.find((x) => x.metadata?.type === 'midas'))
 const midasSubscription = computed(() =>
 	subscriptions.value?.find(
@@ -1372,22 +1383,13 @@ const resubscribePyro = async (subscriptionId, wasSuspended) => {
 
 function openPyroResubscribeModal(subscription) {
 	const charge = getPyroCharge(subscription)
-	const product = getPyroProduct(subscription)
-	const interval = charge?.subscription_interval || subscription?.interval
-	const productPrice = getProductPrice(product, interval)
 
 	pyroResubscribeModal.value?.show({
 		subscriptionId: subscription?.id ?? '',
 		wasSuspended: charge?.due ? new Date(charge.due).getTime() < Date.now() : false,
 		serverName: subscription?.serverInfo?.name ?? 'this server',
-		planName: `${getProductSize(product)} plan`,
-		ramGb: product?.metadata?.ram ? product.metadata.ram / 1024 : undefined,
-		storageGb: product?.metadata?.storage ? product.metadata.storage / 1024 : undefined,
-		sharedCpus: product?.metadata?.cpu ? product.metadata.cpu / 2 : undefined,
-		priceCents: charge?.amount ?? productPrice?.prices?.intervals?.[interval],
-		currencyCode: charge?.currency_code ?? productPrice?.currency_code,
-		interval,
-		nextChargeDate: charge?.due,
+		plan: getPyroProduct(subscription),
+		regionShortcode: subscription?.metadata?.region,
 	})
 }
 
diff --git a/apps/labrinth/src/queue/billing.rs b/apps/labrinth/src/queue/billing.rs
index 34474a16bda..eeb78a6caf3 100644
--- a/apps/labrinth/src/queue/billing.rs
+++ b/apps/labrinth/src/queue/billing.rs
@@ -83,16 +83,6 @@ async fn update_tax_amounts(
                 let charge_clone = charge.clone();
 
                 let op_fut = async move {
-                    let tax_id = DBProductsTaxIdentifier::get_price(
-                        charge.price_id,
-                        &pg,
-                    )
-                    .await
-                    .wrap_api_err("fetching price")?
-                    .wrap_internal_err(
-                        "finding product tax identifier for price",
-                    )?;
-
                     let product = DBProduct::get_price(charge.price_id, &pg)
                         .await
                         .wrap_internal_err(
@@ -102,83 +92,15 @@ async fn update_tax_amounts(
                             "finding product price in database",
                         )?;
 
-                    let stripe_address = 'a: {
-                        let stripe_customer =
-                            DBUser::get_id(charge.user_id, &pg, &redis)
-                                .await
-                                .wrap_internal_err(
-                                    "fetching Stripe customer from database",
-                                )?
-                                .wrap_internal_err(
-                                    "finding Stripe customer in database",
-                                )?;
-                        let stripe_customer_id = stripe_customer
-                            .stripe_customer_id
-                            .wrap_request_err(
-                                "finding Stripe customer ID on user",
-                            )?
-                            .parse()
-                            .wrap_request_err(
-                                "parsing user Stripe customer ID",
-                            )?;
-
-                        let payment_method = get_default_payment_method(
-                            &stripe_client,
-                            &stripe_customer_id,
-                        )
-                        .await?
-                        .wrap_request_err_with(|| {
-                            "customer has no default payment method"
-                                .to_string()
-                        })?;
-
-                        let stripe_address =
-                            payment_method.billing_details.address;
-
-                        // Attempt the default payment method's address first, then the customer's address.
-                        match stripe_address {
-                            Some(address) => break 'a address,
-                            None => {
-                                warn!("PaymentMethod had no address");
-                            }
-                        };
-
-                        let customer = stripe::Customer::retrieve(
-                            &stripe_client,
-                            &stripe_customer_id,
-                            &[],
-                        )
-                        .await
-                        .wrap_failed_dependency_err(
-                            "communicating with payment provider",
-                        )?;
-
-                        customer.address.wrap_request_err_with(|| {
-                            "couldn't get an address for the Stripe customer"
-                                .to_owned()
-                        })?
-                    };
-
-                    let customer_address =
-                        anrok::Address::from_stripe_address(&stripe_address);
-
-                    let tax_amount = anrok_client
-                        .create_ephemeral_txn(&anrok::TransactionFields {
-                            customer_address,
-                            currency_code: charge.currency_code.clone(),
-                            accounting_time: charge.due,
-                            accounting_time_zone:
-                                anrok::AccountingTimeZone::Utc,
-                            line_items: vec![anrok::LineItem::new(
-                                tax_id.tax_processor_id,
-                                charge.amount,
-                            )],
-                            customer_id: None,
-                            customer_name: None,
-                        })
-                        .await
-                        .wrap_internal_err("inserting database records for `update_tax_amounts`")?
-                        .tax_amount_to_collect;
+                    let tax_amount = quote_charge_tax(
+                        &pg,
+                        &redis,
+                        &stripe_client,
+                        &anrok_client,
+                        &charge,
+                    )
+                    .await?
+                    .tax_amount;
 
                     Result::<ProcessedCharge, ApiError>::Ok(ProcessedCharge {
                         new_tax_amount: tax_amount,
diff --git a/apps/labrinth/src/routes/internal/billing.rs b/apps/labrinth/src/routes/internal/billing.rs
index dfd16efd261..673dca9c797 100644
--- a/apps/labrinth/src/routes/internal/billing.rs
+++ b/apps/labrinth/src/routes/internal/billing.rs
@@ -678,6 +678,38 @@ pub struct SubscriptionEditQuery {
     pub dry: Option<bool>,
 }
 
+/// Returned by a dry run of resubscribing to a subscription (`cancelled: false`).
+#[derive(Serialize)]
+struct ResubscribePreview {
+    pub subtotal: i64,
+    pub tax: i64,
+    pub total: i64,
+    pub currency_code: String,
+    pub interval: Option<PriceDuration>,
+    pub due: chrono::DateTime<Utc>,
+    pub payment_method: stripe::PaymentMethod,
+}
+
+/// Recalculates the tax amount of a charge being resubscribed to, as the tax amount
+/// isn't kept up to date while the charge is cancelled or failed.
+async fn refresh_charge_tax(
+    pool: &PgPool,
+    redis: &RedisPool,
+    stripe_client: &stripe::Client,
+    anrok_client: &anrok::Client,
+    charge: &mut charge_item::DBCharge,
+) -> Result<ChargeTaxQuote, ApiError> {
+    let quote =
+        quote_charge_tax(pool, redis, stripe_client, anrok_client, charge)
+            .await
+            .wrap_api_err("calculating tax amount for resubscription")?;
+
+    charge.tax_amount = quote.tax_amount;
+    charge.tax_last_updated = Some(Utc::now());
+
+    Ok(quote)
+}
+
 /// Update a subscription.
 #[utoipa::path(
 	context_path = "/billing",
@@ -871,6 +903,8 @@ pub async fn edit_subscription(
         "could not find current product price".to_string()
     })?;
 
+    let mut resubscribe_quote = None;
+
     let maybe_intent_metadata = match edit_subscription.into_inner() {
         // Case of toggling cancellation when the next charge is a failed charge
         SubscriptionEdit {
@@ -880,6 +914,16 @@ pub async fn edit_subscription(
             if cancelled {
                 open_charge.status = ChargeStatus::Cancelled;
             } else {
+                resubscribe_quote = Some(
+                    refresh_charge_tax(
+                        &pool,
+                        &redis,
+                        &stripe_client,
+                        &anrok_client,
+                        &mut open_charge,
+                    )
+                    .await?,
+                );
                 // Forces another resubscription attempt
                 open_charge.last_attempt = Some(Utc::now() - Duration::days(2));
             }
@@ -899,6 +943,16 @@ pub async fn edit_subscription(
             open_charge.status = if cancelled {
                 ChargeStatus::Cancelled
             } else {
+                resubscribe_quote = Some(
+                    refresh_charge_tax(
+                        &pool,
+                        &redis,
+                        &stripe_client,
+                        &anrok_client,
+                        &mut open_charge,
+                    )
+                    .await?,
+                );
                 ChargeStatus::Open
             };
 
@@ -1134,6 +1188,18 @@ pub async fn edit_subscription(
         }
     };
 
+    if dry && let Some(quote) = resubscribe_quote {
+        return Ok(HttpResponse::Ok().json(ResubscribePreview {
+            subtotal: open_charge.amount,
+            tax: quote.tax_amount,
+            total: open_charge.amount + quote.tax_amount,
+            currency_code: open_charge.currency_code,
+            interval: open_charge.subscription_interval,
+            due: open_charge.due,
+            payment_method: quote.payment_method,
+        }));
+    }
+
     if !dry {
         // If `?dry=true`, don't actually commit the changes.
         //
diff --git a/apps/labrinth/src/routes/internal/billing/payments.rs b/apps/labrinth/src/routes/internal/billing/payments.rs
index 9315c4aefef..579e8780823 100644
--- a/apps/labrinth/src/routes/internal/billing/payments.rs
+++ b/apps/labrinth/src/routes/internal/billing/payments.rs
@@ -735,6 +735,95 @@ pub async fn get_default_payment_method(
     Ok(Some(payment_method))
 }
 
+pub struct ChargeTaxQuote {
+    pub tax_amount: i64,
+    /// The default payment method which will be charged for this charge.
+    pub payment_method: PaymentMethod,
+}
+
+/// Calculates the current tax amount for an existing charge, based on the address of the
+/// customer's default payment method, falling back to the customer's address.
+///
+/// This does not update the charge.
+pub async fn quote_charge_tax(
+    pg: &PgPool,
+    redis: &RedisPool,
+    stripe_client: &stripe::Client,
+    anrok_client: &anrok::Client,
+    charge: &DBCharge,
+) -> Result<ChargeTaxQuote, ApiError> {
+    let tax_id =
+        products_tax_identifier_item::DBProductsTaxIdentifier::get_price(
+            charge.price_id,
+            pg,
+        )
+        .await
+        .wrap_api_err("fetching price")?
+        .wrap_internal_err("finding product tax identifier for price")?;
+
+    let user = crate::database::models::user_item::DBUser::get_id(
+        charge.user_id,
+        pg,
+        redis,
+    )
+    .await
+    .wrap_internal_err("fetching Stripe customer from database")?
+    .wrap_internal_err("finding Stripe customer in database")?;
+    let stripe_customer_id: CustomerId = user
+        .stripe_customer_id
+        .wrap_request_err("finding Stripe customer ID on user")?
+        .parse()
+        .wrap_request_err("parsing user Stripe customer ID")?;
+
+    let payment_method =
+        get_default_payment_method(stripe_client, &stripe_customer_id)
+            .await?
+            .wrap_request_err_with(|| {
+                "customer has no default payment method".to_string()
+            })?;
+
+    let stripe_address = match &payment_method.billing_details.address {
+        Some(address) => address.clone(),
+        None => {
+            tracing::warn!("PaymentMethod had no address");
+
+            stripe::Customer::retrieve(stripe_client, &stripe_customer_id, &[])
+                .await
+                .wrap_failed_dependency_err(
+                    "communicating with payment provider",
+                )?
+                .address
+                .wrap_request_err_with(|| {
+                    "couldn't get an address for the Stripe customer".to_owned()
+                })?
+        }
+    };
+
+    let tax_amount = anrok_client
+        .create_ephemeral_txn(&anrok::TransactionFields {
+            customer_address: anrok::Address::from_stripe_address(
+                &stripe_address,
+            ),
+            currency_code: charge.currency_code.clone(),
+            accounting_time: charge.due.max(chrono::Utc::now()),
+            accounting_time_zone: anrok::AccountingTimeZone::Utc,
+            line_items: vec![anrok::LineItem::new(
+                tax_id.tax_processor_id,
+                charge.amount,
+            )],
+            customer_id: None,
+            customer_name: None,
+        })
+        .await
+        .wrap_internal_err("calculating tax amount for charge")?
+        .tax_amount_to_collect;
+
+    Ok(ChargeTaxQuote {
+        tax_amount,
+        payment_method,
+    })
+}
+
 /// Makes the customer's newest payment method the default if the customer has no
 /// default payment method left after `removed` was detached.
 pub async fn promote_default_payment_method(
diff --git a/packages/api-client/src/modules/labrinth/billing/internal.ts b/packages/api-client/src/modules/labrinth/billing/internal.ts
index fff2a6bfec0..0b6a977fbdd 100644
--- a/packages/api-client/src/modules/labrinth/billing/internal.ts
+++ b/packages/api-client/src/modules/labrinth/billing/internal.ts
@@ -71,6 +71,24 @@ export class LabrinthBillingInternalModule extends AbstractModule {
 		)
 	}
 
+	/**
+	 * Preview the cost of resubscribing to a cancelled subscription, with freshly calculated tax
+	 * PATCH /_internal/billing/subscription/{id}?dry=true
+	 */
+	public async previewResubscribe(
+		id: string,
+	): Promise<Labrinth.Billing.Internal.ResubscribePreview> {
+		return this.client.request<Labrinth.Billing.Internal.ResubscribePreview>(
+			`/billing/subscription/${id}?dry=true`,
+			{
+				api: 'labrinth',
+				version: 'internal',
+				method: 'PATCH',
+				body: { cancelled: false },
+			},
+		)
+	}
+
 	/**
 	 * Get user's payment methods
 	 * GET /_internal/billing/payment_methods
diff --git a/packages/api-client/src/modules/labrinth/types.ts b/packages/api-client/src/modules/labrinth/types.ts
index a0ca1673098..3c110afdf48 100644
--- a/packages/api-client/src/modules/labrinth/types.ts
+++ b/packages/api-client/src/modules/labrinth/types.ts
@@ -164,6 +164,16 @@ export namespace Labrinth {
 				total: number
 			}
 
+			export type ResubscribePreview = {
+				subtotal: number
+				tax: number
+				total: number
+				currency_code: string
+				interval: PriceDuration | null
+				due: string
+				payment_method: unknown
+			}
+
 			export type AddPaymentMethodFlowResponse = {
 				client_secret: string
 			}
diff --git a/packages/ui/src/components/billing/FormattedPaymentMethod.vue b/packages/ui/src/components/billing/FormattedPaymentMethod.vue
index bc35f1445fa..c0176c37e15 100644
--- a/packages/ui/src/components/billing/FormattedPaymentMethod.vue
+++ b/packages/ui/src/components/billing/FormattedPaymentMethod.vue
@@ -30,10 +30,10 @@ defineProps<{
 			}}
 		</template>
 
-		<span v-if="method.type === 'cashapp' && 'cashapp' in method && method.cashapp">
+		<span v-if="method.type === 'cashapp' && 'cashapp' in method && method.cashapp?.cashtag">
 			({{ method.cashapp.cashtag }})
 		</span>
-		<span v-else-if="method.type === 'paypal' && 'paypal' in method && method.paypal">
+		<span v-else-if="method.type === 'paypal' && 'paypal' in method && method.paypal?.payer_email">
 			({{ method.paypal.payer_email }})
 		</span>
 	</template>
diff --git a/packages/ui/src/components/billing/ResubscribeModal.vue b/packages/ui/src/components/billing/ResubscribeModal.vue
index 084f3a0a359..72ff1bcee66 100644
--- a/packages/ui/src/components/billing/ResubscribeModal.vue
+++ b/packages/ui/src/components/billing/ResubscribeModal.vue
@@ -1,12 +1,12 @@
 <template>
-	<NewModal ref="modal" max-width="550px">
+	<NewModal ref="modal" @hide="handleHide">
 		<template #title>
 			<div class="text-2xl font-semibold text-contrast">{{ formatMessage(messages.title) }}</div>
 		</template>
 
-		<div class="flex w-[44rem] max-w-full flex-col gap-6">
+		<div class="flex w-[40rem] max-w-full flex-col">
 			<template v-if="modalData">
-				<p class="m-0 text-secondary leading-relaxed">
+				<p class="m-0 mb-4 text-secondary leading-relaxed">
 					<IntlFormatted
 						:message-id="messages.description"
 						:values="{ serverName: modalData.serverName }"
@@ -17,58 +17,126 @@
 					</IntlFormatted>
 				</p>
 
-				<div v-if="formattedPrice" class="flex flex-col gap-2.5">
-					<span class="text-contrast font-semibold">{{ formatMessage(messages.planLabel) }}</span>
+				<div class="grid gap-4" :class="{ 'sm:grid-cols-[3fr_2fr]': region }">
+					<div class="bg-surface-2 p-4 rounded-2xl">
+						<div class="flex items-center gap-2 mb-3">
+							<ModrinthServersIcon class="flex h-5 w-fit" />
+							<TagItem>{{ planName }}</TagItem>
+						</div>
+						<ServersSpecs
+							v-if="planSpecs"
+							class="!grid sm:grid-cols-2"
+							:ram="planSpecs.ram"
+							:storage="planSpecs.storage"
+							:cpus="planSpecs.cpu"
+						/>
+					</div>
 					<div
-						class="flex items-center justify-between gap-4 rounded-2xl border border-solid border-surface-5 bg-surface-2 p-5"
+						v-if="region"
+						class="bg-surface-2 p-4 rounded-2xl flex flex-col gap-2 items-center justify-center"
 					>
-						<div class="flex flex-col gap-1">
-							<div class="truncate font-semibold text-contrast">{{ modalData.planName }}</div>
-							<div
-								v-if="
-									modalData.ramGb != null ||
-									modalData.storageGb != null ||
-									modalData.sharedCpus != null
-								"
-								class="text-secondary flex gap-1.5 font-medium text-sm items-center"
-							>
-								<template v-if="modalData.ramGb != null">
-									{{ formatMessage(messages.ramLabel, { ramGb: modalData.ramGb }) }}
-								</template>
-								<template v-if="modalData.storageGb != null">
-									<div
-										v-if="modalData.ramGb != null"
-										class="h-1.5 w-1.5 bg-button-border rounded-full"
-									></div>
-									{{ formatMessage(messages.storageLabel, { storageGb: modalData.storageGb }) }}
-								</template>
-								<template v-if="modalData.sharedCpus != null">
-									<div
-										v-if="modalData.ramGb != null || modalData.storageGb != null"
-										class="h-1.5 w-1.5 bg-button-border rounded-full"
-									></div>
-									{{ formatMessage(messages.cpusLabel, { sharedCpus: modalData.sharedCpus }) }}
-								</template>
-							</div>
-						</div>
-						<div class="flex flex-col gap-1 items-end">
-							<div class="font-semibold text-contrast">
-								{{ formattedPrice }}
-							</div>
-							<div v-if="intervalLabel" class="text-secondary">{{ intervalLabel }}</div>
-						</div>
+						<img
+							v-if="regionFlag"
+							class="aspect-[16/10] max-w-12 w-full object-cover rounded-md border-1 border-button-border border-solid"
+							:src="regionFlag"
+							alt=""
+							aria-hidden="true"
+						/>
+						<span class="font-semibold">{{ regionTitle }}</span>
+						<span v-if="regionSubtitle" class="text-xs text-secondary font-medium">
+							{{ regionSubtitle }}
+						</span>
 					</div>
 				</div>
 
-				<p v-if="formattedNextChargeDate" class="m-0 text-primary">
-					<IntlFormatted
-						:message-id="messages.nextCharge"
-						:values="{ date: formattedNextChargeDate }"
+				<div
+					v-if="previewError"
+					class="mt-4 p-4 rounded-2xl bg-surface-2 text-sm text-red leading-relaxed"
+				>
+					{{ formatMessage(messages.previewError) }}
+				</div>
+				<ExpandableInvoiceTotal
+					v-else
+					class="mt-4"
+					:period="period"
+					:currency="currency"
+					:loading="loadingPreview"
+					:total="preview?.total ?? -1"
+					:billing-items="
+						preview
+							? [
+									{
+										title: formatMessage(messages.planItem, { plan: planName }),
+										amount: preview.subtotal,
+									},
+									{ title: formatMessage(messages.taxItem), amount: preview.tax },
+								]
+							: []
+					"
+				/>
+
+				<div class="mt-2 flex items-center pl-4 pr-2 py-3 bg-bg rounded-2xl gap-2 text-secondary">
+					<template v-if="loadingPreview && !paymentMethod">
+						<SpinnerIcon class="animate-spin" />
+					</template>
+					<FormattedPaymentMethod v-else-if="paymentMethod" :method="paymentMethod" />
+					<div v-else class="flex items-center gap-2 text-red">
+						<XIcon />
+						{{ formatMessage(messages.noPaymentMethod) }}
+					</div>
+					<Button
+						v-if="savedPaymentMethods.length > 0 || onAddPaymentMethod"
+						type="quiet"
+						size="xs"
+						class="ml-auto !h-6"
+						@click="choosingPaymentMethod = !choosingPaymentMethod"
 					>
-						<template #charge-date="{ children }">
-							<span class="font-semibold text-contrast"><component :is="() => children" /></span>
-						</template>
-					</IntlFormatted>
+						<EditIcon /> {{ formatMessage(messages.changePaymentMethod) }}
+					</Button>
+				</div>
+
+				<div
+					v-if="choosingPaymentMethod"
+					class="mt-2 flex flex-col gap-1 p-2 rounded-2xl bg-surface-2"
+				>
+					<PaymentMethodOption
+						v-for="method in savedPaymentMethods"
+						:key="method.id"
+						:item="method"
+						:selected="method.id === paymentMethod?.id"
+						:loading="method.id === settingPaymentMethodId"
+						@select="selectPaymentMethod(method)"
+					/>
+					<Button v-if="onAddPaymentMethod" type="quiet" @click="addPaymentMethod">
+						<PlusIcon /> {{ formatMessage(messages.addPaymentMethod) }}
+					</Button>
+				</div>
+
+				<p v-if="preview" class="m-0 mt-4 text-sm text-secondary leading-relaxed">
+					<template v-if="chargedNow">
+						{{
+							formatMessage(messages.chargedNow, {
+								total: formatPrice(preview.total, currency),
+								period,
+							})
+						}}
+					</template>
+					<template v-else>
+						<IntlFormatted
+							:message-id="messages.chargedOnDate"
+							:values="{
+								total: formatPrice(preview.total, currency),
+								period,
+								date: formattedDueDate,
+							}"
+						>
+							<template #charge-date="{ children }">
+								<span class="font-semibold text-contrast"><component :is="() => children" /></span>
+							</template>
+						</IntlFormatted>
+					</template>
+					<br />
+					<span class="font-semibold">{{ formatMessage(messages.recurringNotice) }}</span>
 				</p>
 			</template>
 			<template v-else>
@@ -92,49 +160,51 @@
 </template>
 
 <script setup lang="ts">
-import type { Labrinth } from '@modrinth/api-client'
-import { RotateCounterClockwiseIcon, XIcon } from '@modrinth/assets'
+import type { Archon, Labrinth } from '@modrinth/api-client'
+import {
+	EditIcon,
+	PlusIcon,
+	RotateCounterClockwiseIcon,
+	SpinnerIcon,
+	XIcon,
+} from '@modrinth/assets'
+import { useQueryClient } from '@tanstack/vue-query'
+import type Stripe from 'stripe'
 import { computed, ref, useTemplateRef } from 'vue'
 
 import { Button } from '#ui/components/base/buttons'
+import { injectModrinthClient } from '#ui/providers/api-client'
 import { injectNotificationManager } from '#ui/providers/web-notifications.ts'
 
 import { useFormatDateTime, useFormatPrice } from '../../composables'
 import { defineMessages, useVIntl } from '../../composables/i18n'
+import { regionOverrides } from '../../utils/regions'
 import IntlFormatted from '../base/IntlFormatted.vue'
+import TagItem from '../base/TagItem.vue'
 import { NewModal } from '../index'
+import ModrinthServersIcon from '../servers/ModrinthServersIcon.vue'
+import ExpandableInvoiceTotal from './ExpandableInvoiceTotal.vue'
+import FormattedPaymentMethod from './FormattedPaymentMethod.vue'
+import PaymentMethodOption from './PaymentMethodOption.vue'
+import ServersSpecs from './ServersSpecs.vue'
 
 const { addNotification } = injectNotificationManager()
 const { formatMessage } = useVIntl()
+const { labrinth } = injectModrinthClient()
+const queryClient = useQueryClient()
 
-type BillingInterval = Labrinth.Billing.Internal.PriceDuration
+const props = defineProps<{
+	paymentMethods?: Stripe.PaymentMethod[]
+	regions?: Archon.Servers.v1.Region[]
+	onAddPaymentMethod?: () => void
+}>()
 
 export type ResubscribeModalPayload = {
 	subscriptionId: string
 	wasSuspended: boolean
 	serverName: string
-	planName: string
-	ramGb?: number
-	storageGb?: number
-	sharedCpus?: number
-	priceCents?: number
-	currencyCode?: string
-	interval: BillingInterval
-	nextChargeDate?: string | number | Date
-}
-
-type ResubscribeModalState = {
-	subscriptionId: string
-	wasSuspended: boolean
-	serverName: string
-	planName: string
-	ramGb?: number
-	storageGb?: number
-	sharedCpus?: number
-	priceCents?: number
-	currencyCode?: string
-	interval: BillingInterval
-	nextChargeDate?: string | number | Date
+	plan?: Labrinth.Billing.Internal.Product | null
+	regionShortcode?: string
 }
 
 const emit = defineEmits<{
@@ -147,28 +217,67 @@ const formatPrice = useFormatPrice()
 
 const modal = useTemplateRef<InstanceType<typeof NewModal>>('modal')
 
-const modalData = ref<ResubscribeModalState | null>(null)
+const modalData = ref<ResubscribeModalPayload | null>(null)
+const preview = ref<Labrinth.Billing.Internal.ResubscribePreview | null>(null)
+const loadingPreview = ref(false)
+const previewError = ref(false)
+const choosingPaymentMethod = ref(false)
+const settingPaymentMethodId = ref<string | null>(null)
 
 const messages = defineMessages({
-	title: { id: 'billing.resubscribe-modal.title', defaultMessage: 'Resubscribe to Server' },
+	title: {
+		id: 'billing.resubscribe-modal.title',
+		defaultMessage: 'Resubscribe to Modrinth Hosting',
+	},
 	description: {
 		id: 'billing.resubscribe-modal.description',
 		defaultMessage:
 			'You are about to resubscribe to <server-name>{serverName}</server-name>. Your subscription will be reactivated and your server will continue running without interruption.',
 	},
-	planLabel: { id: 'billing.resubscribe-modal.plan-label', defaultMessage: 'Plan' },
-	ramLabel: { id: 'billing.resubscribe-modal.ram', defaultMessage: '{ramGb} GB RAM' },
-	storageLabel: {
-		id: 'billing.resubscribe-modal.storage',
-		defaultMessage: '{storageGb} GB Storage',
+	planItem: {
+		id: 'billing.resubscribe-modal.plan-item',
+		defaultMessage: 'Modrinth Hosting ({plan})',
+	},
+	taxItem: { id: 'billing.resubscribe-modal.tax-item', defaultMessage: 'Tax' },
+	planSmall: { id: 'billing.resubscribe-modal.plan.small', defaultMessage: 'Small' },
+	planMedium: { id: 'billing.resubscribe-modal.plan.medium', defaultMessage: 'Medium' },
+	planLarge: { id: 'billing.resubscribe-modal.plan.large', defaultMessage: 'Large' },
+	planCustom: { id: 'billing.resubscribe-modal.plan.custom', defaultMessage: 'Custom' },
+	period: {
+		id: 'billing.resubscribe-modal.period',
+		defaultMessage:
+			'{interval, select, fiveDays {5 days} monthly {month} quarterly {3 months} yearly {year} other {{interval}}}',
+	},
+	previewError: {
+		id: 'billing.resubscribe-modal.preview-error',
+		defaultMessage:
+			"We couldn't calculate the cost of resubscribing. Make sure your payment method has a billing address, then try again.",
 	},
-	cpusLabel: {
-		id: 'billing.resubscribe-modal.cpus',
-		defaultMessage: '{sharedCpus} Shared CPUs',
+	noPaymentMethod: {
+		id: 'billing.resubscribe-modal.no-payment-method',
+		defaultMessage: 'No payment method selected',
 	},
-	nextCharge: {
-		id: 'billing.resubscribe-modal.next-charge',
-		defaultMessage: 'Your next charge will be on <charge-date>{date}</charge-date>.',
+	changePaymentMethod: {
+		id: 'billing.resubscribe-modal.change-payment-method',
+		defaultMessage: 'Change',
+	},
+	addPaymentMethod: {
+		id: 'billing.resubscribe-modal.add-payment-method',
+		defaultMessage: 'Add payment method',
+	},
+	chargedNow: {
+		id: 'billing.resubscribe-modal.charged-now',
+		defaultMessage:
+			"You'll be charged {total} today, and then every {period} until you cancel. You can cancel anytime from your settings page.",
+	},
+	chargedOnDate: {
+		id: 'billing.resubscribe-modal.charged-on-date',
+		defaultMessage:
+			"You'll be charged {total} on <charge-date>{date}</charge-date>, and then every {period} until you cancel. You can cancel anytime from your settings page.",
+	},
+	recurringNotice: {
+		id: 'billing.resubscribe-modal.recurring-notice',
+		defaultMessage: 'By clicking "Resubscribe", you are resuming a recurring subscription.',
 	},
 	failedLoad: {
 		id: 'billing.resubscribe-modal.failed-load',
@@ -179,49 +288,144 @@ const messages = defineMessages({
 		id: 'billing.resubscribe-modal.resubscribe',
 		defaultMessage: 'Resubscribe',
 	},
-	interval: {
-		id: 'billing.resubscribe-modal.interval',
-		defaultMessage:
-			'{intervalOption, select, fiveDays {/5 days} monthly {/month} quarterly {/quarter} yearly {/year} other {{interval}}}',
-	},
 	errorTitle: { id: 'billing.resubscribe-modal.error.title', defaultMessage: 'Error' },
 	errorText: {
 		id: 'billing.resubscribe-modal.error.text',
 		defaultMessage: 'Cannot resubscribe, failed to load subscription details.',
 	},
+	paymentMethodErrorText: {
+		id: 'billing.resubscribe-modal.error.payment-method',
+		defaultMessage: 'Failed to change your payment method.',
+	},
 })
 
-const canResubscribe = computed(() => !!modalData.value?.subscriptionId)
+const savedPaymentMethods = computed(() => props.paymentMethods ?? [])
+
+const paymentMethod = computed(
+	() => (preview.value?.payment_method as Stripe.PaymentMethod | undefined) ?? undefined,
+)
 
-const intervalLabel = computed(() => {
-	const { interval } = modalData.value ?? {}
-	if (!interval) return null
+const currency = computed(() => preview.value?.currency_code ?? 'USD')
 
-	return formatMessage(messages.interval, {
-		interval,
-		intervalOption: interval === 'five-days' ? 'fiveDays' : interval,
+const period = computed(() => {
+	const interval = preview.value?.interval
+	if (!interval) return undefined
+	return formatMessage(messages.period, {
+		interval: interval === 'five-days' ? 'fiveDays' : interval,
 	})
 })
 
-const formattedPrice = computed(() => {
-	const { priceCents, currencyCode } = modalData.value ?? {}
-	if (priceCents == null || currencyCode == null) return ''
-	return formatPrice(priceCents, currencyCode)
+const dueDate = computed(() => {
+	if (!preview.value) return null
+	const date = new Date(preview.value.due)
+	return Number.isNaN(date.getTime()) ? null : date
 })
 
-const normalizedNextChargeDate = computed(() => {
-	if (!modalData.value?.nextChargeDate) return null
-	const date = new Date(modalData.value.nextChargeDate)
-	if (Number.isNaN(date.getTime())) {
-		return null
+const chargedNow = computed(() => !dueDate.value || dueDate.value.getTime() <= Date.now())
+
+const formattedDueDate = computed(() => (dueDate.value ? formatDate(dueDate.value) : ''))
+
+const canResubscribe = computed(
+	() =>
+		!!modalData.value?.subscriptionId &&
+		!!preview.value &&
+		!!paymentMethod.value &&
+		!loadingPreview.value &&
+		!settingPaymentMethodId.value,
+)
+
+const planName = computed(() => {
+	const metadata = modalData.value?.plan?.metadata
+	if (!metadata || (metadata.type !== 'pyro' && metadata.type !== 'medal')) {
+		return formatMessage(messages.planCustom)
+	}
+	switch (metadata.ram) {
+		case 4096:
+			return formatMessage(messages.planSmall)
+		case 6144:
+			return formatMessage(messages.planMedium)
+		case 8192:
+			return formatMessage(messages.planLarge)
+		default:
+			return formatMessage(messages.planCustom)
 	}
-	return date
 })
 
-const formattedNextChargeDate = computed(() =>
-	normalizedNextChargeDate.value ? formatDate(normalizedNextChargeDate.value) : '',
+const planSpecs = computed(() => {
+	const metadata = modalData.value?.plan?.metadata
+	if (metadata?.type === 'pyro' || metadata?.type === 'medal') {
+		return { ram: metadata.ram, storage: metadata.storage, cpu: metadata.cpu }
+	}
+	return null
+})
+
+const region = computed(() =>
+	modalData.value?.regionShortcode
+		? props.regions?.find((r) => r.shortcode === modalData.value?.regionShortcode)
+		: undefined,
+)
+const regionFlag = computed(() =>
+	region.value
+		? (regionOverrides[region.value.shortcode]?.flag ??
+			`https://flagcdn.com/${region.value.country_code}.svg`)
+		: undefined,
+)
+const regionOverrideTitle = computed(() =>
+	region.value ? regionOverrides[region.value.shortcode]?.name : undefined,
+)
+const regionTitle = computed(() =>
+	regionOverrideTitle.value ? formatMessage(regionOverrideTitle.value) : region.value?.display_name,
+)
+const regionSubtitle = computed(() =>
+	regionOverrideTitle.value ? region.value?.display_name : undefined,
 )
 
+async function loadPreview() {
+	if (!modalData.value) return
+	const subscriptionId = modalData.value.subscriptionId
+
+	loadingPreview.value = true
+	previewError.value = false
+	try {
+		const result = await labrinth.billing_internal.previewResubscribe(subscriptionId)
+		if (modalData.value?.subscriptionId === subscriptionId) {
+			preview.value = result
+		}
+	} catch {
+		if (modalData.value?.subscriptionId === subscriptionId) {
+			preview.value = null
+			previewError.value = true
+		}
+	} finally {
+		loadingPreview.value = false
+	}
+}
+
+async function selectPaymentMethod(method: Stripe.PaymentMethod) {
+	if (method.id === paymentMethod.value?.id || settingPaymentMethodId.value) return
+
+	settingPaymentMethodId.value = method.id
+	try {
+		await labrinth.billing_internal.editPaymentMethod(method.id, { primary: true })
+		await queryClient.invalidateQueries({ queryKey: ['billing', 'customer'] })
+		await loadPreview()
+		choosingPaymentMethod.value = false
+	} catch {
+		addNotification({
+			type: 'error',
+			title: formatMessage(messages.errorTitle),
+			text: formatMessage(messages.paymentMethodErrorText),
+		})
+	} finally {
+		settingPaymentMethodId.value = null
+	}
+}
+
+function addPaymentMethod() {
+	hide()
+	props.onAddPaymentMethod?.()
+}
+
 function show(payload: ResubscribeModalPayload) {
 	if (!payload) {
 		addNotification({
@@ -232,26 +436,21 @@ function show(payload: ResubscribeModalPayload) {
 		return
 	}
 
-	modalData.value = {
-		subscriptionId: payload.subscriptionId,
-		wasSuspended: payload.wasSuspended,
-		serverName: payload.serverName.trim(),
-		planName: payload.planName,
-		ramGb: payload.ramGb,
-		storageGb: payload.storageGb,
-		sharedCpus: payload.sharedCpus,
-		priceCents: payload.priceCents,
-		currencyCode: payload.currencyCode,
-		interval: payload.interval,
-		nextChargeDate: payload.nextChargeDate,
-	}
+	modalData.value = { ...payload, serverName: payload.serverName.trim() }
+	preview.value = null
+	choosingPaymentMethod.value = false
 	modal.value?.show()
+	void loadPreview()
 }
 
 function hide() {
 	modal.value?.hide()
 }
 
+function handleHide() {
+	choosingPaymentMethod.value = false
+}
+
 function handleCancel() {
 	hide()
 	emit('cancel')
diff --git a/packages/ui/src/components/billing/ServersPurchase3Review.vue b/packages/ui/src/components/billing/ServersPurchase3Review.vue
index ffd2ba6b343..d6f5b2d6ca8 100644
--- a/packages/ui/src/components/billing/ServersPurchase3Review.vue
+++ b/packages/ui/src/components/billing/ServersPurchase3Review.vue
@@ -330,8 +330,8 @@ function setInterval(newInterval: ServerBillingInterval) {
 			<SpinnerIcon v-if="loading" class="animate-spin relative top-0.5 mx-2" /><template v-else>{{
 				formatPrice(total, currency)
 			}}</template>
-			every {{ period }} plus applicable taxes starting today, until you cancel. You can cancel
-			anytime from your settings page.
+			every {{ period }} starting today, until you cancel. You can cancel anytime from your settings
+			page.
 		</template>
 		<br />
 		<span class="font-semibold"
diff --git a/packages/ui/src/layouts/wrapped/hosting/manage/index.vue b/packages/ui/src/layouts/wrapped/hosting/manage/index.vue
index 87a88f910ed..f73b517e6e3 100644
--- a/packages/ui/src/layouts/wrapped/hosting/manage/index.vue
+++ b/packages/ui/src/layouts/wrapped/hosting/manage/index.vue
@@ -41,7 +41,12 @@
 			:site-url="props.siteUrl"
 			:products="props.products"
 		/>
-		<ResubscribeModal ref="resubscribeModal" @resubscribe="handleResubscribeConfirm" />
+		<ResubscribeModal
+			ref="resubscribeModal"
+			:payment-methods="paymentMethods"
+			:regions="regions"
+			@resubscribe="handleResubscribeConfirm"
+		/>
 
 		<div
 			v-if="hasError"
@@ -791,88 +796,19 @@ function getProductFromPriceId(priceId: string | null | undefined) {
 	)
 }
 
-function getPlanName(product: Labrinth.Billing.Internal.Product | null): string {
-	if (!product) return 'Medium plan'
-	if (product.metadata.type !== 'pyro' && product.metadata.type !== 'medal') return 'Medium plan'
-
-	switch (product.metadata.ram) {
-		case 4096:
-			return 'Small plan'
-		case 6144:
-			return 'Medium plan'
-		case 8192:
-			return 'Large plan'
-		default:
-			return 'Custom plan'
-	}
-}
-
-function getRamGb(product: Labrinth.Billing.Internal.Product | null): number | undefined {
-	if (!product) return undefined
-	if (product.metadata.type !== 'pyro' && product.metadata.type !== 'medal') return undefined
-
-	return product.metadata.ram / 1024
-}
-
-function getStorageGb(product: Labrinth.Billing.Internal.Product | null): number | undefined {
-	if (!product) return undefined
-	if (product.metadata.type !== 'pyro' && product.metadata.type !== 'medal') return undefined
-
-	return product.metadata.storage / 1024
-}
-
-function getSharedCpus(product: Labrinth.Billing.Internal.Product | null): number | undefined {
-	if (!product) return undefined
-	if (product.metadata.type !== 'pyro' && product.metadata.type !== 'medal') return undefined
-
-	return product.metadata.cpu / 2
-}
-
-function getRecurringPrice(
-	product: Labrinth.Billing.Internal.Product | null,
-	interval: Labrinth.Billing.Internal.PriceDuration,
-	preferredCurrency?: string,
-): { amount: number; currencyCode: string } | null {
-	if (!product) return null
-
-	const recurringPrices = product.prices.filter((price) => price.prices.type === 'recurring')
-	const preferredPrice = preferredCurrency
-		? recurringPrices.find((price) => price.currency_code === preferredCurrency)
-		: undefined
-	const usdPrice = recurringPrices.find((price) => price.currency_code === 'USD')
-	const selectedPrice = preferredPrice ?? usdPrice ?? recurringPrices[0]
-
-	if (!selectedPrice || selectedPrice.prices.type !== 'recurring') return null
-
-	return {
-		amount: selectedPrice.prices.intervals[interval],
-		currencyCode: selectedPrice.currency_code,
-	}
-}
-
 function openResubscribeModal(
 	serverId: string,
 	subscription: Labrinth.Billing.Internal.UserSubscription,
 	charge?: Labrinth.Billing.Internal.Charge | null,
 ) {
-	const displayInterval = charge?.subscription_interval ?? subscription.interval
-	const displayPriceId = charge?.price_id ?? subscription.price_id
-	const product = getProductFromPriceId(displayPriceId)
-	const fallbackPrice = getRecurringPrice(product, displayInterval, charge?.currency_code)
-
 	resubscribeModal.value?.show({
 		subscriptionId: subscription.id,
 		wasSuspended: !!charge?.due && dayjs(charge.due).isBefore(dayjs()),
 		serverName:
 			serverList.value.find((server) => server.server_id === serverId)?.name ?? 'this server',
-		planName: getPlanName(product),
-		ramGb: getRamGb(product),
-		storageGb: getStorageGb(product),
-		sharedCpus: getSharedCpus(product),
-		priceCents: charge?.amount ?? fallbackPrice?.amount,
-		currencyCode: charge?.currency_code ?? fallbackPrice?.currencyCode,
-		interval: displayInterval,
-		nextChargeDate: charge?.due,
+		plan: getProductFromPriceId(charge?.price_id ?? subscription.price_id),
+		regionShortcode:
+			subscription.metadata?.type === 'pyro' ? subscription.metadata.region : undefined,
 	})
 }
 
diff --git a/packages/ui/src/locales/ar-SA/index.json b/packages/ui/src/locales/ar-SA/index.json
index 236ce592416..5d3b57cbc1f 100644
--- a/packages/ui/src/locales/ar-SA/index.json
+++ b/packages/ui/src/locales/ar-SA/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "إلغاء"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} وحدات المعالجة المركزية المشتركة"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "أنت على وشك إعادة الاشتراك في <server-name>{serverName}</server-name>. سيتم إعادة تنشيط اشتراكك وسيستمر الخادم الخاص بك في العمل دون انقطاع."
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "فشل تحميل تفاصيل الاشتراك."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5 أيام} monthly {/شهر} quarterly {/ربع سنة} yearly {/سنة} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "سيتم تحصيل الرسوم التالية في <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "خطة"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} جيجا بايت رام"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "إعادة الاشتراك"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB مساحة تخزين"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "إعادة الاشتراك في الخادم"
   },
@@ -1905,4 +1887,3 @@
     "defaultMessage": "ماينكرافت: إصدار جافا"
   }
 }
-
diff --git a/packages/ui/src/locales/cs-CZ/index.json b/packages/ui/src/locales/cs-CZ/index.json
index 25bf06feb3b..0821a0911c5 100644
--- a/packages/ui/src/locales/cs-CZ/index.json
+++ b/packages/ui/src/locales/cs-CZ/index.json
@@ -23,9 +23,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Zrušit"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} Sdílené procesory"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Chystáte se znovu přihlásit k odběru <server-name>{serverName}</server-name>. Vaše předplatné bude znovu aktivováno a váš server bude pokračovat v provozu bez přerušení."
   },
@@ -38,24 +35,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Nepodařilo se načíst podrobnosti předplatného."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5 dní} monthly {/měsíc} quarterly {/čtvrtletí} yearly {/rok} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Další platba bude provedena <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Plán"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB RAM"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Znovu se přihlásit k odběru"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB Úložiště"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Znovu se přihlásit k odběru serveru"
   },
@@ -5124,4 +5106,3 @@
     "defaultMessage": "Typ"
   }
 }
-
diff --git a/packages/ui/src/locales/da-DK/index.json b/packages/ui/src/locales/da-DK/index.json
index bdfacaf5f8a..179017a9108 100644
--- a/packages/ui/src/locales/da-DK/index.json
+++ b/packages/ui/src/locales/da-DK/index.json
@@ -20,27 +20,12 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Annuller"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} Delte CPU'er"
-  },
   "billing.resubscribe-modal.error.title": {
     "defaultMessage": "Fejl"
   },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Din næste opkrævning vil være den <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Plan"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB RAM"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Genabonner"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB Lagerplads"
-  },
   "browse.filter-results": {
     "defaultMessage": "Filtrer resultater..."
   },
@@ -2172,4 +2157,3 @@
     "defaultMessage": "Du har ændringer, der ikke er gemt"
   }
 }
-
diff --git a/packages/ui/src/locales/de-CH/index.json b/packages/ui/src/locales/de-CH/index.json
index 7ed487d6c05..6d178fbde21 100644
--- a/packages/ui/src/locales/de-CH/index.json
+++ b/packages/ui/src/locales/de-CH/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Abbrechen"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} Geteilte CPUs"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Du bist dabei, dein Abonnement für <server-name>{serverName}</server-name> zu verlängern. Dein Abonnement wird reaktiviert und dein Server läuft ohne Unterbrechung weiter."
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Details zum Abonnement konnten nicht geladen werden."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5 Tage} monthly {/Monat} quarterly {/Quartal} yearly {/Jahr} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Deine nächste Abrechnung erfolgt am <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Plan"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB RAM"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Erneut abonnieren"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB Speicherplatz"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Server erneut abonnieren"
   },
@@ -7476,4 +7458,3 @@
     "defaultMessage": "Typ"
   }
 }
-
diff --git a/packages/ui/src/locales/de-DE/index.json b/packages/ui/src/locales/de-DE/index.json
index 477e9239d30..04e17b8b384 100644
--- a/packages/ui/src/locales/de-DE/index.json
+++ b/packages/ui/src/locales/de-DE/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Abbrechen"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} geteilte CPUs"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Du bist dabei, dein Abonnement für <server-name>{serverName}</server-name> zu verlängern. Dein Abonnement wird reaktiviert und dein Server läuft ohne Unterbrechung weiter."
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Details zum Abonnement konnten nicht geladen werden."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5 Tage} monthly {/Monat} quarterly {/Vierteljahr} yearly {/Jahr} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Deine nächste Abrechnung erfolgt am <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Plan"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB RAM"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Erneut abonnieren"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB Speicherplatz"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Server erneut abonnieren"
   },
@@ -7476,4 +7458,3 @@
     "defaultMessage": "Typ"
   }
 }
-
diff --git a/packages/ui/src/locales/en-US/index.json b/packages/ui/src/locales/en-US/index.json
index 9f11bebdfdd..f47ea96f51c 100644
--- a/packages/ui/src/locales/en-US/index.json
+++ b/packages/ui/src/locales/en-US/index.json
@@ -26,15 +26,27 @@
   "badge.release": {
     "defaultMessage": "Release"
   },
+  "billing.resubscribe-modal.add-payment-method": {
+    "defaultMessage": "Add payment method"
+  },
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Cancel"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} Shared CPUs"
+  "billing.resubscribe-modal.change-payment-method": {
+    "defaultMessage": "Change"
+  },
+  "billing.resubscribe-modal.charged-now": {
+    "defaultMessage": "You'll be charged {total} today, and then every {period} until you cancel. You can cancel anytime from your settings page."
+  },
+  "billing.resubscribe-modal.charged-on-date": {
+    "defaultMessage": "You'll be charged {total} on <charge-date>{date}</charge-date>, and then every {period} until you cancel. You can cancel anytime from your settings page."
   },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "You are about to resubscribe to <server-name>{serverName}</server-name>. Your subscription will be reactivated and your server will continue running without interruption."
   },
+  "billing.resubscribe-modal.error.payment-method": {
+    "defaultMessage": "Failed to change your payment method."
+  },
   "billing.resubscribe-modal.error.text": {
     "defaultMessage": "Cannot resubscribe, failed to load subscription details."
   },
@@ -44,26 +56,41 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Failed to load subscription details."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5 days} monthly {/month} quarterly {/quarter} yearly {/year} other {{interval}}}"
+  "billing.resubscribe-modal.no-payment-method": {
+    "defaultMessage": "No payment method selected"
   },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Your next charge will be on <charge-date>{date}</charge-date>."
+  "billing.resubscribe-modal.period": {
+    "defaultMessage": "{interval, select, fiveDays {5 days} monthly {month} quarterly {3 months} yearly {year} other {{interval}}}"
   },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Plan"
+  "billing.resubscribe-modal.plan-item": {
+    "defaultMessage": "Modrinth Hosting ({plan})"
+  },
+  "billing.resubscribe-modal.plan.custom": {
+    "defaultMessage": "Custom"
+  },
+  "billing.resubscribe-modal.plan.large": {
+    "defaultMessage": "Large"
+  },
+  "billing.resubscribe-modal.plan.medium": {
+    "defaultMessage": "Medium"
+  },
+  "billing.resubscribe-modal.plan.small": {
+    "defaultMessage": "Small"
+  },
+  "billing.resubscribe-modal.preview-error": {
+    "defaultMessage": "We couldn't calculate the cost of resubscribing. Make sure your payment method has a billing address, then try again."
   },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB RAM"
+  "billing.resubscribe-modal.recurring-notice": {
+    "defaultMessage": "By clicking \"Resubscribe\", you are resuming a recurring subscription."
   },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Resubscribe"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB Storage"
+  "billing.resubscribe-modal.tax-item": {
+    "defaultMessage": "Tax"
   },
   "billing.resubscribe-modal.title": {
-    "defaultMessage": "Resubscribe to Server"
+    "defaultMessage": "Resubscribe to Modrinth Hosting"
   },
   "browse.advanced-filters.apply-saved-preferences": {
     "defaultMessage": "Apply saved preferences"
diff --git a/packages/ui/src/locales/es-419/index.json b/packages/ui/src/locales/es-419/index.json
index 30c42bd27aa..1edded446a1 100644
--- a/packages/ui/src/locales/es-419/index.json
+++ b/packages/ui/src/locales/es-419/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Cancelar"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} CPUs compartidas"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Estás a punto de renovar tu suscripción a <server-name>{serverName}</server-name>. Tu suscripción se reactivará y tu servidor seguirá funcionando sin interrupciones."
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Error al cargar los detalles de la suscripción."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/cada 5 días} monthly {/mensuales} quarterly {/trimestrales} yearly {/anuales} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Tu próximo cargo será el <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Plan"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB de RAM"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Renovar suscripción"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB de Almacenamiento"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Renovar suscripción del servidor"
   },
@@ -7407,4 +7389,3 @@
     "defaultMessage": "Tipo"
   }
 }
-
diff --git a/packages/ui/src/locales/es-ES/index.json b/packages/ui/src/locales/es-ES/index.json
index 43a51fa90c2..0003400ddb3 100644
--- a/packages/ui/src/locales/es-ES/index.json
+++ b/packages/ui/src/locales/es-ES/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Cancelar"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} CPUs compartidas"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Estas a punto de renovar tu suscripción a <server-name>{serverName}</server-name>. Tu suscripción será reactivada y tu servidor seguirá funcionando ininterrumpidamente."
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "No se ha podido cargar los detalles de la suscripción."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/cada 5 días} monthly {/mensuales} quarterly {/trimestrales} yearly {/anuales} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Tu próximo pago se cobrará el <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Plan"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB de RAM"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Volver a suscribirse"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB de almacenamiento"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Resuscribirse al servidor"
   },
diff --git a/packages/ui/src/locales/fi-FI/index.json b/packages/ui/src/locales/fi-FI/index.json
index d153457f9e1..4fd8feb3ec4 100644
--- a/packages/ui/src/locales/fi-FI/index.json
+++ b/packages/ui/src/locales/fi-FI/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Takaisin"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} Jaettua prosessoria"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Olet aikomassa uudelleentilata palvelimen <server-name>{serverName}</server-name>. Tilauksesi uudelleenaktivoidaan ja palvelimesi jatkaa toimintaa ilman pysäytyksiä."
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Tilaustietojen lataus epäonnistui."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5 päivää} monthly {/kuukausi} quarterly {/neljännesvuosi} yearly {/vuosi} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Seuraava maksupäiväsi on <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Suunnitelma"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB RAM"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Uudelleentilaa"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB Tallennustilaa"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Uudelleentilaa palvelimelle"
   },
@@ -1209,4 +1191,3 @@
     "defaultMessage": "Sinulla on tallentamattomia muutoksia."
   }
 }
-
diff --git a/packages/ui/src/locales/fil-PH/index.json b/packages/ui/src/locales/fil-PH/index.json
index 646da7d4c83..ecbbaf1c5f9 100644
--- a/packages/ui/src/locales/fil-PH/index.json
+++ b/packages/ui/src/locales/fil-PH/index.json
@@ -17,9 +17,6 @@
   "billing.resubscribe-modal.error.title": {
     "defaultMessage": "Error"
   },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Plan"
-  },
   "browse.view-prefix": {
     "defaultMessage": "Tingnan:"
   },
@@ -2685,4 +2682,3 @@
     "defaultMessage": "Uri"
   }
 }
-
diff --git a/packages/ui/src/locales/fr-FR/index.json b/packages/ui/src/locales/fr-FR/index.json
index 4e35e279ef1..9cd7ee2d284 100644
--- a/packages/ui/src/locales/fr-FR/index.json
+++ b/packages/ui/src/locales/fr-FR/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Annuler"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} CPU partagés"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Vous êtes sur le point de vous réabonner à <server-name>{serverName}</server-name>. Votre abonnement sera réactivé et votre serveur pourra continuer à fonctionner sans interruption."
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Impossible de charger les détails de l'abonnement."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {tous les 5 jours} monthly {par mois} quarterly {par trimestre} yearly {par an} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Votre prochain paiement sera le <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Forfait"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} Go de mémoire RAM"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Se réabonner"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} Go de stockage"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Se réabonner au serveur"
   },
diff --git a/packages/ui/src/locales/he-IL/index.json b/packages/ui/src/locales/he-IL/index.json
index ce129d73e71..44dad9caaea 100644
--- a/packages/ui/src/locales/he-IL/index.json
+++ b/packages/ui/src/locales/he-IL/index.json
@@ -32,9 +32,6 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "טעינת פרטי המנוי נכשלה."
   },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "תוכנית"
-  },
   "browse.no-results": {
     "defaultMessage": "לא נמצאו תוצאות עבור החיפוש!"
   },
diff --git a/packages/ui/src/locales/hu-HU/index.json b/packages/ui/src/locales/hu-HU/index.json
index da7c8c18b45..b8a60ab1119 100644
--- a/packages/ui/src/locales/hu-HU/index.json
+++ b/packages/ui/src/locales/hu-HU/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Mégse"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} megosztott processzormag"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Ön újra elő fog fizetni <server-name>{serverName}</server-name> szerverre. Az előfizetése újra fog aktiválódni és a szervere kimaradás nélkül tovább fog működni."
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Nem sikerült betölteni az előfizetés adatait."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5 nap} monthly {/hónap} quarterly {/negyedév} yearly {/év} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Következő befizetés: <charge-date>{date}</charge-date> napon."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Csomag"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB memória"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Feliratkozás újra"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB tárhely"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Újra feliratkozás szerverre"
   },
diff --git a/packages/ui/src/locales/id-ID/index.json b/packages/ui/src/locales/id-ID/index.json
index af5fceafe53..ae7b2df9bef 100644
--- a/packages/ui/src/locales/id-ID/index.json
+++ b/packages/ui/src/locales/id-ID/index.json
@@ -20,9 +20,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Batal"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} CPU Bersama"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Anda akan segera berlangganan ulang ke <server-name>{serverName}</server-name>. Langganan Anda akan diaktifkan kembali dan server Anda akan terus berjalan tanpa gangguan."
   },
@@ -35,24 +32,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Gagal memuat perincian langganan."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5 hari} monthly {/bulan} quarterly {/kuartal} yearly {/tahun} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Tagihan Anda berikutnya akan jatuh tempo pada <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Langganan"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "RAM {ramGb} GB"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Berlangganan kembali"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "Penyimpanan {storageGb} GB"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Berlangganan ulang ke Server"
   },
@@ -2904,4 +2886,3 @@
     "defaultMessage": "Anda memiliki perubahan yang belum tersimpan."
   }
 }
-
diff --git a/packages/ui/src/locales/it-IT/index.json b/packages/ui/src/locales/it-IT/index.json
index e0c788490cb..f028273c2df 100644
--- a/packages/ui/src/locales/it-IT/index.json
+++ b/packages/ui/src/locales/it-IT/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Annulla"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} CPU condivise"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Stai per riabbonarti al server <server-name>{serverName}</server-name>. L'abbonamento sarà riattivato e il tuo server continuerà a funzionare senza interruzioni."
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Impossibile caricare i dati dell'abbonamento."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5 giorni} monthly {/mese} quarterly {/trimestre} yearly {/anno} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Il prossimo addebito avverrà il <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Piano"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB RAM"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Riabbonati"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB spazio"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Riabbonamento al server"
   },
@@ -7476,4 +7458,3 @@
     "defaultMessage": "Tipo"
   }
 }
-
diff --git a/packages/ui/src/locales/ja-JP/index.json b/packages/ui/src/locales/ja-JP/index.json
index c73bdf1dbc8..29531c2d627 100644
--- a/packages/ui/src/locales/ja-JP/index.json
+++ b/packages/ui/src/locales/ja-JP/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "キャンセル"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "CPU {sharedCpus}コア (共有)"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "<server-name>{serverName}</server-name> への再登録を行おうとしています。登録が再開され、サーバーは中断なく稼働し続けます。"
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "サブスクリプション情報の読み込みに失敗しました。"
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5日} monthly {/月} quarterly {/3ヵ月} yearly {/年} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "次回の請求は<charge-date>{date}</charge-date>です。"
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "プラン"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb}GB RAM"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "もう一度購読する"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "ストレージ {storageGb}GB"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "サーバーに再登録"
   },
@@ -6186,4 +6168,3 @@
     "defaultMessage": "タイプ"
   }
 }
-
diff --git a/packages/ui/src/locales/ko-KR/index.json b/packages/ui/src/locales/ko-KR/index.json
index a055fb4f492..4a3e3f5b6d6 100644
--- a/packages/ui/src/locales/ko-KR/index.json
+++ b/packages/ui/src/locales/ko-KR/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "취소"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "공유 CPU {sharedCpus}개"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "<server-name>{serverName}</server-name> 서버에 다시 구독하려고 합니다. 구독이 재활성화되며, 서버는 중단 없이 계속 실행됩니다."
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "구독 정보를 불러오는 데 실패했습니다."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5일} monthly {/월} quarterly {/3개월} yearly {/년} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "다음 결제일은 <charge-date>{date}</charge-date>입니다."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "플랜"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb}GB 램"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "재구독"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb}GB 저장소"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "서버 다시 구독"
   },
diff --git a/packages/ui/src/locales/ms-MY/index.json b/packages/ui/src/locales/ms-MY/index.json
index 803befb103f..e84e6494396 100644
--- a/packages/ui/src/locales/ms-MY/index.json
+++ b/packages/ui/src/locales/ms-MY/index.json
@@ -23,9 +23,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Batal"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} CPU Berkongsi"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Anda akan melanggan semula pelayan <server-name>{serverName}</server-name>. Langganan anda akan diaktifkan semula dan pelayan anda akan terus berjalan tanpa gangguan."
   },
@@ -38,24 +35,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Gagal memuat butiran langganan."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5 hari} monthly {/bulan} quarterly {/4 bulan} yearly {/tahun} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Caj anda yang seterusnya akan dikenakan pada <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Pelan"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "RAM {ramGb} GB"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Langgan semula"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "Penyimpanan {storageGb} GB"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Langgan semula ke Pelayan"
   },
@@ -4881,4 +4863,3 @@
     "defaultMessage": "Jenis"
   }
 }
-
diff --git a/packages/ui/src/locales/nl-NL/index.json b/packages/ui/src/locales/nl-NL/index.json
index 909f314ef20..0660b6d2bac 100644
--- a/packages/ui/src/locales/nl-NL/index.json
+++ b/packages/ui/src/locales/nl-NL/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Annuleren"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} Gedeelde CPU's"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Je staat op het punt je abonnement op <server-name>{serverName}</server-name> te verlengen. Je abonnement wordt opnieuw geactiveerd en je server blijft zonder onderbreking draaien."
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Laden van abonnementsgegevens is mislukt."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5 dagen} monthly {/maand} quarterly {/kwartaal} yearly {/jaar} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Je volgende afschrijving vindt plaats op <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Plan"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB RAM"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Opnieuw abonneren"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB Opslag"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Opnieuw abonneren op de server"
   },
diff --git a/packages/ui/src/locales/no-NO/index.json b/packages/ui/src/locales/no-NO/index.json
index 721bc809f53..d6195fcb5eb 100644
--- a/packages/ui/src/locales/no-NO/index.json
+++ b/packages/ui/src/locales/no-NO/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Avbryt"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} Delte CPU-er"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Du er i ferd med å abonnere på <server-name>{serverName}</server-name> på nytt. Abonnementet ditt blir reaktivert, og serveren din fortsetter å kjøre uten avbrudd."
   },
@@ -44,21 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Kunne ikke laste inn abonnementsdetaljer."
   },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Din neste betaling skjer <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Plan"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB RAM"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Abonner på nytt"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB Lagringsplass"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Abonner på nytt på server"
   },
@@ -2757,4 +2742,3 @@
     "defaultMessage": "Du har ulagrede endringer."
   }
 }
-
diff --git a/packages/ui/src/locales/pl-PL/index.json b/packages/ui/src/locales/pl-PL/index.json
index 98ea3ff28a9..5dc8ce687da 100644
--- a/packages/ui/src/locales/pl-PL/index.json
+++ b/packages/ui/src/locales/pl-PL/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Anuluj"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} współdzielonych procesorów"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Zamierzasz ponownie subskrybować <server-name>{serverName}</server-name>. Twoja subskrypcja zostanie ponownie aktywowana i twój serwer będzie pracował bez przerywania."
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Nie udało się załadować szczegółów subskrypcji."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5 dni} monthly {miesięcznie} quarterly {kwartalnie} yearly {rocznie} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Następna opłata zostanie pobrana dnia <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Plan"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB pamięci RAM"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Odnów subskrypcję"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB miejsca na dysku"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Wznów subskrypcję serwera"
   },
diff --git a/packages/ui/src/locales/pt-BR/index.json b/packages/ui/src/locales/pt-BR/index.json
index 33a6d7ea513..25f08d44487 100644
--- a/packages/ui/src/locales/pt-BR/index.json
+++ b/packages/ui/src/locales/pt-BR/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Cancelar"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} CPUs compartilhadas"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Você está prestes a se reinscrever em <server-name>{serverName}</server-name>. Sua assinatura será reativada e seu servidor continuará funcionando sem interrupções."
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Não foi possível carregar os detalhes da assinatura."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5 dias} monthly {/mes} quarterly {/trimestre} yearly {/ano} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Sua próxima cobrança será em <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Plano"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB de RAM"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Reassinar"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB de armazenamento"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Reassinar Servidor"
   },
@@ -7476,4 +7458,3 @@
     "defaultMessage": "Tipo"
   }
 }
-
diff --git a/packages/ui/src/locales/pt-PT/index.json b/packages/ui/src/locales/pt-PT/index.json
index e296e794c5f..726faf537a0 100644
--- a/packages/ui/src/locales/pt-PT/index.json
+++ b/packages/ui/src/locales/pt-PT/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Cancelar"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} CPUs Compartilhadas"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Você está prestes a renovar a assinatura do <server-name>{serverName}</server-name>. Sua assinatura será reativada e o seu servidor continuará rodando sem interrupção."
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Falha ao carregar detalhes da assinatura."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5 Dias} monthly {/mensal} quarterly {/trimestral} yearly {/anual} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "A sua próxima cobrança será em <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Plano"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB de RAM"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Reativar"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB de Armazenamento"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Renovar Servidor"
   },
@@ -2994,4 +2976,3 @@
     "defaultMessage": "Tipo"
   }
 }
-
diff --git a/packages/ui/src/locales/ro-RO/index.json b/packages/ui/src/locales/ro-RO/index.json
index 8bb8508ded2..fe6275dea1d 100644
--- a/packages/ui/src/locales/ro-RO/index.json
+++ b/packages/ui/src/locales/ro-RO/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Anulează"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} CPU-uri Distribuite"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Ești pe cale sa te reabonezi la <server-name>{serverName}</server-name>. Abonamentul tău va fi reactivat, si serverul tău va continua să ruleze fără întreruperi."
   },
@@ -44,21 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Detaliile abonamentului au eșuat sa se încarce."
   },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Următoarea taxă va fi pe <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Plan"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB RAM"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Reabonează-te"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB Stocare"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Reabonează-te la Server"
   },
diff --git a/packages/ui/src/locales/ru-RU/index.json b/packages/ui/src/locales/ru-RU/index.json
index 4470f9cd92a..b17e016a37e 100644
--- a/packages/ui/src/locales/ru-RU/index.json
+++ b/packages/ui/src/locales/ru-RU/index.json
@@ -41,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Не удалось загрузить данные о подписке."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {в 5 дней} monthly {в месяц} quarterly {в 3 месяца} yearly {в год} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Следующее списание — <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "План"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} ГБ ОЗУ"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Возобновить подписку"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} ГБ диска"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Возобновление подписки на сервер"
   },
diff --git a/packages/ui/src/locales/sr-CS/index.json b/packages/ui/src/locales/sr-CS/index.json
index a6443455b41..850df009c0c 100644
--- a/packages/ui/src/locales/sr-CS/index.json
+++ b/packages/ui/src/locales/sr-CS/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Otkaži"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} zajedničkih procesora"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Upravo ćes se ponovo pretplatiti na <server-name>{serverName}</server-name>. Tvoja pretplata će biti ponovo aktivirana i tvoj server će nastaviti da radi bez prekida."
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Greška sa učitavanjem detalja pretplate."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5 dana} monthly {/mesec} quarterly {/tromesečno} yearly {/godinu} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Tvoja sledeća naplata će biti u <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Plan"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB radne memorije"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Ponovno se pretplati"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB memorije"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Ponovna pretplata"
   },
@@ -6342,4 +6324,3 @@
     "defaultMessage": "Tip"
   }
 }
-
diff --git a/packages/ui/src/locales/sv-SE/index.json b/packages/ui/src/locales/sv-SE/index.json
index bbc73b538f2..f3941fd8de1 100644
--- a/packages/ui/src/locales/sv-SE/index.json
+++ b/packages/ui/src/locales/sv-SE/index.json
@@ -23,9 +23,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Avbryt"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} Delade CPUs"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Du är på väg att återprenumerera till <server-name>{serverName}</server-name>. Din prenumeration kommer återaktiveras och din server kommer fortsätta köra utan avbrott."
   },
@@ -38,24 +35,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Kunde inte att ladda in prenumerationsdetaljer."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5 dagar} monthly {/månad} quarterly {/kvartalsvis} yearly {/år} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Din nästa betalning är <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Plan"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB RAM"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Återprenumerera"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB lagring"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Återprenumerera till Server"
   },
diff --git a/packages/ui/src/locales/th-TH/index.json b/packages/ui/src/locales/th-TH/index.json
index e49fb9af161..ce9c154b2cb 100644
--- a/packages/ui/src/locales/th-TH/index.json
+++ b/packages/ui/src/locales/th-TH/index.json
@@ -11,12 +11,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "ยกเลิก"
   },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} กิกะไบต์ RAM"
-  },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} กิกะไบต์ พื้นที่จัดเก็บ"
-  },
   "button.accept": {
     "defaultMessage": "ยอมรับ"
   },
@@ -828,4 +822,3 @@
     "defaultMessage": "ผู้รับ Shader กลุ่มแรก"
   }
 }
-
diff --git a/packages/ui/src/locales/tr-TR/index.json b/packages/ui/src/locales/tr-TR/index.json
index 848a9a0f137..63a7f68e1bb 100644
--- a/packages/ui/src/locales/tr-TR/index.json
+++ b/packages/ui/src/locales/tr-TR/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "İptal"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} Paylaşılan işlemciler"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Şu anda <server-name>{serverName}</server-name> için yeniden abonelik işlemini başlatmak üzeresiniz. Aboneliğiniz tekrar etkinleştirilecek ve sunucunuz kesintisiz olarak çalışmaya devam edecektir."
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Abonelik detayları yüklenemedi."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5 days} monthly {/month} quarterly {/quarter} yearly {/year} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Bir sonraki ücretlendirmeniz <charge-date>{date}</charge-date> tarihinde yapılacaktır."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Plan"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB RAM"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Yeniden abone ol"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB Depolama"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Sunucuya Yeniden Abone Ol"
   },
diff --git a/packages/ui/src/locales/uk-UA/index.json b/packages/ui/src/locales/uk-UA/index.json
index 25ea1ff4a74..8e6f8f28d8c 100644
--- a/packages/ui/src/locales/uk-UA/index.json
+++ b/packages/ui/src/locales/uk-UA/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Скасувати"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} спільних ЦП"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Ви збираєтеся поновити передплату на <server-name>{serverName}</server-name>. Вашу передплату буде відновлено, а ваш сервер продовжить працювати без перерв."
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Не вдалося завантажити деталі передплати."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5 днів} monthly {/місяць} quarterly {/квартал} yearly {/рік} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Ваше наступне списання буде <charge-date>{date}</charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "План"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} ГБ ОЗП"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Підписатися повторно"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} ГБ сховища"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Підписатися повторно до сервера"
   },
diff --git a/packages/ui/src/locales/vi-VN/index.json b/packages/ui/src/locales/vi-VN/index.json
index b2fdcc18a22..b2888860abc 100644
--- a/packages/ui/src/locales/vi-VN/index.json
+++ b/packages/ui/src/locales/vi-VN/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "Hủy"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} CPU chia sẻ"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "Bạn chuẩn bị đăng ký lại <server-name> {serverName} </server-name>. Gói đăng ký của bạn sẽ được kích hoạt lại và máy chủ của bạn sẽ tiếp tục hoạt động."
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "Lỗi tải thông tin đăng ký."
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5 ngày} monthly {/tháng} quarterly {/ba tháng} yearly {/năm} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "Lần thanh toán tiếp theo sẽ là vào <charge-date> {date} </charge-date>."
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "Gói"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB RAM"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "Đăng ký lại"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB bộ nhớ"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "Đăng ký lại máy chủ"
   },
@@ -7182,4 +7164,3 @@
     "defaultMessage": "Loại"
   }
 }
-
diff --git a/packages/ui/src/locales/zh-CN/index.json b/packages/ui/src/locales/zh-CN/index.json
index 3d86781570d..69e0c1b7659 100644
--- a/packages/ui/src/locales/zh-CN/index.json
+++ b/packages/ui/src/locales/zh-CN/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "取消操作"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} 个共享 CPU"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "你即将重新订阅 <server-name>{serverName}</server-name>。你的订阅将会重新启用，且服务器将持续运行。"
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "获取订阅信息失败。"
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/5天} monthly {/月} quarterly {/季度} yearly {/年} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "你的下一次缴费日期为 <charge-date>{date}</charge-date>。"
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "方案"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB 内存"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "续订"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB 存储空间"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "重新订阅服务器"
   },
@@ -7455,4 +7437,3 @@
     "defaultMessage": "类型"
   }
 }
-
diff --git a/packages/ui/src/locales/zh-TW/index.json b/packages/ui/src/locales/zh-TW/index.json
index b6c9eff291c..a6b5c59e15f 100644
--- a/packages/ui/src/locales/zh-TW/index.json
+++ b/packages/ui/src/locales/zh-TW/index.json
@@ -29,9 +29,6 @@
   "billing.resubscribe-modal.cancel": {
     "defaultMessage": "取消"
   },
-  "billing.resubscribe-modal.cpus": {
-    "defaultMessage": "{sharedCpus} 個共用 CPU"
-  },
   "billing.resubscribe-modal.description": {
     "defaultMessage": "你即將重新訂閱 <server-name>{serverName}</server-name>。你的訂閱將會重新啟用，且伺服器將持續執行不中斷。"
   },
@@ -44,24 +41,9 @@
   "billing.resubscribe-modal.failed-load": {
     "defaultMessage": "無法載入訂閱詳細資訊。"
   },
-  "billing.resubscribe-modal.interval": {
-    "defaultMessage": "{intervalOption, select, fiveDays {/ 5 天} monthly {/ 月} quarterly {/ 季} yearly {/ 年} other {{interval}}}"
-  },
-  "billing.resubscribe-modal.next-charge": {
-    "defaultMessage": "下一次扣款日期為 <charge-date>{date}</charge-date>。"
-  },
-  "billing.resubscribe-modal.plan-label": {
-    "defaultMessage": "方案"
-  },
-  "billing.resubscribe-modal.ram": {
-    "defaultMessage": "{ramGb} GB 記憶體"
-  },
   "billing.resubscribe-modal.resubscribe": {
     "defaultMessage": "重新訂閱"
   },
-  "billing.resubscribe-modal.storage": {
-    "defaultMessage": "{storageGb} GB 儲存空間"
-  },
   "billing.resubscribe-modal.title": {
     "defaultMessage": "重新訂閱伺服器"
   },
@@ -7377,4 +7359,3 @@
     "defaultMessage": "類型"
   }
 }
-
diff --git a/packages/ui/src/stories/billing/ResubscribeModal.stories.ts b/packages/ui/src/stories/billing/ResubscribeModal.stories.ts
new file mode 100644
index 00000000000..bf5a1315fa4
--- /dev/null
+++ b/packages/ui/src/stories/billing/ResubscribeModal.stories.ts
@@ -0,0 +1,174 @@
+import { type Archon, GenericModrinthClient, type Labrinth } from '@modrinth/api-client'
+import type { Meta, StoryObj } from '@storybook/vue3-vite'
+import type Stripe from 'stripe'
+import { onMounted, ref } from 'vue'
+
+import { Button } from '../../components/base/buttons'
+import ResubscribeModal from '../../components/billing/ResubscribeModal.vue'
+import { provideModrinthClient } from '../../providers'
+
+const DAY_MS = 24 * 60 * 60 * 1000
+
+const smallPlan: Labrinth.Billing.Internal.Product = {
+	id: 'prod_small',
+	metadata: { type: 'pyro', cpu: 4, ram: 4096, swap: 4096, storage: 32768 },
+	prices: [
+		{
+			id: 'price_small_usd',
+			product_id: 'prod_small',
+			currency_code: 'USD',
+			prices: {
+				type: 'recurring',
+				intervals: { 'five-days': 200, monthly: 1200, quarterly: 3000, yearly: 12000 },
+			},
+		},
+	],
+	unitary: false,
+}
+
+const regions: Archon.Servers.v1.Region[] = [
+	{
+		shortcode: 'us-vin',
+		country_code: 'us',
+		display_name: 'Vint Hill, Virginia',
+		lat: 38.75,
+		lon: -77.67,
+		zone: 'modrinth.gg',
+	},
+]
+
+const paymentMethods = [
+	{
+		id: 'pm_visa',
+		type: 'card',
+		card: { brand: 'visa', last4: '4242' },
+		billing_details: { address: { country: 'GB' } },
+	},
+	{
+		id: 'pm_mastercard',
+		type: 'card',
+		card: { brand: 'mastercard', last4: '5555' },
+		billing_details: { address: { country: 'GB' } },
+	},
+] as unknown as Stripe.PaymentMethod[]
+
+const delay = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms))
+
+/**
+ * Creates a client whose resubscribe preview and payment method endpoints return dummy data,
+ * so the modal can be previewed without a labrinth that supports `?dry=true` resubscribes.
+ */
+function createMockClient({ due, fail = false }: { due: Date; fail?: boolean }) {
+	const client = new GenericModrinthClient({ userAgent: 'modrinth-storybook/1.0.0' })
+	const billing = client.labrinth.billing_internal
+	let defaultPaymentMethod = paymentMethods[0]
+
+	billing.previewResubscribe = async (): Promise<Labrinth.Billing.Internal.ResubscribePreview> => {
+		await delay(600)
+		if (fail) throw new Error('customer has no default payment method')
+
+		const subtotal = 1200
+		const tax = defaultPaymentMethod.id === 'pm_visa' ? 240 : 0
+		return {
+			subtotal,
+			tax,
+			total: subtotal + tax,
+			currency_code: 'USD',
+			interval: 'monthly',
+			due: due.toISOString(),
+			payment_method: defaultPaymentMethod,
+		}
+	}
+
+	billing.editPaymentMethod = async (id) => {
+		await delay(400)
+		defaultPaymentMethod = paymentMethods.find((method) => method.id === id) ?? defaultPaymentMethod
+	}
+
+	return client
+}
+
+function renderStory({
+	due,
+	fail,
+	wasSuspended,
+}: {
+	due: Date
+	fail?: boolean
+	wasSuspended: boolean
+}) {
+	return () => ({
+		components: { ResubscribeModal, Button },
+		setup() {
+			provideModrinthClient(createMockClient({ due, fail }))
+
+			const modalRef = ref<InstanceType<typeof ResubscribeModal> | null>(null)
+			const lastEvent = ref<string | null>(null)
+
+			function open() {
+				modalRef.value?.show({
+					subscriptionId: 'sub_dummy',
+					wasSuspended,
+					serverName: 'My server',
+					plan: smallPlan,
+					regionShortcode: 'us-vin',
+				})
+			}
+
+			onMounted(open)
+
+			return {
+				modalRef,
+				lastEvent,
+				open,
+				paymentMethods,
+				regions,
+				onAddPaymentMethod: () => (lastEvent.value = 'Add payment method clicked'),
+			}
+		},
+		template: /* html */ `
+			<div class="flex flex-col items-center gap-4">
+				<Button type="colored" color="brand" @click="open">Open resubscribe modal</Button>
+				<p v-if="lastEvent" class="m-0 text-sm text-secondary">{{ lastEvent }}</p>
+				<ResubscribeModal
+					ref="modalRef"
+					:payment-methods="paymentMethods"
+					:regions="regions"
+					:on-add-payment-method="onAddPaymentMethod"
+					@resubscribe="lastEvent = 'Resubscribed'"
+					@cancel="lastEvent = 'Cancelled'"
+				/>
+			</div>
+		`,
+	})
+}
+
+const meta = {
+	title: 'Billing/ResubscribeModal',
+	component: ResubscribeModal,
+	parameters: {
+		layout: 'centered',
+	},
+} satisfies Meta<typeof ResubscribeModal>
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+/** Cancelled but still within the paid period: charged on the next due date. */
+export const RenewsOnDate: Story = {
+	render: renderStory({ due: new Date(Date.now() + 12 * DAY_MS), wasSuspended: false }),
+}
+
+/** Past the due date and suspended: charged immediately on resubscribe. */
+export const ChargedToday: Story = {
+	render: renderStory({ due: new Date(Date.now() - 3 * DAY_MS), wasSuspended: true }),
+}
+
+/** The tax quote couldn't be calculated, e.g. no default payment method or billing address. */
+export const PreviewError: Story = {
+	render: renderStory({
+		due: new Date(Date.now() + 12 * DAY_MS),
+		fail: true,
+		wasSuspended: false,
+	}),
+}