+ {/* Billing period toggle */}
+
+
+
+
+
+ {/* Plan selector */}
+
+
+
+ {plans?.map((p) => (
+
+ ))}
+
+
+
+ {/* Data center selector */}
+
+
+
+
+
+ {plan && selectedDc && (
+
+
+ Plan
+ {plan.name}
+
+
+ Billing
+ {isAnnual ? "Annual" : "Monthly"}
+
+
+ Total
+ {displayPrice(plan)}
+
+
+ )}
+
+
+