feat(treasury): show fiat in R$ on the pt-BR locale (#274)

Every USD figure on the treasury page — total value KPI, allocation
bar, token holdings values, sponsorship TVL/yield — converts to BRL
on pt-br at one server-cached USD→BRL rate (open.er-api.com, 1h
unstable_cache; errors are not cached so a miss retries next request).
Token quantities never convert: a USDC position's USD value multiplies
by the rate like everything else — 1 USDC is not R$ 1.

If the rate fetch fails the page keeps US$ figures and each affected
card says so out loud (FiatFallbackNote) instead of silently showing
stale reais. EN is untouched.

Co-authored-by: Claude Fable 5 <noreply@anthropic.com>

Author: sktbrd

messages/en/treasury.json

@@ -12,6 +12,9 @@
       "description": "Non-fungible tokens held in the treasury"
     }
   },
+  "fiat": {
+    "usdFallback": "BRL rate unavailable — values shown in US$"
+  },
   "tokens": {
     "title": "Token Holdings",
     "description": "ERC-20 tokens held in the treasury",

messages/pt-br/treasury.json

@@ -12,6 +12,9 @@
       "description": "Tokens não-fungíveis mantidos no tesouro"
     }
   },
+  "fiat": {
+    "usdFallback": "Cotação do dólar indisponível — valores em US$"
+  },
   "tokens": {
     "title": "Holdings de Tokens",
     "description": "Tokens ERC-20 mantidos no tesouro",

src/app/[locale]/treasury/page.tsx

@@ -15,6 +15,7 @@ import { TreasuryBalance } from "@/components/treasury/TreasuryBalance";
 import { TreasuryInflows } from "@/components/treasury/TreasuryInflows";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { DAO_ADDRESSES } from "@/lib/config";
+import { getBrlRateForRequest } from "@/services/exchange-rate";
 
 export async function generateMetadata({
   params,
@@ -71,6 +72,9 @@ export default async function TreasuryPage({ params }: { params: Promise<{ local
   const { locale } = await params;
   setRequestLocale(locale);
   const t = await getTranslations("treasury");
+  // One USD→BRL lookup per request, shared by every fiat display on the page.
+  // SponsorshipYield is a client component, so its copy arrives as a prop.
+  const brlRate = await getBrlRateForRequest();
 
   return (
     <div className="py-8">
@@ -143,7 +147,7 @@ export default async function TreasuryPage({ params }: { params: Promise<{ local
               that void, and surrendering its old half-width row gives the NFT
               grid the full width it actually benefits from. */}
           <div className="space-y-6">
-            <SponsorshipYield />
+            <SponsorshipYield brlRate={brlRate} />
             <Suspense fallback={<TableSkeleton />}>
               <TokenHoldings treasuryAddress={DAO_ADDRESSES.treasury} />
             </Suspense>

src/components/treasury/FiatFallbackNote.tsx

@@ -0,0 +1,27 @@
+"use client";
+
+import { useLocale, useTranslations } from "next-intl";
+import { cn } from "@/lib/utils";
+
+/**
+ * Shown on pt-br whenever the USD→BRL rate could not be fetched: the page then
+ * keeps its figures in US$, and this note says so out loud. Silent fallback is
+ * the failure mode this exists to prevent — a visitor must never read a USD
+ * number as reais.
+ */
+export function FiatFallbackNote({
+  brlRate,
+  className,
+}: {
+  brlRate: number | null;
+  className?: string;
+}) {
+  const locale = useLocale();
+  const t = useTranslations("treasury.fiat");
+  if (locale !== "pt-br" || brlRate != null) return null;
+  return (
+    <p className={cn("text-xs text-amber-600 dark:text-amber-500", className)}>
+      {t("usdFallback")}
+    </p>
+  );
+}

src/components/treasury/SponsorshipYield.tsx

@@ -34,6 +34,9 @@ import { Button } from "@/components/ui/button";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { useStakeGraphQuery } from "@/hooks/use-stake-graph";
 import { RIDER_LIST, type RiderId } from "@/lib/gnars-vaults";
+import { localizeFiat } from "@/lib/i18n/fiat";
+import { toIntlLocale } from "@/lib/i18n/format";
+import { FiatFallbackNote } from "./FiatFallbackNote";
 
 /**
  * Avatar crop per rider. Duplicated from StakeOrbit's `RIDER_VISUAL` on purpose,
@@ -57,7 +60,7 @@ export const AVATAR: Record<RiderId, { src: string; size: string; pos: string }>
 // the explorer renders the contract, its recipients and the Distribute button.
 const SPLITS_APP = (split: string) => `https://explorer.splits.org/accounts/${split}/?chainId=8453`;
 
-export function SponsorshipYield() {
+export function SponsorshipYield({ brlRate = null }: { brlRate?: number | null }) {
   const t = useTranslations("treasury.sponsorship");
   const tc = useTranslations("stake.characters");
   const locale = useLocale();
@@ -66,8 +69,17 @@ export function SponsorshipYield() {
   // Nothing deployed yet — don't show an empty widget on the treasury page.
   if (RIDER_LIST.every((r) => !r.vault)) return null;
 
-  const usd = (n: number) =>
-    `$${n.toLocaleString(locale, { maximumFractionDigits: n > 0 && n < 100 ? 4 : 2 })}`;
+  const usd = (n: number) => {
+    const { value, currency } = localizeFiat(n, locale, brlRate);
+    // The 4-digit rule keys off the DISPLAYED magnitude: a sub-cent accrual
+    // stays sub-cent after conversion and still needs the extra precision.
+    return new Intl.NumberFormat(toIntlLocale(locale), {
+      style: "currency",
+      currency,
+      minimumFractionDigits: 0,
+      maximumFractionDigits: value > 0 && value < 100 ? 4 : 2,
+    }).format(value);
+  };
 
   const byId = new Map((graph?.athletes ?? []).map((a) => [a.id, a]));
   const rows = RIDER_LIST.map((r) => {
@@ -109,6 +121,7 @@ export function SponsorshipYield() {
           <p className="mt-2 text-[11px] leading-relaxed text-muted-foreground/70">
             {t("accrualNote")}
           </p>
+          <FiatFallbackNote brlRate={brlRate} className="mt-2" />
         </div>
 
         <div>

src/components/treasury/TokenHoldings.tsx

@@ -1,6 +1,7 @@
 import { cache } from "react";
 import { headers } from "next/headers";
 import { TREASURY_TOKEN_ADDRESSES } from "@/lib/config";
+import { getBrlRateForRequest } from "@/services/exchange-rate";
 import { getTokenPricesUsd } from "@/services/prices";
 import { EnrichedToken, TokenHoldingsClient } from "./TokenHoldingsClient";
 
@@ -156,5 +157,6 @@ export async function TokenHoldings({ treasuryAddress }: TokenHoldingsProps) {
   } catch (err) {
     error = err instanceof Error ? err.message : "Failed to load token holdings";
   }
-  return <TokenHoldingsClient tokens={tokens} error={error} />;
+  const brlRate = await getBrlRateForRequest();
+  return <TokenHoldingsClient tokens={tokens} error={error} brlRate={brlRate} />;
 }

src/components/treasury/TokenHoldingsClient.tsx

@@ -3,7 +3,9 @@
 import { useLocale, useTranslations } from "next-intl";
 import Image from "next/image";
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
+import { formatFiatUsd } from "@/lib/i18n/fiat";
 import { toIntlLocale } from "@/lib/i18n/format";
+import { FiatFallbackNote } from "./FiatFallbackNote";
 
 export interface EnrichedToken {
   contractAddress: string;
@@ -19,9 +21,11 @@ export interface EnrichedToken {
 interface TokenHoldingsClientProps {
   tokens: EnrichedToken[];
   error?: string | null;
+  /** USD→BRL rate for value display on pt-br; `null` keeps USD. */
+  brlRate?: number | null;
 }
 
-export function TokenHoldingsClient({ tokens, error }: TokenHoldingsClientProps) {
+export function TokenHoldingsClient({ tokens, error, brlRate = null }: TokenHoldingsClientProps) {
   const t = useTranslations("treasury");
   const locale = useLocale();
   const intlLocale = toIntlLocale(locale);
@@ -36,12 +40,7 @@ export function TokenHoldingsClient({ tokens, error }: TokenHoldingsClientProps)
   const formatUsdValue = (value: number | null) => {
     // A real balance we couldn't price reads as a dash, never as $0.00.
     if (value == null) return "—";
-    return new Intl.NumberFormat(intlLocale, {
-      style: "currency",
-      currency: "USD",
-      minimumFractionDigits: 2,
-      maximumFractionDigits: 2,
-    }).format(value);
+    return formatFiatUsd(value, locale, brlRate);
   };
 
   if (error) {
@@ -72,6 +71,7 @@ export function TokenHoldingsClient({ tokens, error }: TokenHoldingsClientProps)
       <CardHeader>
         <CardTitle>{t("tokens.title")}</CardTitle>
         <CardDescription>{t("tokens.description")}</CardDescription>
+        <FiatFallbackNote brlRate={brlRate} />
       </CardHeader>
       <CardContent>
         {/* Two-line rows instead of a three-column table: this card lives in

src/components/treasury/TreasuryAllocation.tsx

@@ -1,7 +1,10 @@
-import { getTranslations } from "next-intl/server";
+import { getLocale, getTranslations } from "next-intl/server";
 import { Card, CardContent } from "@/components/ui/card";
 import { DAO_ADDRESSES } from "@/lib/config";
+import { formatFiatUsd } from "@/lib/i18n/fiat";
+import { getBrlRateForRequest } from "@/services/exchange-rate";
 import { loadTreasurySnapshot } from "@/services/treasury";
+import { FiatFallbackNote } from "./FiatFallbackNote";
 import { loadTokenHoldings } from "./TokenHoldings";
 
 /**
@@ -35,6 +38,8 @@ type Slice = { label: string; usd: number; color: string };
 
 export async function TreasuryAllocation() {
   const t = await getTranslations("treasury.allocation");
+  const locale = await getLocale();
+  const brlRate = await getBrlRateForRequest();
 
   let slices: Slice[] = [];
   try {
@@ -74,8 +79,7 @@ export async function TreasuryAllocation() {
   if (slices.length === 0) return null;
 
   const total = slices.reduce((s, x) => s + x.usd, 0);
-  const usd = (n: number) =>
-    `$${n.toLocaleString("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`;
+  const usd = (n: number) => formatFiatUsd(n, locale, brlRate);
   const pct = (n: number) => (n / total) * 100;
 
   return (
@@ -113,6 +117,8 @@ export async function TreasuryAllocation() {
             </li>
           ))}
         </ul>
+
+        <FiatFallbackNote brlRate={brlRate} className="mt-3" />
       </CardContent>
     </Card>
   );

src/components/treasury/TreasuryBalance.tsx

@@ -1,3 +1,4 @@
+import { getBrlRateForRequest } from "@/services/exchange-rate";
 import { loadTreasurySnapshot } from "@/services/treasury";
 import { TreasuryBalanceClient } from "./TreasuryBalanceClient";
 
@@ -23,5 +24,7 @@ export async function TreasuryBalance({ treasuryAddress, metric = "total" }: Tre
   } catch (err) {
     error = err instanceof Error ? err.message : "Failed to load treasury data";
   }
-  return <TreasuryBalanceClient metric={metric} value={value} error={error} />;
+  // Only the "total" metric is a fiat figure; ETH metrics never convert.
+  const brlRate = metric === "total" ? await getBrlRateForRequest() : null;
+  return <TreasuryBalanceClient metric={metric} value={value} error={error} brlRate={brlRate} />;
 }

src/components/treasury/TreasuryBalanceClient.tsx

@@ -1,19 +1,28 @@
 "use client";
 
+import { useLocale } from "next-intl";
 import { CountUp } from "@/components/ui/count-up";
 import { Skeleton } from "@/components/ui/skeleton";
+import { localizeFiat } from "@/lib/i18n/fiat";
+import { FiatFallbackNote } from "./FiatFallbackNote";
 
 export interface TreasuryBalanceClientProps {
   metric: "total" | "eth" | "auctions";
   value?: number;
   error?: string | null;
+  /** USD→BRL rate for the fiat metric on pt-br; `null` keeps USD. */
+  brlRate?: number | null;
 }
 
-export function TreasuryBalanceClient({ metric, value, error }: TreasuryBalanceClientProps) {
-  const isUsd = metric === "total";
-  const decimals = isUsd ? 2 : 4;
-  const prefix = isUsd ? "$" : "";
-  const suffix = isUsd ? "" : " ETH";
+export function TreasuryBalanceClient({
+  metric,
+  value,
+  error,
+  brlRate = null,
+}: TreasuryBalanceClientProps) {
+  const locale = useLocale();
+  const isFiat = metric === "total";
+  const decimals = isFiat ? 2 : 4;
 
   if (error) {
     return <div className="text-2xl font-semibold text-destructive">Error</div>;
@@ -23,11 +32,21 @@ export function TreasuryBalanceClient({ metric, value, error }: TreasuryBalanceC
     return <Skeleton className="h-8 w-32" />;
   }
 
+  const { value: displayValue, currency } = isFiat
+    ? localizeFiat(value, locale, brlRate)
+    : { value, currency: null };
+  const prefix =
+    currency === "BRL" ? "R$ " : currency === "USD" ? (locale === "pt-br" ? "US$ " : "$") : "";
+  const suffix = isFiat ? "" : " ETH";
+
   return (
-    <div className="text-2xl font-semibold text-foreground">
-      {prefix}
-      <CountUp value={value} decimals={decimals} className="tabular-nums" />
-      {suffix}
+    <div>
+      <div className="text-2xl font-semibold text-foreground">
+        {prefix}
+        <CountUp value={displayValue} decimals={decimals} className="tabular-nums" />
+        {suffix}
+      </div>
+      {isFiat && <FiatFallbackNote brlRate={brlRate} className="mt-1" />}
     </div>
   );
 }