tomasalias/AstralRinth
1
0
Fork 0
forked from didirus/AstralRinth
Code Pull Requests Activity

Revert "feat: medal promotion on servers page (#4117)"

Browse Source 
This reverts commit 14eac461be.
This commit is contained in:
Prospector
2025-08-18 12:26:11 -07:00
parent b2ff2d8737
commit 2e6cff7efc
34 changed files with 286 additions and 2477 deletions
Download Patch File Download Diff File Expand all files Collapse all files

140
packages/ui/src/components/billing/ModrinthServersPurchaseModal.vue
View File

@@ -7,7 +7,6 @@ import {
SpinnerIcon,
XIcon,
} from '@modrinth/assets'
import type { UserSubscription } from '@modrinth/utils'
import { defineMessage, type MessageDescriptor, useVIntl } from '@vintl/vintl'
import type Stripe from 'stripe'
import { computed, nextTick, ref, useTemplateRef, watch } from 'vue'
@@ -27,7 +26,6 @@ import type {
import { ButtonStyled } from '../index'
import ModalLoadingIndicator from '../modal/ModalLoadingIndicator.vue'
import NewModal from '../modal/NewModal.vue'
import PlanSelector from './ServersPurchase0Plan.vue'
import RegionSelector from './ServersPurchase1Region.vue'
import PaymentMethodSelector from './ServersPurchase2PaymentMethod.vue'
import ConfirmPurchase from './ServersPurchase3Review.vue'
@@ -48,16 +46,12 @@ const props = defineProps<{
pings: RegionPing[]
regions: ServerRegion[]
availableProducts: ServerPlan[]
planStage?: boolean
existingPlan?: ServerPlan
existingSubscription?: UserSubscription
refreshPaymentMethods: () => Promise<void>
fetchStock: (region: ServerRegion, request: ServerStockRequest) => Promise<number>
initiatePayment: (
body: CreatePaymentIntentRequest | UpdatePaymentIntentRequest,
) => Promise<UpdatePaymentIntentResponse | CreatePaymentIntentResponse | null>
) => Promise<UpdatePaymentIntentResponse | CreatePaymentIntentResponse>
onError: (err: Error) => void
onFinalizeNoPaymentChange?: () => Promise<void>
}>()
const modal = useTemplateRef<InstanceType<typeof NewModal>>('modal')
@@ -84,7 +78,6 @@ const {
hasPaymentMethod,
submitPayment,
completingPurchase,
noPaymentRequired,
} = useStripe(
props.publishableKey,
props.customer,
@@ -102,14 +95,11 @@ const customServer = ref<boolean>(false)
const acceptedEula = ref<boolean>(false)
const skipPaymentMethods = ref<boolean>(true)
type Step = 'plan' | 'region' | 'payment' | 'review'
type Step = 'region' | 'payment' | 'review'
const steps: Step[] = props.planStage
? (['plan', 'region', 'payment', 'review'] as Step[])
: (['region', 'payment', 'review'] as Step[])
const steps: Step[] = ['region', 'payment', 'review']
const titles: Record<Step, MessageDescriptor> = {
plan: defineMessage({ id: 'servers.purchase.step.plan.title', defaultMessage: 'Plan' }),
region: defineMessage({ id: 'servers.purchase.step.region.title', defaultMessage: 'Region' }),
payment: defineMessage({
id: 'servers.purchase.step.payment.title',
@@ -142,26 +132,12 @@ const nextStep = computed(() =>
const canProceed = computed(() => {
switch (currentStep.value) {
case 'plan':
console.log('Plan step:', {
customServer: customServer.value,
selectedPlan: selectedPlan.value,
existingPlan: props.existingPlan,
})
return (
customServer.value ||
(!!selectedPlan.value &&
(!props.existingPlan || selectedPlan.value.id !== props.existingPlan.id))
)
case 'region':
return selectedRegion.value && selectedPlan.value && selectedInterval.value
case 'payment':
return selectedPaymentMethod.value || !loadingElements.value
case 'review':
return (
(noPaymentRequired.value || (acceptedEula.value && hasPaymentMethod.value)) &&
!completingPurchase.value
)
return acceptedEula.value && hasPaymentMethod.value && !completingPurchase.value
default:
return false
}
@@ -169,8 +145,6 @@ const canProceed = computed(() => {
async function beforeProceed(step: string) {
switch (step) {
case 'plan':
return true
case 'region':
return true
case 'payment':
@@ -186,9 +160,6 @@ async function beforeProceed(step: string) {
}
return true
case 'review':
if (noPaymentRequired.value) {
return true
}
if (selectedPaymentMethod.value) {
return true
} else {
@@ -229,31 +200,12 @@ async function setStep(step: Step | undefined, skipValidation = false) {
}
watch(selectedPlan, () => {
if (currentStep.value === 'plan') {
customServer.value = !selectedPlan.value
}
})
const defaultPlan = computed<ServerPlan | undefined>(() => {
return (
props.availableProducts.find((p) => p?.metadata?.type === 'pyro' && p.metadata.ram === 6144) ??
props.availableProducts.find((p) => p?.metadata?.type === 'pyro') ??
props.availableProducts[0]
)
console.log(selectedPlan.value)
})
function begin(interval: ServerBillingInterval, plan?: ServerPlan, project?: string) {
loading.value = false
if (plan === null) {
// Explicitly open in custom mode
selectedPlan.value = undefined
customServer.value = true
} else {
selectedPlan.value = plan ?? defaultPlan.value
customServer.value = !selectedPlan.value
}
selectedPlan.value = plan
selectedInterval.value = interval
customServer.value = !selectedPlan.value
selectedPaymentMethod.value = undefined
@@ -266,42 +218,16 @@ function begin(interval: ServerBillingInterval, plan?: ServerPlan, project?: str
defineExpose({
show: begin,
})
defineEmits<{
(e: 'hide'): void
}>()
function handleChooseCustom() {
customServer.value = true
selectedPlan.value = undefined
}
// When the user explicitly wants to change or add a payment method from Review
// we must disable the auto-skip behavior, clear any selected method, and
// navigate to the Payment step so Stripe Elements can mount.
async function changePaymentMethod() {
skipPaymentMethods.value = false
selectedPaymentMethod.value = undefined
await setStep('payment', true)
}
function goToBreadcrumbStep(id: string) {
if (id === 'payment') {
return changePaymentMethod()
}
return setStep(id as Step, true)
}
</script>
<template>
<NewModal ref="modal" @hide="$emit('hide')">
<NewModal ref="modal">
<template #title>
<div class="flex items-center gap-1 font-bold text-secondary">
<template v-for="(title, id, index) in titles" :key="id">
<button
v-if="index < currentStepIndex"
class="bg-transparent active:scale-95 font-bold text-secondary p-0"
@click="goToBreadcrumbStep(id as string)"
@click="setStep(id, true)"
>
{{ formatMessage(title) }}
</button>
@@ -322,17 +248,8 @@ function goToBreadcrumbStep(id: string) {
</div>
</template>
<div class="w-[40rem] max-w-full">
<PlanSelector
v-if="currentStep === 'plan'"
v-model:plan="selectedPlan"
v-model:interval="selectedInterval"
:existing-plan="existingPlan"
:available-products="availableProducts"
:currency="currency"
@choose-custom="handleChooseCustom"
/>
<RegionSelector
v-else-if="currentStep === 'region'"
v-if="currentStep === 'region'"
v-model:region="selectedRegion"
v-model:plan="selectedPlan"
:regions="regions"
@@ -354,7 +271,7 @@ function goToBreadcrumbStep(id: string) {
<ConfirmPurchase
v-else-if="
currentStep === 'review' &&
(hasPaymentMethod || noPaymentRequired) &&
hasPaymentMethod &&
currentRegion &&
selectedInterval &&
selectedPlan
@@ -367,13 +284,14 @@ function goToBreadcrumbStep(id: string) {
:ping="currentPing"
:loading="paymentMethodLoading"
:selected-payment-method="selectedPaymentMethod || inputtedPaymentMethod"
:has-payment-method="hasPaymentMethod"
:tax="tax"
:total="total"
:no-payment-required="noPaymentRequired"
:existing-plan="existingPlan"
:existing-subscription="existingSubscription"
@change-payment-method="changePaymentMethod"
@change-payment-method="
() => {
skipPaymentMethods = false
setStep('payment', true)
}
"
@reload-payment-intent="reloadPaymentIntent"
/>
<div v-else>Something went wrong</div>
@@ -411,33 +329,17 @@ function goToBreadcrumbStep(id: string) {
<ButtonStyled color="brand">
<button
v-tooltip="
currentStep === 'review' && !acceptedEula && !noPaymentRequired
currentStep === 'review' && !acceptedEula
? 'You must accept the Minecraft EULA to proceed.'
: undefined
"
:disabled="!canProceed"
@click="
noPaymentRequired && currentStep === 'review'
? (async () => {
if (props.onFinalizeNoPaymentChange) {
try {
await props.onFinalizeNoPaymentChange()
} catch (e) {
return
}
}
modal?.hide()
})()
: setStep(nextStep)
"
@click="setStep(nextStep)"
>
<template v-if="currentStep === 'review'">
<template v-if="noPaymentRequired"><CheckCircleIcon /> Confirm Change</template>
<template v-else>
<SpinnerIcon v-if="completingPurchase" class="animate-spin" />
<CheckCircleIcon v-else />
Subscribe
</template>
<SpinnerIcon v-if="completingPurchase" class="animate-spin" />
<CheckCircleIcon v-else />
Subscribe
</template>
<template v-else>
{{ formatMessage(commonMessages.nextButton) }} <RightArrowIcon />