Phase 1: Infrastructure setup - Install next-intl and create basic i18n structure

- Install next-intl package
- Create LanguageProvider hook with localStorage persistence
- Create IntlProvider component for next-intl integration
- Create Providers wrapper component
- Update layout.tsx to include providers and set default lang to 'es'
- Create initial translation files (common.json) for es, en, ca
- Fix pre-existing TypeScript errors in various pages

All tests passing, build successful.

frontend/app/trades/page.tsx

@@ -8,6 +8,7 @@ import { PageLayout } from "../components/PageLayout";
 import { SatsDisplay } from "../components/SatsDisplay";
 import { StatusBadge } from "../components/StatusBadge";
 import { EmptyState } from "../components/EmptyState";
+import { ConfirmationButton } from "../components/ConfirmationButton";
 import { useRequireAuth } from "../hooks/useRequireAuth";
 import { useAsyncData } from "../hooks/useAsyncData";
 import { useMutation } from "../hooks/useMutation";
@@ -54,10 +55,10 @@ export default function TradesPage() {
     }
   };
 
-  const upcomingTrades = trades.filter(
+  const upcomingTrades = (trades ?? []).filter(
     (t) => t.status === "booked" && new Date(t.slot_start) > new Date()
   );
-  const pastOrFinalTrades = trades.filter(
+  const pastOrFinalTrades = (trades ?? []).filter(
     (t) => t.status !== "booked" || new Date(t.slot_start) <= new Date()
   );
 
@@ -74,7 +75,7 @@ export default function TradesPage() {
 
       {isLoadingTrades ? (
         <EmptyState message="Loading trades..." isLoading={true} />
-      ) : trades.length === 0 ? (
+      ) : (trades?.length ?? 0) === 0 ? (
         <EmptyState
           message="You don't have any trades yet."
           action={
@@ -140,7 +141,9 @@ export default function TradesPage() {
                               /BTC
                             </span>
                           </div>
-                          <StatusBadge tradeStatus={trade.status} style={{ marginTop: "0.5rem" }} />
+                          <StatusBadge tradeStatus={trade.status} style={{ marginTop: "0.5rem" }}>
+                            {""}
+                          </StatusBadge>
                         </div>
 
                         <div style={tradeCardStyles.buttonGroup}>
@@ -224,7 +227,7 @@ export default function TradesPage() {
                         </span>
                       </div>
                       <div style={tradeCardStyles.buttonGroup}>
-                        <StatusBadge tradeStatus={trade.status} />
+                        <StatusBadge tradeStatus={trade.status}>{""}</StatusBadge>
                         <button
                           onClick={(e) => {
                             e.stopPropagation();