📊 Module 2: AnyCompany Pay Transaction Dashboard

Create a folder called "anycompany-pay-dashboard" in the current workspace. Build a Python script called generate_data.py that creates a file called transactions.csv with 500 synthetic payment transactions for the last 30 days. Each transaction should have these fields: date, timestamp, transaction_id, merchant_name, amount_sgd, currency, payment_channel, status, settlement_status Requirements: - payment_channel: one of "Digital Wallet", "Credit Card", "Debit Card", "BNPL" (weighted 40%, 30%, 20%, 10%) - status: "success" (92%), "failed" (5%), "pending" (2%), "refunded" (1%) - settlement_status: "settled", "pending", or "delayed" (only successful transactions can be settled) - amount_sgd: average $45, range $2 to $500 - Higher transaction volumes on weekends (Sat/Sun) - Inject 2 anomaly days with unusually high failure rates (>15%) to simulate payment gateway issues - Use realistic merchant names (e.g., "FreshMart Express", "TechZone SG", "CloudKitchen Asia") - transaction_id format: TXN-000001 Run the script and print a summary showing: total transactions, date range, status breakdown, and which days are anomaly days.

You are a Payment Operations Manager responsible for monitoring transaction health across all payment channels. You need clear visibility into daily volumes, failure rates, and settlement status. Build a Python script called dashboard.py in the anycompany-pay-dashboard folder that serves a transaction monitoring dashboard on localhost. The script should: - Read transactions.csv on every page request (so it picks up new data automatically) - Serve a single HTML page using Python's built-in http.server - Use Chart.js via CDN for all charts Dashboard layout (professional dark theme with green #00B14F accent): - IMPORTANT: All text on dark backgrounds must be white/light. All text on light-colored areas (alert banners, warning boxes) must use dark text (#333 or darker). Ensure high contrast and readability everywhere. - Header: "AnyCompany Pay — Transaction Monitor" with current date/time - Summary cards row: Total Transactions, Total Volume (SGD), Success Rate, Avg Settlement Time - Anomaly alert banner: If any day has failure rate > 10%, show a prominent alert with light background and dark readable text, listing each anomaly date with its failure count and rate - Line chart: Daily transaction volume over 30 days - Stacked bar chart: Daily transactions by status (success=green, failed=red, pending=orange, refunded=gray) - Pie/doughnut chart: Transaction distribution by payment channel - Table: Last 20 transactions with color-coded status badges - Auto-refresh every 60 seconds - Footer: "AnyCompany Pay Operations Dashboard — Data refreshed at [timestamp]" Install pandas automatically if needed. Run the script to start the server and open the dashboard in the browser.

Create a Python script called inject_transactions.py in the anycompany-pay-dashboard folder that: 1. Reads the existing transactions.csv 2. Appends 50 new transactions for today's date with these patterns: - 30 successful transactions (normal amounts $10-$100) - 10 failed transactions (to simulate a payment gateway issue) - 5 pending transactions - 5 refunded transactions - Use a mix of all payment channels - Use merchant names like "NewMerchant Alpha", "NewMerchant Beta" so they're easy to spot 3. Saves the updated transactions.csv 4. Prints a summary: "Injected 50 new transactions. Total now: X. Today's failure rate: Y%" Run the script. Then go back to the browser — the dashboard will auto-refresh within 60 seconds and show the updated data, including a new anomaly alert for today's high failure rate.

Update dashboard.py to add two new sections to the dashboard: 1. "Settlement Reconciliation" section: - A table grouped by date showing: total transactions, settled count, pending count, delayed count, settlement rate % - Highlight any day with settlement rate below 95% in yellow (use dark text on yellow background for readability) - Show a bar chart of daily settlement rates 2. "Channel Performance" section: - A comparison table: payment channel, transaction count, total volume, success rate, avg amount - Highlight the best-performing channel in green and worst in red 3. Add a "Download CSV Report" button at the top that exports the full transaction data with a reconciliation status summary appended. Restart the server after updating. Ensure all new sections maintain high contrast text (dark text on light backgrounds, light text on dark backgrounds).

Update dashboard.py to add interactive features to the dashboard: 1. Transaction Table Filtering: - Add a filter bar above the transaction table with: - A dropdown to filter by status (All, Success, Failed, Pending, Refunded) - A dropdown to filter by payment channel (All, Digital Wallet, Credit Card, Debit Card, BNPL) - A text search box to filter by merchant name - Filters should work client-side using JavaScript (no page reload needed) - Show a count of matching results: "Showing X of Y transactions" 2. Chart-to-Table Drill-Down: - When a user clicks on a bar in the "Daily Transactions by Status" stacked bar chart, update the transaction table below to show only transactions from that specific date - Show a "Viewing: [date]" label above the table when filtered, with a "Clear filter" button to reset - Use Chart.js onClick event handler for this 3. Status Summary Cards Click: - When a user clicks on the "Failed" or "Pending" summary card at the top, filter the transaction table to show only that status Keep all interactive features working with the auto-refresh. Use only client-side JavaScript — no additional server endpoints needed. Restart the server after updating.