mirror of
https://github.com/Memo-2023/mana-monorepo.git
synced 2026-05-20 10:43:38 +02:00
style: auto-format codebase with Prettier
Applied formatting to 1487+ files using pnpm format:write - TypeScript/JavaScript files - Svelte components - Astro pages - JSON configs - Markdown docs 13 files still need manual review (Astro JSX comments)
This commit is contained in:
Wuesteon
parent
0241f5554c
commit
d36b321d9d
3952 changed files with 661498 additions and 739751 deletions
|
|
@ -1,58 +1,58 @@
|
|||
{
|
||||
"name": "@manacore/shared-subscription-ui",
|
||||
"version": "1.0.0",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"svelte": "./src/index.ts",
|
||||
"main": "./src/index.ts",
|
||||
"types": "./src/index.ts",
|
||||
"exports": {
|
||||
".": {
|
||||
"svelte": "./src/index.ts",
|
||||
"types": "./src/index.ts",
|
||||
"default": "./src/index.ts"
|
||||
},
|
||||
"./SubscriptionCard.svelte": {
|
||||
"svelte": "./src/SubscriptionCard.svelte",
|
||||
"default": "./src/SubscriptionCard.svelte"
|
||||
},
|
||||
"./PackageCard.svelte": {
|
||||
"svelte": "./src/PackageCard.svelte",
|
||||
"default": "./src/PackageCard.svelte"
|
||||
},
|
||||
"./BillingToggle.svelte": {
|
||||
"svelte": "./src/BillingToggle.svelte",
|
||||
"default": "./src/BillingToggle.svelte"
|
||||
},
|
||||
"./UsageCard.svelte": {
|
||||
"svelte": "./src/UsageCard.svelte",
|
||||
"default": "./src/UsageCard.svelte"
|
||||
},
|
||||
"./CostCard.svelte": {
|
||||
"svelte": "./src/CostCard.svelte",
|
||||
"default": "./src/CostCard.svelte"
|
||||
},
|
||||
"./SubscriptionButton.svelte": {
|
||||
"svelte": "./src/SubscriptionButton.svelte",
|
||||
"default": "./src/SubscriptionButton.svelte"
|
||||
},
|
||||
"./ManaIcon.svelte": {
|
||||
"svelte": "./src/ManaIcon.svelte",
|
||||
"default": "./src/ManaIcon.svelte"
|
||||
}
|
||||
},
|
||||
"scripts": {
|
||||
"check": "svelte-check --tsconfig ./tsconfig.json"
|
||||
},
|
||||
"dependencies": {
|
||||
"@manacore/shared-subscription-types": "workspace:*"
|
||||
},
|
||||
"devDependencies": {
|
||||
"svelte": "^5.0.0",
|
||||
"svelte-check": "^4.0.0",
|
||||
"typescript": "^5.7.3"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"svelte": "^5.0.0"
|
||||
}
|
||||
"name": "@manacore/shared-subscription-ui",
|
||||
"version": "1.0.0",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"svelte": "./src/index.ts",
|
||||
"main": "./src/index.ts",
|
||||
"types": "./src/index.ts",
|
||||
"exports": {
|
||||
".": {
|
||||
"svelte": "./src/index.ts",
|
||||
"types": "./src/index.ts",
|
||||
"default": "./src/index.ts"
|
||||
},
|
||||
"./SubscriptionCard.svelte": {
|
||||
"svelte": "./src/SubscriptionCard.svelte",
|
||||
"default": "./src/SubscriptionCard.svelte"
|
||||
},
|
||||
"./PackageCard.svelte": {
|
||||
"svelte": "./src/PackageCard.svelte",
|
||||
"default": "./src/PackageCard.svelte"
|
||||
},
|
||||
"./BillingToggle.svelte": {
|
||||
"svelte": "./src/BillingToggle.svelte",
|
||||
"default": "./src/BillingToggle.svelte"
|
||||
},
|
||||
"./UsageCard.svelte": {
|
||||
"svelte": "./src/UsageCard.svelte",
|
||||
"default": "./src/UsageCard.svelte"
|
||||
},
|
||||
"./CostCard.svelte": {
|
||||
"svelte": "./src/CostCard.svelte",
|
||||
"default": "./src/CostCard.svelte"
|
||||
},
|
||||
"./SubscriptionButton.svelte": {
|
||||
"svelte": "./src/SubscriptionButton.svelte",
|
||||
"default": "./src/SubscriptionButton.svelte"
|
||||
},
|
||||
"./ManaIcon.svelte": {
|
||||
"svelte": "./src/ManaIcon.svelte",
|
||||
"default": "./src/ManaIcon.svelte"
|
||||
}
|
||||
},
|
||||
"scripts": {
|
||||
"check": "svelte-check --tsconfig ./tsconfig.json"
|
||||
},
|
||||
"dependencies": {
|
||||
"@manacore/shared-subscription-types": "workspace:*"
|
||||
},
|
||||
"devDependencies": {
|
||||
"svelte": "^5.0.0",
|
||||
"svelte-check": "^4.0.0",
|
||||
"typescript": "^5.7.3"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"svelte": "^5.0.0"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
onChange,
|
||||
yearlyDiscount = '33%',
|
||||
monthlyLabel = 'Monatlich',
|
||||
yearlyLabel = 'Jährlich'
|
||||
yearlyLabel = 'Jährlich',
|
||||
}: Props = $props();
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -7,11 +7,7 @@
|
|||
manaLabel?: string;
|
||||
}
|
||||
|
||||
let {
|
||||
costs,
|
||||
title = 'Mana-Kosten',
|
||||
manaLabel = 'Mana'
|
||||
}: Props = $props();
|
||||
let { costs, title = 'Mana-Kosten', manaLabel = 'Mana' }: Props = $props();
|
||||
|
||||
// Icon mapping
|
||||
const iconPaths: Record<string, string> = {
|
||||
|
|
@ -19,10 +15,9 @@
|
|||
'M19 11a7 7 0 01-7 7m0 0a7 7 0 01-7-7m7 7v4m0 0H8m4 0h4m-4-8a3 3 0 01-3-3V5a3 3 0 116 0v6a3 3 0 01-3 3z',
|
||||
'chatbubble-outline':
|
||||
'M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z',
|
||||
'add-circle-outline':
|
||||
'M12 9v3m0 0v3m0-3h3m-3 0H9m12 0a9 9 0 11-18 0 9 9 0 0118 0z',
|
||||
'add-circle-outline': 'M12 9v3m0 0v3m0-3h3m-3 0H9m12 0a9 9 0 11-18 0 9 9 0 0118 0z',
|
||||
'copy-outline':
|
||||
'M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z'
|
||||
'M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z',
|
||||
};
|
||||
</script>
|
||||
|
||||
|
|
@ -49,7 +44,8 @@
|
|||
</p>
|
||||
</div>
|
||||
<p class="text-base font-semibold text-theme">
|
||||
{item.cost} {manaLabel}
|
||||
{item.cost}
|
||||
{manaLabel}
|
||||
</p>
|
||||
</div>
|
||||
{/each}
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@
|
|||
popularLabel = 'Popular',
|
||||
manaLabel = 'Mana',
|
||||
oneTimeLabel = 'Einmalig',
|
||||
buyLabel = 'Kaufen'
|
||||
buyLabel = 'Kaufen',
|
||||
}: Props = $props();
|
||||
|
||||
function formatPrice(pkg: ManaPackage) {
|
||||
|
|
@ -64,7 +64,10 @@
|
|||
<!-- Three column layout -->
|
||||
<div class="mb-5 flex justify-between gap-2">
|
||||
<!-- Mana Icon with background -->
|
||||
<div class="flex aspect-square flex-1 items-center justify-center rounded-xl bg-menu" style="min-height: 80px;">
|
||||
<div
|
||||
class="flex aspect-square flex-1 items-center justify-center rounded-xl bg-menu"
|
||||
style="min-height: 80px;"
|
||||
>
|
||||
<div
|
||||
class="flex items-center justify-center rounded-lg"
|
||||
style="width: {packageStyles.bgSize}; height: {packageStyles.bgSize}; background-color: {packageStyles.bg};"
|
||||
|
|
@ -74,7 +77,10 @@
|
|||
</div>
|
||||
|
||||
<!-- Mana Amount -->
|
||||
<div class="flex aspect-square flex-1 flex-col items-center justify-center rounded-xl bg-menu" style="min-height: 80px;">
|
||||
<div
|
||||
class="flex aspect-square flex-1 flex-col items-center justify-center rounded-xl bg-menu"
|
||||
style="min-height: 80px;"
|
||||
>
|
||||
<p class="mb-0.5 text-2xl font-bold text-theme">
|
||||
{pkg.manaAmount}
|
||||
</p>
|
||||
|
|
@ -82,7 +88,10 @@
|
|||
</div>
|
||||
|
||||
<!-- Price -->
|
||||
<div class="flex aspect-square flex-1 flex-col items-center justify-center rounded-xl bg-menu" style="min-height: 80px;">
|
||||
<div
|
||||
class="flex aspect-square flex-1 flex-col items-center justify-center rounded-xl bg-menu"
|
||||
style="min-height: 80px;"
|
||||
>
|
||||
<p class="text-xl font-bold text-theme">
|
||||
{formatPrice(pkg)}
|
||||
</p>
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
iconName = 'arrow-forward-outline',
|
||||
leftIconName = 'cart-outline',
|
||||
variant = 'primary',
|
||||
disabled = false
|
||||
disabled = false,
|
||||
}: Props = $props();
|
||||
|
||||
// Icon mapping (simple SVG paths for common icons)
|
||||
|
|
@ -22,7 +22,7 @@
|
|||
'arrow-forward-outline': 'M5 12h14M12 5l7 7-7 7',
|
||||
'checkmark-circle-outline': 'M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z',
|
||||
'cart-outline':
|
||||
'M3 3h2l.4 2M7 13h10l4-8H5.4M7 13L5.4 5M7 13l-2.293 2.293c-.63.63-.184 1.707.707 1.707H17m0 0a2 2 0 100 4 2 2 0 000-4zm-8 2a2 2 0 11-4 0 2 2 0 014 0z'
|
||||
'M3 3h2l.4 2M7 13h10l4-8H5.4M7 13L5.4 5M7 13l-2.293 2.293c-.63.63-.184 1.707.707 1.707H17m0 0a2 2 0 100 4 2 2 0 000-4zm-8 2a2 2 0 11-4 0 2 2 0 014 0z',
|
||||
};
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -33,7 +33,7 @@
|
|||
monthlyEquivalentLabel = '/Monat',
|
||||
buyLabel = 'Kaufen',
|
||||
yourPlanLabel = 'Dein Plan',
|
||||
yourLegacyPlanLabel = 'Dein Legacy-Plan'
|
||||
yourLegacyPlanLabel = 'Dein Legacy-Plan',
|
||||
}: Props = $props();
|
||||
|
||||
function formatPrice(plan: SubscriptionPlan) {
|
||||
|
|
@ -85,7 +85,10 @@
|
|||
<!-- Three column layout -->
|
||||
<div class="mb-5 flex justify-between gap-2">
|
||||
<!-- Mana Icon with background -->
|
||||
<div class="flex aspect-square flex-1 items-center justify-center rounded-xl bg-menu" style="min-height: 80px;">
|
||||
<div
|
||||
class="flex aspect-square flex-1 items-center justify-center rounded-xl bg-menu"
|
||||
style="min-height: 80px;"
|
||||
>
|
||||
<div
|
||||
class="flex items-center justify-center rounded-lg"
|
||||
style="width: {tierStyles.bgSize}; height: {tierStyles.bgSize}; background-color: {tierStyles.bg};"
|
||||
|
|
@ -95,7 +98,10 @@
|
|||
</div>
|
||||
|
||||
<!-- Mana Amount -->
|
||||
<div class="flex aspect-square flex-1 flex-col items-center justify-center rounded-xl bg-menu" style="min-height: 80px;">
|
||||
<div
|
||||
class="flex aspect-square flex-1 flex-col items-center justify-center rounded-xl bg-menu"
|
||||
style="min-height: 80px;"
|
||||
>
|
||||
<p class="mb-0.5 text-2xl font-bold text-theme">
|
||||
{plan.monthlyMana}
|
||||
</p>
|
||||
|
|
@ -103,7 +109,10 @@
|
|||
</div>
|
||||
|
||||
<!-- Price -->
|
||||
<div class="flex aspect-square flex-1 flex-col items-center justify-center rounded-xl bg-menu" style="min-height: 80px;">
|
||||
<div
|
||||
class="flex aspect-square flex-1 flex-col items-center justify-center rounded-xl bg-menu"
|
||||
style="min-height: 80px;"
|
||||
>
|
||||
<p class="text-xl font-bold text-theme">
|
||||
{formatPrice(plan)}
|
||||
</p>
|
||||
|
|
@ -121,11 +130,7 @@
|
|||
<!-- Button only show if NOT free plan -->
|
||||
{#if !plan.id.toLowerCase().includes('free')}
|
||||
<SubscriptionButton
|
||||
label={isCurrentPlan
|
||||
? isLegacy
|
||||
? yourLegacyPlanLabel
|
||||
: yourPlanLabel
|
||||
: buyLabel}
|
||||
label={isCurrentPlan ? (isLegacy ? yourLegacyPlanLabel : yourPlanLabel) : buyLabel}
|
||||
onclick={() => onSelect(plan.id)}
|
||||
iconName={isCurrentPlan ? 'checkmark-circle-outline' : 'arrow-forward-outline'}
|
||||
variant={isCurrentPlan ? 'secondary' : plan.popular ? 'accent' : 'primary'}
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@
|
|||
yourManaLabel = 'Dein Mana',
|
||||
availableLabel = 'verfügbar',
|
||||
consumedLabel = 'verbraucht',
|
||||
currentPlanLabel = 'Aktueller Plan'
|
||||
currentPlanLabel = 'Aktueller Plan',
|
||||
}: Props = $props();
|
||||
|
||||
// Use real credits (this would normally come from a store/API)
|
||||
|
|
@ -65,7 +65,8 @@
|
|||
{availablePercentage}% {availableLabel}
|
||||
</p>
|
||||
<p class="text-sm font-medium text-theme-secondary">
|
||||
{formattedUsedMana} {consumedLabel}
|
||||
{formattedUsedMana}
|
||||
{consumedLabel}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,28 +1,28 @@
|
|||
{
|
||||
"costs": [
|
||||
{
|
||||
"action": "Pro Minute Aufnahme",
|
||||
"actionKey": "subscription.cost_per_minute_recording",
|
||||
"cost": 2,
|
||||
"icon": "mic-outline"
|
||||
},
|
||||
{
|
||||
"action": "Frage an Memo stellen",
|
||||
"actionKey": "subscription.cost_ask_memo_question",
|
||||
"cost": 5,
|
||||
"icon": "chatbubble-outline"
|
||||
},
|
||||
{
|
||||
"action": "Neue Memory erstellen",
|
||||
"actionKey": "subscription.cost_create_memory",
|
||||
"cost": 5,
|
||||
"icon": "add-circle-outline"
|
||||
},
|
||||
{
|
||||
"action": "Memos kombinieren (pro Memo)",
|
||||
"actionKey": "subscription.cost_combine_memos",
|
||||
"cost": 5,
|
||||
"icon": "copy-outline"
|
||||
}
|
||||
]
|
||||
"costs": [
|
||||
{
|
||||
"action": "Pro Minute Aufnahme",
|
||||
"actionKey": "subscription.cost_per_minute_recording",
|
||||
"cost": 2,
|
||||
"icon": "mic-outline"
|
||||
},
|
||||
{
|
||||
"action": "Frage an Memo stellen",
|
||||
"actionKey": "subscription.cost_ask_memo_question",
|
||||
"cost": 5,
|
||||
"icon": "chatbubble-outline"
|
||||
},
|
||||
{
|
||||
"action": "Neue Memory erstellen",
|
||||
"actionKey": "subscription.cost_create_memory",
|
||||
"cost": 5,
|
||||
"icon": "add-circle-outline"
|
||||
},
|
||||
{
|
||||
"action": "Memos kombinieren (pro Memo)",
|
||||
"actionKey": "subscription.cost_combine_memos",
|
||||
"cost": 5,
|
||||
"icon": "copy-outline"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
{
|
||||
"usage": {
|
||||
"total": 0,
|
||||
"lastWeek": 0,
|
||||
"lastMonth": 0,
|
||||
"currentMana": 150,
|
||||
"maxMana": 150,
|
||||
"history": []
|
||||
}
|
||||
"usage": {
|
||||
"total": 0,
|
||||
"lastWeek": 0,
|
||||
"lastMonth": 0,
|
||||
"currentMana": 150,
|
||||
"maxMana": 150,
|
||||
"history": []
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,167 +1,167 @@
|
|||
{
|
||||
"subscriptions": [
|
||||
{
|
||||
"id": "free",
|
||||
"name": "Mana Stream Free",
|
||||
"nameEn": "Mana Stream Free",
|
||||
"nameIt": "Mana Stream Free",
|
||||
"price": 0,
|
||||
"priceUnit": "",
|
||||
"monthlyMana": 150,
|
||||
"canGiftMana": false,
|
||||
"popular": false,
|
||||
"billingCycle": "monthly",
|
||||
"available": true
|
||||
},
|
||||
{
|
||||
"id": "Mana_Stream_Small_v1",
|
||||
"name": "Kleiner Mana Stream",
|
||||
"nameEn": "Small Mana Stream",
|
||||
"nameIt": "Piccolo Mana Stream",
|
||||
"price": 5.99,
|
||||
"priceUnit": "/ Monat",
|
||||
"monthlyMana": 600,
|
||||
"canGiftMana": true,
|
||||
"popular": false,
|
||||
"billingCycle": "monthly",
|
||||
"available": true
|
||||
},
|
||||
{
|
||||
"id": "Mana_Stream_Small_Yearly_v1",
|
||||
"name": "Kleiner Mana Stream",
|
||||
"nameEn": "Small Mana Stream",
|
||||
"nameIt": "Piccolo Mana Stream",
|
||||
"price": 47.99,
|
||||
"priceUnit": "/ Jahr",
|
||||
"priceBreakdown": "(entspricht 3,99€ / Monat, 33% Rabatt)",
|
||||
"monthlyMana": 600,
|
||||
"canGiftMana": true,
|
||||
"popular": false,
|
||||
"billingCycle": "yearly",
|
||||
"monthlyEquivalent": 3.99,
|
||||
"available": true
|
||||
},
|
||||
{
|
||||
"id": "Mana_Stream_Medium_v1",
|
||||
"name": "Mittlerer Mana Stream",
|
||||
"nameEn": "Medium Mana Stream",
|
||||
"nameIt": "Medio Mana Stream",
|
||||
"price": 14.99,
|
||||
"priceUnit": "/ Monat",
|
||||
"monthlyMana": 1500,
|
||||
"canGiftMana": true,
|
||||
"popular": false,
|
||||
"billingCycle": "monthly",
|
||||
"available": true
|
||||
},
|
||||
{
|
||||
"id": "Mana_Stream_Medium_Yearly_v1",
|
||||
"name": "Mittlerer Mana Stream",
|
||||
"nameEn": "Medium Mana Stream",
|
||||
"nameIt": "Medio Mana Stream",
|
||||
"price": 119.99,
|
||||
"priceUnit": "/ Jahr",
|
||||
"priceBreakdown": "(entspricht 9,99€ / Monat, 33% Rabatt)",
|
||||
"monthlyMana": 1500,
|
||||
"canGiftMana": true,
|
||||
"popular": false,
|
||||
"billingCycle": "yearly",
|
||||
"monthlyEquivalent": 9.99,
|
||||
"available": true
|
||||
},
|
||||
{
|
||||
"id": "Mana_Stream_Large_v1",
|
||||
"name": "Großer Mana Stream",
|
||||
"nameEn": "Large Mana Stream",
|
||||
"nameIt": "Grande Mana Stream",
|
||||
"price": 29.99,
|
||||
"priceUnit": "/ Monat",
|
||||
"monthlyMana": 3000,
|
||||
"canGiftMana": true,
|
||||
"popular": false,
|
||||
"billingCycle": "monthly",
|
||||
"available": true
|
||||
},
|
||||
{
|
||||
"id": "Mana_Stream_Large_Yearly_v1",
|
||||
"name": "Großer Mana Stream",
|
||||
"nameEn": "Large Mana Stream",
|
||||
"nameIt": "Grande Mana Stream",
|
||||
"price": 239.99,
|
||||
"priceUnit": "/ Jahr",
|
||||
"priceBreakdown": "(entspricht 19,99€ / Monat, 33% Rabatt)",
|
||||
"monthlyMana": 3000,
|
||||
"canGiftMana": true,
|
||||
"popular": false,
|
||||
"billingCycle": "yearly",
|
||||
"monthlyEquivalent": 19.99,
|
||||
"available": true
|
||||
},
|
||||
{
|
||||
"id": "Mana_Stream_Giant_v1",
|
||||
"name": "Riesiger Mana Stream",
|
||||
"nameEn": "Giant Mana Stream",
|
||||
"nameIt": "Gigante Mana Stream",
|
||||
"price": 49.99,
|
||||
"priceUnit": "/ Monat",
|
||||
"monthlyMana": 5000,
|
||||
"canGiftMana": true,
|
||||
"popular": false,
|
||||
"billingCycle": "monthly",
|
||||
"available": true
|
||||
},
|
||||
{
|
||||
"id": "Mana_Stream_Giant_Yearly_v1",
|
||||
"name": "Riesiger Mana Stream",
|
||||
"nameEn": "Giant Mana Stream",
|
||||
"nameIt": "Gigante Mana Stream",
|
||||
"price": 399.99,
|
||||
"priceUnit": "/ Jahr",
|
||||
"priceBreakdown": "(entspricht 33,33€ / Monat, 33% Rabatt)",
|
||||
"monthlyMana": 5000,
|
||||
"canGiftMana": true,
|
||||
"popular": false,
|
||||
"billingCycle": "yearly",
|
||||
"monthlyEquivalent": 33.33,
|
||||
"available": true
|
||||
}
|
||||
],
|
||||
"packages": [
|
||||
{
|
||||
"id": "Mana_Potion_Small_v1",
|
||||
"name": "Kleiner Mana Trank",
|
||||
"nameEn": "Small Mana Potion",
|
||||
"nameIt": "Piccola Pozione di Mana",
|
||||
"manaAmount": 350,
|
||||
"price": 4.99,
|
||||
"popular": false
|
||||
},
|
||||
{
|
||||
"id": "Mana_Potion_Medium_v1",
|
||||
"name": "Mittlerer Mana Trank",
|
||||
"nameEn": "Medium Mana Potion",
|
||||
"nameIt": "Media Pozione di Mana",
|
||||
"manaAmount": 700,
|
||||
"price": 9.99,
|
||||
"popular": false
|
||||
},
|
||||
{
|
||||
"id": "Mana_Potion_Large_v1",
|
||||
"name": "Großer Mana Trank",
|
||||
"nameEn": "Large Mana Potion",
|
||||
"nameIt": "Grande Pozione di Mana",
|
||||
"manaAmount": 1400,
|
||||
"price": 19.99,
|
||||
"popular": false
|
||||
},
|
||||
{
|
||||
"id": "Mana_Potion_Giant_v2",
|
||||
"name": "Riesiger Mana Trank",
|
||||
"nameEn": "Giant Mana Potion",
|
||||
"nameIt": "Pozione di Mana Gigante",
|
||||
"manaAmount": 2800,
|
||||
"price": 39.99,
|
||||
"popular": false
|
||||
}
|
||||
]
|
||||
"subscriptions": [
|
||||
{
|
||||
"id": "free",
|
||||
"name": "Mana Stream Free",
|
||||
"nameEn": "Mana Stream Free",
|
||||
"nameIt": "Mana Stream Free",
|
||||
"price": 0,
|
||||
"priceUnit": "",
|
||||
"monthlyMana": 150,
|
||||
"canGiftMana": false,
|
||||
"popular": false,
|
||||
"billingCycle": "monthly",
|
||||
"available": true
|
||||
},
|
||||
{
|
||||
"id": "Mana_Stream_Small_v1",
|
||||
"name": "Kleiner Mana Stream",
|
||||
"nameEn": "Small Mana Stream",
|
||||
"nameIt": "Piccolo Mana Stream",
|
||||
"price": 5.99,
|
||||
"priceUnit": "/ Monat",
|
||||
"monthlyMana": 600,
|
||||
"canGiftMana": true,
|
||||
"popular": false,
|
||||
"billingCycle": "monthly",
|
||||
"available": true
|
||||
},
|
||||
{
|
||||
"id": "Mana_Stream_Small_Yearly_v1",
|
||||
"name": "Kleiner Mana Stream",
|
||||
"nameEn": "Small Mana Stream",
|
||||
"nameIt": "Piccolo Mana Stream",
|
||||
"price": 47.99,
|
||||
"priceUnit": "/ Jahr",
|
||||
"priceBreakdown": "(entspricht 3,99€ / Monat, 33% Rabatt)",
|
||||
"monthlyMana": 600,
|
||||
"canGiftMana": true,
|
||||
"popular": false,
|
||||
"billingCycle": "yearly",
|
||||
"monthlyEquivalent": 3.99,
|
||||
"available": true
|
||||
},
|
||||
{
|
||||
"id": "Mana_Stream_Medium_v1",
|
||||
"name": "Mittlerer Mana Stream",
|
||||
"nameEn": "Medium Mana Stream",
|
||||
"nameIt": "Medio Mana Stream",
|
||||
"price": 14.99,
|
||||
"priceUnit": "/ Monat",
|
||||
"monthlyMana": 1500,
|
||||
"canGiftMana": true,
|
||||
"popular": false,
|
||||
"billingCycle": "monthly",
|
||||
"available": true
|
||||
},
|
||||
{
|
||||
"id": "Mana_Stream_Medium_Yearly_v1",
|
||||
"name": "Mittlerer Mana Stream",
|
||||
"nameEn": "Medium Mana Stream",
|
||||
"nameIt": "Medio Mana Stream",
|
||||
"price": 119.99,
|
||||
"priceUnit": "/ Jahr",
|
||||
"priceBreakdown": "(entspricht 9,99€ / Monat, 33% Rabatt)",
|
||||
"monthlyMana": 1500,
|
||||
"canGiftMana": true,
|
||||
"popular": false,
|
||||
"billingCycle": "yearly",
|
||||
"monthlyEquivalent": 9.99,
|
||||
"available": true
|
||||
},
|
||||
{
|
||||
"id": "Mana_Stream_Large_v1",
|
||||
"name": "Großer Mana Stream",
|
||||
"nameEn": "Large Mana Stream",
|
||||
"nameIt": "Grande Mana Stream",
|
||||
"price": 29.99,
|
||||
"priceUnit": "/ Monat",
|
||||
"monthlyMana": 3000,
|
||||
"canGiftMana": true,
|
||||
"popular": false,
|
||||
"billingCycle": "monthly",
|
||||
"available": true
|
||||
},
|
||||
{
|
||||
"id": "Mana_Stream_Large_Yearly_v1",
|
||||
"name": "Großer Mana Stream",
|
||||
"nameEn": "Large Mana Stream",
|
||||
"nameIt": "Grande Mana Stream",
|
||||
"price": 239.99,
|
||||
"priceUnit": "/ Jahr",
|
||||
"priceBreakdown": "(entspricht 19,99€ / Monat, 33% Rabatt)",
|
||||
"monthlyMana": 3000,
|
||||
"canGiftMana": true,
|
||||
"popular": false,
|
||||
"billingCycle": "yearly",
|
||||
"monthlyEquivalent": 19.99,
|
||||
"available": true
|
||||
},
|
||||
{
|
||||
"id": "Mana_Stream_Giant_v1",
|
||||
"name": "Riesiger Mana Stream",
|
||||
"nameEn": "Giant Mana Stream",
|
||||
"nameIt": "Gigante Mana Stream",
|
||||
"price": 49.99,
|
||||
"priceUnit": "/ Monat",
|
||||
"monthlyMana": 5000,
|
||||
"canGiftMana": true,
|
||||
"popular": false,
|
||||
"billingCycle": "monthly",
|
||||
"available": true
|
||||
},
|
||||
{
|
||||
"id": "Mana_Stream_Giant_Yearly_v1",
|
||||
"name": "Riesiger Mana Stream",
|
||||
"nameEn": "Giant Mana Stream",
|
||||
"nameIt": "Gigante Mana Stream",
|
||||
"price": 399.99,
|
||||
"priceUnit": "/ Jahr",
|
||||
"priceBreakdown": "(entspricht 33,33€ / Monat, 33% Rabatt)",
|
||||
"monthlyMana": 5000,
|
||||
"canGiftMana": true,
|
||||
"popular": false,
|
||||
"billingCycle": "yearly",
|
||||
"monthlyEquivalent": 33.33,
|
||||
"available": true
|
||||
}
|
||||
],
|
||||
"packages": [
|
||||
{
|
||||
"id": "Mana_Potion_Small_v1",
|
||||
"name": "Kleiner Mana Trank",
|
||||
"nameEn": "Small Mana Potion",
|
||||
"nameIt": "Piccola Pozione di Mana",
|
||||
"manaAmount": 350,
|
||||
"price": 4.99,
|
||||
"popular": false
|
||||
},
|
||||
{
|
||||
"id": "Mana_Potion_Medium_v1",
|
||||
"name": "Mittlerer Mana Trank",
|
||||
"nameEn": "Medium Mana Potion",
|
||||
"nameIt": "Media Pozione di Mana",
|
||||
"manaAmount": 700,
|
||||
"price": 9.99,
|
||||
"popular": false
|
||||
},
|
||||
{
|
||||
"id": "Mana_Potion_Large_v1",
|
||||
"name": "Großer Mana Trank",
|
||||
"nameEn": "Large Mana Potion",
|
||||
"nameIt": "Grande Pozione di Mana",
|
||||
"manaAmount": 1400,
|
||||
"price": 19.99,
|
||||
"popular": false
|
||||
},
|
||||
{
|
||||
"id": "Mana_Potion_Giant_v2",
|
||||
"name": "Riesiger Mana Trank",
|
||||
"nameEn": "Giant Mana Potion",
|
||||
"nameIt": "Pozione di Mana Gigante",
|
||||
"manaAmount": 2800,
|
||||
"price": 39.99,
|
||||
"popular": false
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,11 @@
|
|||
<script lang="ts">
|
||||
import type { SubscriptionPlan, ManaPackage, UsageData, CostItem, BillingCycle } from '@manacore/shared-subscription-types';
|
||||
import type {
|
||||
SubscriptionPlan,
|
||||
ManaPackage,
|
||||
UsageData,
|
||||
CostItem,
|
||||
BillingCycle,
|
||||
} from '@manacore/shared-subscription-types';
|
||||
import BillingToggle from '../BillingToggle.svelte';
|
||||
import SubscriptionCard from '../SubscriptionCard.svelte';
|
||||
import PackageCard from '../PackageCard.svelte';
|
||||
|
|
@ -50,7 +56,7 @@
|
|||
pageTitle = 'Mana kaufen',
|
||||
subscriptionsTitle = 'Abonnements',
|
||||
packagesTitle = 'Einmalkäufe',
|
||||
yearlyDiscount = '33%'
|
||||
yearlyDiscount = '33%',
|
||||
}: Props = $props();
|
||||
|
||||
// State
|
||||
|
|
@ -58,15 +64,13 @@
|
|||
|
||||
// Get current plan name for display
|
||||
const currentPlanName = $derived(() => {
|
||||
const plan = subscriptions.find(p => p.id === currentPlanId);
|
||||
const plan = subscriptions.find((p) => p.id === currentPlanId);
|
||||
return plan?.name || 'Free';
|
||||
});
|
||||
|
||||
// Get all subscription plans for current billing cycle
|
||||
function getSubscriptionPlans() {
|
||||
return subscriptions.filter(
|
||||
(plan) => plan.id !== 'free' && plan.billingCycle === billingCycle
|
||||
);
|
||||
return subscriptions.filter((plan) => plan.id !== 'free' && plan.billingCycle === billingCycle);
|
||||
}
|
||||
|
||||
// Check if a plan is the current plan
|
||||
|
|
@ -98,7 +102,11 @@
|
|||
</section>
|
||||
|
||||
<!-- Billing Toggle -->
|
||||
<BillingToggle {billingCycle} onChange={(cycle: BillingCycle) => (billingCycle = cycle)} {yearlyDiscount} />
|
||||
<BillingToggle
|
||||
{billingCycle}
|
||||
onChange={(cycle: BillingCycle) => (billingCycle = cycle)}
|
||||
{yearlyDiscount}
|
||||
/>
|
||||
|
||||
<!-- Subscriptions Section -->
|
||||
<section class="mb-12 pt-2">
|
||||
|
|
|
|||
|
|
@ -1,19 +1,19 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"target": "ES2022",
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "bundler",
|
||||
"lib": ["ES2022", "DOM", "DOM.Iterable"],
|
||||
"strict": true,
|
||||
"esModuleInterop": true,
|
||||
"skipLibCheck": true,
|
||||
"forceConsistentCasingInFileNames": true,
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"verbatimModuleSyntax": true,
|
||||
"noEmit": true,
|
||||
"types": ["svelte"]
|
||||
},
|
||||
"include": ["src/**/*"],
|
||||
"exclude": ["node_modules"]
|
||||
"compilerOptions": {
|
||||
"target": "ES2022",
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "bundler",
|
||||
"lib": ["ES2022", "DOM", "DOM.Iterable"],
|
||||
"strict": true,
|
||||
"esModuleInterop": true,
|
||||
"skipLibCheck": true,
|
||||
"forceConsistentCasingInFileNames": true,
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"verbatimModuleSyntax": true,
|
||||
"noEmit": true,
|
||||
"types": ["svelte"]
|
||||
},
|
||||
"include": ["src/**/*"],
|
||||
"exclude": ["node_modules"]
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue