Update to new pricing

More details in https://budgetzen.net/blog/new-updated-pricing-going-into-2025/

lib/utils.ts

@@ -16,11 +16,13 @@ export const defaultDescription = 'Simple and end-to-end encrypted budget and ex
 export const helpEmail = 'help@budgetzen.net';
 
 export const PORT = Deno.env.get('PORT') || 8000;
-export const STRIPE_MONTHLY_URL = 'https://buy.stripe.com/eVa01H57C3MB6CQ14s';
-export const STRIPE_YEARLY_URL = 'https://buy.stripe.com/28o5m1dE896V0es8wV';
+export const STRIPE_MONTHLY_URL = 'https://buy.stripe.com/7sI3dT8jO5UJ3qE00y';
+export const STRIPE_YEARLY_URL = 'https://buy.stripe.com/28og0F8jOgzn8KY00z';
 export const STRIPE_CUSTOMER_URL = 'https://billing.stripe.com/p/login/4gw15w3G9bDyfWU6oo';
 export const PAYPAL_CUSTOMER_URL = 'https://www.paypal.com';
 export const IS_UNSAFE_SELF_HOSTED = Boolean(Deno.env.get('IS_UNSAFE_SELF_HOSTED') || '');
+export const MONTHLY_PRICE = 4;
+export const YEARLY_PRICE = 40;
 
 export interface PageContentResult {
   htmlContent: string;

pages/index.ts

@@ -1,4 +1,4 @@
-import { helpEmail, html, PageContentResult } from '/lib/utils.ts';
+import { helpEmail, html, MONTHLY_PRICE, PageContentResult, YEARLY_PRICE } from '/lib/utils.ts';
 import verificationCodeModal from '/components/modals/verification-code.ts';
 
 export function pageAction() {
@@ -22,8 +22,8 @@ export function pageContent() {
           </p>
           <p>
             You have a <strong>30-day free trial</strong> (no credit card
-            required), and at the end, you can pay <strong>€18 / year</strong>,
-            or <strong>€2 / month</strong>, no limits.
+            required), and at the end, you can pay <strong>€${YEARLY_PRICE} / year</strong>,
+            or <strong>€${MONTHLY_PRICE} / month</strong>, no limits.
           </p>
           <form id="login-form">
             <fieldset class="input-wrapper">

pages/pricing.ts

@@ -1,4 +1,4 @@
-import { html, PageContentResult } from '/lib/utils.ts';
+import { html, MONTHLY_PRICE, PageContentResult, YEARLY_PRICE } from '/lib/utils.ts';
 
 export function pageAction() {
   return new Response('Not Implemented', { status: 501 });
@@ -10,7 +10,7 @@ export function pageContent() {
       <h1>Pricing</h1>
       <section class="hero">
         <p>Pricing is simple.</p>
-        <p>You have a <strong>30-day free trial</strong> (no credit card required), and at the end, you can pay <strong>€18 / year</strong>, or <strong>€2 / month</strong>, no limits.</p>
+        <p>You have a <strong>30-day free trial</strong> (no credit card required), and at the end, you can pay <strong>€40 / year</strong>, or <strong>€4 / month</strong>, no limits.</p>
       </section>
       <div data-has-invalid-session>
         <h2>Signup or Login first</h2>
@@ -34,11 +34,11 @@ export function pageContent() {
         </p>
         <div class="buttons-wrapper">
           <button class="secondary" type="button" id="subscribe-month">
-            Pay €2 / month
+            Pay €${MONTHLY_PRICE} / month
           </button>
           <span class="or">or</span>
           <button type="button" id="subscribe-year">
-            Pay €18 / year
+            Pay €${YEARLY_PRICE} / year
           </button>
         </div>
       </section>

public/ts/billing.ts

@@ -128,7 +128,7 @@ document.addEventListener('app-loaded', async () => {
     const clonedElement = (template.content.firstElementChild as HTMLDivElement).cloneNode(true) as HTMLDivElement;
 
     const paymentTextElement = clonedElement.querySelector('.subscription-value') as HTMLSpanElement;
-    paymentTextElement.textContent = isSubscriptionMonthly ? '€2 / month' : '€18 / year';
+    paymentTextElement.textContent = isSubscriptionMonthly ? 'monthly' : 'yearly';
 
     const notCanceledElement = clonedElement.querySelector('#subscription-is-not-canceled') as HTMLDivElement;
     const canceledElement = clonedElement.querySelector('#subscription-is-canceled') as HTMLDivElement;