chore: update dependencies and add Cloudflare support

- Updated dependencies in package.json for Astro, React, and testing libraries.
- Added .assetsignore to exclude specific files from asset uploads.
- Refactored AccountSummary, MainContent, and Sidebar components for clarity and maintainability.
- Enhanced tsconfig.json to support React JSX syntax.
- Created wrangler.jsonc for Cloudflare Workers configuration.

astro.config.mjs

@@ -1,7 +1,13 @@
 // @ts-check
 import { defineConfig } from "astro/config";
 
+import cloudflare from "@astrojs/cloudflare";
+
+import react from "@astrojs/react";
+
 // https://astro.build/config
 export default defineConfig({
   output: "server",
+  adapter: cloudflare(),
+  integrations: [react()],
 });

package.json

@@ -11,12 +11,19 @@
     "test:coverage": "vitest run --coverage"
   },
   "dependencies": {
-    "astro": "^5.7.5"
+    "@astrojs/cloudflare": "^12.5.1",
+    "@astrojs/react": "^4.2.5",
+    "@types/react": "^19.1.2",
+    "@types/react-dom": "^19.1.2",
+    "astro": "^5.7.5",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0"
   },
   "devDependencies": {
-    "@types/supertest": "^2.0.12",
+    "@types/supertest": "^6.0.3",
-    "@vitest/coverage-v8": "^0.34.6",
+    "@vitest/coverage-v8": "^3.1.2",
-    "supertest": "^6.3.3",
+    "supertest": "^7.1.0",
-    "vitest": "^0.34.3"
+    "vitest": "^3.1.2",
+    "wrangler": "^4.13.1"
   }
 }

public/.assetsignore

@@ -0,0 +1,2 @@
+_worker.js
+_routes.json

src/components/AccountSummary.astro

@@ -1,5 +1,5 @@
 ---
-import { formatCurrency } from '../utils'; // We'll create this util
+import { formatCurrency } from '../utils';
 import type { Account } from '../types';
 
 interface Props {
@@ -10,5 +10,4 @@ const { account } = Astro.props;
 <div class="account-summary">
      <h4>Account Summary</h4>
      <p>Balance: <span id="account-balance">{formatCurrency(account.balance)}</span></p>
-     <!-- Add more summary info if needed -->
 </div>

src/components/MainContent.astro

@@ -13,5 +13,6 @@ const { account, transactions } = Astro.props;
     <header class="main-header">
          <h1>Transactions for <span id="current-account-name">{account.name} (***{account.last4})</span></h1>
     </header>
-    <TransactionTable transactions={transactions} client:load /> {/* Make table updatable */}
+    /* Make table updatable */
+    <TransactionTable transactions={transactions} client:load /> {}
 </main>

src/components/Sidebar.astro

@@ -1,11 +1,12 @@
 ---
 import AddTransactionForm from './AddTransactionForm.astro';
 import AccountSummary from './AccountSummary.astro';
-import type { Account } from '../types'; // We'll define this type
+import type { Account } from '../types';
 
 interface Props {
     accounts: Account[];
-    initialAccount: Account; // Pass the initially selected account
+    /* The account to show in the sidebar. */
+    initialAccount: Account;
 }
 
 const { accounts, initialAccount } = Astro.props;
@@ -25,8 +26,9 @@ const { accounts, initialAccount } = Astro.props;
         </select>
     </nav>
 
-    <AccountSummary account={initialAccount} client:load /> {/* Make summary updatable */}
+    <AccountSummary account={initialAccount} /> {}
 
-    <AddTransactionForm client:load /> {/* Make form toggle interactive */}
+    /* Make form toggle interactive */
+    <AddTransactionForm client:load /> {}
 
 </aside>

tsconfig.json

@@ -1,5 +1,14 @@
 {
   "extends": "astro/tsconfigs/strict",
-  "include": [".astro/types.d.ts", "**/*"],
+  "include": [
-  "exclude": ["dist"]
+    ".astro/types.d.ts",
+    "**/*"
+  ],
+  "exclude": [
+    "dist"
+  ],
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "jsxImportSource": "react"
+  }
 }

wrangler.jsonc

@@ -0,0 +1,9 @@
+{
+  "$schema": "node_modules/wrangler/config-schema.json",
+  "name": "finance-tracker",
+  // Update to today's date
+  "compatibility_date": "2025-04-24",
+  "assets": {
+    "directory": "./dist"
+  }
+}