Fix build / enable pro / remove donation progress

.env.example

@@ -1,5 +1,4 @@
 STAGING_SECRET=
-DONATION_DATA_FILE=./data/donation-progress.json
 CONTENTFUL_SPACE_ID=
 CONTENTFUL_ENVIRONMENT_ID=
 CONTENTFUL_ACCESS_TOKEN=

.gitignore

@@ -44,3 +44,7 @@ yarn-error.log*
 *.tsbuildinfo
 
 tmp
+
+crowdin-faq-answers.csv
+crowdin-new-strings.csv*
+crowdin-new-strings.state.json

biome.json

@@ -7,7 +7,14 @@
   },
   "files": {
     "ignoreUnknown": true,
-    "includes": ["**", "!**/lib/app_localization/**", "!**/locales/**", "!contentful/export.json"]
+    "includes": [
+      "./**/*.ts",
+      "./**/*.tsx",
+      "!**/lib/app_localization/**",
+      "!**/locales/**",
+      "!contentful/export.json",
+      "!**/.next/**"
+    ]
   },
   "formatter": {
     "enabled": true,

components/RichBody.tsx

@@ -1,3 +1,4 @@
+/** biome-ignore-all lint/suspicious/noExplicitAny: ignored for now */
 import { documentToPlainTextString } from '@contentful/rich-text-plain-text-renderer';
 import { documentToReactComponents, type Options } from '@contentful/rich-text-react-renderer';
 import { BLOCKS, type Document, INLINES, type Inline, MARKS } from '@contentful/rich-text-types';
@@ -8,7 +9,7 @@ import Link from 'next/link';
 import { Children, cloneElement, type ReactElement } from 'react';
 import SHORTCODES from '@/constants/shortcodes';
 import { renderEmbeddedEntry } from '@/services/render';
-import { hasLocalID, isLocal, parseUrl } from '@/utils/links';
+import { hasLocalID, isLocal, parseUrl, slugifyHeading } from '@/utils/links';
 import { renderShortcode } from '@/utils/shortcodes';
 
 interface Props {
@@ -138,7 +139,7 @@ export default function RichBody(props: Props): ReactElement {
       [BLOCKS.HEADING_1]: (node, children: any) => (
         <h1
           dir={getDirection(children)}
-          id={hasLocalID(node as Inline)}
+          id={hasLocalID(node as Inline) || slugifyHeading(node)}
           className={classNames('mb-5 text-3xl leading-snug', 'lg:text-5xl', headingClasses)}
         >
           {children}
@@ -147,7 +148,7 @@ export default function RichBody(props: Props): ReactElement {
       [BLOCKS.HEADING_2]: (node, children: any) => (
         <h2
           dir={getDirection(children)}
-          id={hasLocalID(node as Inline)}
+          id={hasLocalID(node as Inline) || slugifyHeading(node)}
           className={classNames('mb-5 text-2xl leading-snug', 'lg:text-3xl', headingClasses)}
         >
           {children}
@@ -156,7 +157,7 @@ export default function RichBody(props: Props): ReactElement {
       [BLOCKS.HEADING_3]: (node, children: any) => (
         <h3
           dir={getDirection(children)}
-          id={hasLocalID(node as Inline)}
+          id={hasLocalID(node as Inline) || slugifyHeading(node)}
           className={classNames('mb-2 text-xl leading-snug', 'lg:text-2xl', headingClasses)}
         >
           {children}
@@ -165,7 +166,7 @@ export default function RichBody(props: Props): ReactElement {
       [BLOCKS.HEADING_4]: (node, children: any) => (
         <h4
           dir={getDirection(children)}
-          id={hasLocalID(node as Inline)}
+          id={hasLocalID(node as Inline) || slugifyHeading(node)}
           className={classNames('mb-2 text-md leading-snug', 'lg:text-xl', headingClasses)}
         >
           {children}

components/copied/ArbitrumIcon.tsx

@@ -2,7 +2,14 @@ import { forwardRef } from 'react';
 import type { SVGAttributes } from './types';
 
 export const ArbitrumIcon = forwardRef<SVGSVGElement, SVGAttributes>((props, ref) => (
-  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2500 2500" {...props} ref={ref}>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 2500 2500"
+    {...props}
+    ref={ref}
+    aria-hidden="true"
+    focusable="false"
+  >
     <path fill="none" d="M0 0h2500v2500H0z" />
     <path
       fill="#213147"

components/copied/BNBIcon.tsx

@@ -9,6 +9,8 @@ export const BNBIcon = forwardRef<SVGSVGElement, SVGAttributes>((props, ref) =>
     viewBox="0 0 2496 2496"
     {...props}
     ref={ref}
+    aria-hidden="true"
+    focusable="false"
   >
     <path
       d="M1248 0c689.3 0 1248 558.7 1248 1248s-558.7 1248-1248 1248S0 1937.3 0 1248 558.7 0 1248 0z"

components/copied/BankIcon.tsx

@@ -10,6 +10,8 @@ export const BankIcon = forwardRef<SVGSVGElement, SVGAttributes>((props, ref) =>
     xmlns="http://www.w3.org/2000/svg"
     {...props}
     ref={ref}
+    aria-hidden="true"
+    focusable="false"
   >
     <path fill="#66757F" d="M3 16h30v18H3z"></path>
     <path fill="#CCD6DD" d="M2 34h32a2 2 0 0 1 2 2H0a2 2 0 0 1 2-2z"></path>

components/copied/BitcoinCashIcon.tsx

@@ -8,6 +8,8 @@ export const BitcoinCashIcon = forwardRef<SVGSVGElement, SVGAttributes>((props,
     viewBox="0 0 788 788"
     {...props}
     ref={ref}
+    aria-hidden="true"
+    focusable="false"
   >
     <circle cx="394" cy="394" r="394" style={{ fill: '#0ac18e' }} />
     <path

components/copied/BitcoinIcon.tsx

@@ -13,6 +13,8 @@ export const BitcoinIcon = forwardRef<SVGSVGElement, SVGAttributes>((props, ref)
     shapeRendering="geometricPrecision"
     textRendering="geometricPrecision"
     viewBox="0 0 4091.27 4091.73"
+    aria-hidden="true"
+    focusable="false"
   >
     <g fillRule="nonzero">
       <path

components/copied/EthIcon.tsx

@@ -10,6 +10,8 @@ export const EthIcon = forwardRef<SVGSVGElement, SVGAttributes>((props, ref) =>
     xmlns="http://www.w3.org/2000/svg"
     {...props}
     ref={ref}
+    aria-hidden="true"
+    focusable="false"
   >
     <g fill="none" fillRule="evenodd">
       <circle cx="16" cy="16" r="16" fill="#627EEA" />

components/copied/MoneroIcon.tsx

@@ -10,6 +10,8 @@ export const MoneroIcon = forwardRef<SVGSVGElement, SVGAttributes>((props, ref)
     xmlns="http://www.w3.org/2000/svg"
     {...props}
     ref={ref}
+    aria-hidden="true"
+    focusable="false"
   >
     <path
       d="M1000 0C447.8 0 0 447.8 0 1000a993.26 993.26 0 0 0 51 315.8h299V474.4l650 650 650-650v841.4h299a999.82 999.82 0 0 0 51-315.8C2000 447.8 1552.2 0 1000 0"

components/copied/USDCIcon.tsx

@@ -2,7 +2,15 @@ import { forwardRef } from 'react';
 import type { SVGAttributes } from './types';
 
 export const USDCIcon = forwardRef<SVGSVGElement, SVGAttributes>((props, ref) => (
-  <svg viewBox="0 0 2000 2000" fill="none" xmlns="http://www.w3.org/2000/svg" {...props} ref={ref}>
+  <svg
+    viewBox="0 0 2000 2000"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+    ref={ref}
+    aria-hidden="true"
+    focusable="false"
+  >
     <path
       d="M1000 2000c554.17 0 1000-445.83 1000-1000S1554.17 0 1000 0 0 445.83 0 1000s445.83 1000 1000 1000z"
       fill="#2775ca"

constants/navigation.ts

@@ -11,14 +11,10 @@ export type NavItemKey = keyof Omit<Messages['navigation'], 'aria'>;
 type INavList = Record<NavItemKey | string, INavItem>;
 
 const NAV_ITEMS: INavList = {
-  ...(process.env.ENABLE_PRO_PAGE === '1'
-    ? {
-        pro: {
-          href: '/pro',
-          target: '_self',
-        },
-      }
-    : {}),
+  pro: {
+    href: '/pro',
+    target: '_self',
+  },
   resources: {
     href: '/resources',
     target: '_self',

lib/proBackend.ts

@@ -10,36 +10,37 @@ export type PricingApiResponse = {
  * Expected API response shape:
  * {
  *   plans: [
- *     { duration: "P1M",  label: "Monthly",  unitText: "MONTH", price: "2.49",  currency: "USD" },
- *     { duration: "P3M",  label: "3 Months", unitText: "MONTH", price: "5.99",  currency: "USD" },
- *     { duration: "P1Y",  label: "Annual",   unitText: "YEAR",  price: "14.99", currency: "USD" }
+ *     { duration: "P1M",  label: "Monthly",  unitText: "MONTH", price: "4.49",  currency: "USD" },
+ *     { duration: "P3M",  label: "3 Months", unitText: "MONTH", price: "11.99",  currency: "USD" },
+ *     { duration: "P1Y",  label: "Annual",   unitText: "YEAR",  price: "35.99", currency: "USD" }
  *   ]
  * }
  */
-export async function fetchProPricing(locale: string): Promise<PricingApiResponse> {
-  return {
-    plans: [
-      { duration: 'P1M', label: 'Monthly', unitText: 'MONTH', price: '2.49', currency: 'USD' },
-      { duration: 'P3M', label: '3 Months', unitText: 'MONTH', price: '5.99', currency: 'USD' },
-      { duration: 'P1Y', label: 'Annual', unitText: 'YEAR', price: '14.99', currency: 'USD' },
-    ],
-  };
-
-  const res = await fetch(`${process.env.PRICING_API_BASE_URL}/pro/pricing?locale=${locale}`, {
-    headers: {
-      'Content-Type': 'application/json',
-      // Add any auth headers your API requires, e.g.:
-      // Authorization: `Bearer ${process.env.PRICING_API_KEY}`,
+export const proPricing: PricingApiResponse = {
+  plans: [
+    {
+      duration: 'P1M',
+      label: 'Monthly',
+      unitText: 'MONTH',
+      price: '4.49',
+      currency: 'USD',
+      priceNumber: 4.49,
     },
-    // Revalidate pricing every hour during ISR if you use it
-    next: { revalidate: 3600 },
-  });
-
-  if (!res.ok) {
-    throw new Error(
-      `Failed to fetch Pro pricing for locale "${locale}": ${res.status} ${res.statusText}`
-    );
-  }
-
-  return res.json() as Promise<PricingApiResponse>;
-}
+    {
+      duration: 'P3M',
+      label: '3 Months',
+      unitText: 'MONTH',
+      price: '11.99',
+      currency: 'USD',
+      priceNumber: 11.99,
+    },
+    {
+      duration: 'P1Y',
+      label: 'Annual',
+      unitText: 'YEAR',
+      price: '35.99',
+      currency: 'USD',
+      priceNumber: 35.99,
+    },
+  ],
+};

lib/proPageSchema.ts

@@ -1,3 +1,4 @@
+/** biome-ignore-all lint/suspicious/noExplicitAny: ignored for now */
 import { NON_LOCALIZED_STRING } from '@/constants/localization';
 import {
   isCrowdinLocale,
@@ -13,6 +14,7 @@ export type PricingPlan = {
   label: string; // e.g. "Monthly", "3 Months", "Annual"
   unitText: 'MONTH' | 'YEAR';
   price: string; // e.g. "2.49"
+  priceNumber: number;
   currency: string; // e.g. "USD"
 };
 
@@ -51,6 +53,7 @@ export type SchemaRoadmapItem = {
 export type ProPageSchemaProps = {
   locale: string;
   pricing: PricingApiResponse;
+
   messages: Record<string, any>;
 };
 
@@ -114,7 +117,14 @@ function resolve(obj: Record<string, any>, path: string): string {
   const t = new LocalizedStringBuilder(rawMessage as any);
   t.withArgs({ ...NON_LOCALIZED_STRING });
   // @ts-expect-error TODO: make method public
-  return t.formatStringWithArgs(rawMessage);
+  const formatted: string = t.formatStringWithArgs(rawMessage);
+
+  // schema.org values are plain text, so the rich-text tags the page renders (<br>, <bold>,
+  // <li>, the link tags) would otherwise ship as literal markup inside the JSON-LD
+  return formatted
+    .replace(/<[^<>]*>/g, ' ')
+    .replace(/\s+/g, ' ')
+    .trim();
 }
 
 function buildOffersSchema(pricing: ProPageSchemaProps['pricing']): SchemaOffer[] {
@@ -143,7 +153,7 @@ function buildSoftwareApplicationSchema(offers: SchemaOffer[], messages: Record<
   };
 }
 
-function buildProFeaturesSchema(messages: Record<string, any>) {
+function buildProFeaturesSchema(_messages: Record<string, any>) {
   // TODO: set locale
   const features = getProFeatures(false);
 
@@ -205,8 +215,7 @@ function buildFAQSchema(messages: Record<string, any>) {
  *
  * @example
  * // In getStaticProps:
- * const pricing = await fetchProPricing(context.locale);
- * const schemas = generateProPageSchemas({ locale, pricing, messages });
+ * const schemas = generateProPageSchemas({ locale, pricing: proPricing, messages });
  * return { props: { messages, schemas } };
  *
  * // In ProPage component: