This commit resolves an issue where the Update button in the transaction form would remain disabled when attempting to edit a transaction. The problem was in how the transactionStore was managing state updates during transaction editing. Key changes: - Enhanced startEditingTransaction function in transactionStore.ts to ensure proper reactivity - Added clean copy creation of transaction objects to avoid reference issues - Implemented a state update cycle with null value first to force reactivity - Added a small timeout to ensure state changes are properly detected by components The Transaction form now correctly enables the Update button when in edit mode, regardless of account selection state.
My Bank App - Financial Transaction Manager
A web application for managing financial transactions across multiple bank accounts.
Project Overview
- Purpose: Provides a user interface for CRUD operations on financial transactions.
- Technology: Built with Astro, TypeScript, and plain CSS, utilizing Astro API routes.
- Layout: Features a two-column dashboard design with a sidebar for account selection/actions and a main area for transaction display.
- Data Management: Currently uses an in-memory data store (
src/data/store.ts) accessed via API endpoints (src/pages/api/). - Key Features (Implemented & Planned): Account switching, transaction listing, adding, editing, and deleting transactions.
Logs
This app is currently deployed using Cloudflare Pages. The logs can be viewed with the npx wrangler pages deployment tail --project-name finance command.
Development Environment Setup
For detailed setup instructions, including container building, environment configuration, and troubleshooting, see ENVIRONMENT_SETUP.md.
GitHub MCP Server
The project uses GitHub's MCP server for development tasks. The server runs in a Docker container and is automatically configured when you open the project in a devcontainer.
Configuration
- The MCP server uses GitHub authentication via Personal Access Token
- Token is stored securely in
.devcontainer/.env(not committed to repository) - GitHub CLI is installed in the devcontainer for easier authentication management
- Container health monitoring is configured
Usage
The MCP server will automatically start when you open the project in a devcontainer. If you need to manually authenticate:
- Run
gh auth loginin the terminal - Follow the prompts to authenticate with your GitHub account
Database Setup
Development Container Setup
GitHub Personal Access Token
Before using the development container, you'll need a GitHub Personal Access Token (PAT) with the following permissions:
repo(Full control of private repositories)read:packages(Download container images)write:packages(Upload container images)delete:packages(Optional: manage container versions)workflow(GitHub Actions integration)
Using the Development Container
Command Line Interface
You can build and start the development container using the devcontainer CLI:
# Build the container
devcontainer build .
# Start the container (with post-create command)
devcontainer up --workspace-folder .
# Start the container (skip post-create)
devcontainer up --workspace-folder . --skip-post-create
VS Code
- Open the project in VS Code
- Press F1 and run "Dev Containers: Rebuild and Reopen in Container"
- To skip post-create steps: Press F1 and run "Dev Containers: Rebuild Container Without Cache"
Troubleshooting
- If GitHub authentication fails, ensure your PAT is correctly set in
.devcontainer/.env - For network issues, try rebuilding the container with
--no-cacheoption - Check the VS Code "Dev Containers" output panel for detailed logs