dwindown/wp-agentic-writer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
main
wp-agentic-writer/COST_TRACKING_IMPLEMENTATION.md
dwindown 97426d5ab1 first commit all files
2026-01-28 00:26:00 +07:00

9.3 KiB
Raw Permalink Blame History

Cost Tracking Enhancement Implementation

Overview

Comprehensive cost tracking system implemented with three major features:

  1. CPT Column - Total cost per post in post list table
  2. Global Cost Log - Detailed cost tracking in settings page
  3. Cost Shortcuts - Quick access links in settings

1. CPT Column for Post List

File Created

/includes/class-admin-columns.php

Features

  • 💰 AI Cost column in post list table
  • Shows total cost per post with color coding:
    • Green: < $0.50
    • Yellow: $0.50 - $1.00
    • Red: > $1.00
  • Sortable - Click column header to sort by cost
  • Shows - for posts with no AI usage
  • Handles deleted posts gracefully

Implementation

// Adds column to post list
add_filter('manage_post_columns', 'add_cost_column');

// Renders cost with color coding
add_action('manage_post_custom_column', 'render_cost_column');

// Makes column sortable
add_filter('manage_edit-post_sortable_columns', 'make_cost_column_sortable');

// Handles sorting query
add_action('pre_get_posts', 'sort_by_cost');

Initialization

Added to wp-agentic-writer.php:

if ( is_admin() ) {
    WP_Agentic_Writer_Admin_Columns::get_instance();
}

2. Global Cost Log Tab

Location

Settings → Agentic Writer → Cost Log tab

Features

Summary Stats (4 Cards)

  • 💰 All Time - Total spent across all posts
  • 📅 This Month - Current month spending
  • ☀️ Today - Today's spending
  • 📝 Avg Per Post - Average cost per post

Advanced Filters

  • Post ID - Filter by specific post
  • Model - Filter by AI model used
  • Type - Filter by operation (chat, planning, writing, etc.)
  • Date Range - From/To date pickers
  • Clear Filters - Reset all filters

Detailed Cost Table

Columns:

  • Date/Time
  • Post (with link or [Removed Post #123] for deleted)
  • Model (displayed as code)
  • Type (formatted: Chat, Planning, Writing, etc.)
  • Input Tokens
  • Output Tokens
  • Cost ($0.0000 format)

Additional Features

  • Pagination - 50 records per page
  • Export CSV - Download full cost log
  • Responsive - Horizontal scroll on small screens
  • Hover Effects - Row highlighting

Implementation

Settings Tab Navigation

Added to class-settings.php:

<button type="button" class="wpaw-settings-nav-btn" data-tab="cost-log">
    <span class="dashicons dashicons-chart-line"></span>
    Cost Log
</button>

Tab Content

<div class="wpaw-tab-content" data-tab="cost-log">
    <?php $this->render_cost_log_tab(); ?>
</div>

Method: render_cost_log_tab()

  • Queries cost database with filters
  • Calculates summary statistics
  • Renders stats grid, filters, table, pagination
  • Includes CSV export JavaScript

3. Cost Shortcuts

Location

Settings → General → Budget & Cost Tracking section

Feature

"View Full Cost Log →" link appears below the budget progress bar

Implementation

<div class="wpaw-cost-shortcuts">
    <a href="<?php echo admin_url('options-general.php?page=wp-agentic-writer-settings&tab=cost-log'); ?>" 
       class="wpaw-cost-shortcut-link">
        <span class="dashicons dashicons-chart-line"></span>
        View Full Cost Log →
    </a>
</div>

Styling

  • Blue border with light blue background
  • Hover: Blue background with white text
  • Smooth transitions
  • Icon + text layout

CSS Styling Added

File Modified

/assets/css/admin.css

New Styles

Cost Shortcuts

.wpaw-cost-shortcuts
.wpaw-cost-shortcut-link
.wpaw-cost-shortcut-link:hover

Cost Stats Grid

.wpaw-cost-stats-grid
.wpaw-cost-stat-card
.wpaw-cost-stat-icon
.wpaw-cost-stat-value
.wpaw-cost-stat-label

Cost Filters

.wpaw-cost-filters
.wpaw-filter-row
.wpaw-filter-field
.wpaw-filter-actions

Cost Log Table

.wpaw-cost-log-table-wrapper
.wpaw-cost-log-table
.wpaw-cost-log-table thead
.wpaw-cost-log-table th
.wpaw-cost-log-table td
.wpaw-cost-log-table tbody tr:hover
.wpaw-removed-post

Pagination

.wpaw-pagination
.wpaw-pagination-info

Database Queries

Cost Column Query

SELECT SUM(cost) 
FROM wp_wp_agentic_writer_costs 
WHERE post_id = %d

Cost Log Queries

-- Total count with filters
SELECT COUNT(*) FROM wp_wp_agentic_writer_costs WHERE [filters]

-- Cost records with pagination
SELECT * FROM wp_wp_agentic_writer_costs 
WHERE [filters] 
ORDER BY created_at DESC 
LIMIT 50 OFFSET 0

-- Summary stats
SELECT SUM(cost) FROM wp_wp_agentic_writer_costs -- All time
SELECT SUM(cost) WHERE MONTH(created_at) = MONTH(NOW()) -- This month
SELECT SUM(cost) WHERE DATE(created_at) = CURDATE() -- Today
SELECT COUNT(DISTINCT post_id) WHERE post_id > 0 -- Total posts

User Experience Flow

1. Post List View

Posts → All Posts
└─ See "💰 AI Cost" column
   ├─ Click header to sort by cost
   ├─ Green/Yellow/Red color coding
   └─ Click post to edit

2. Settings Quick Access

Settings → Agentic Writer → General
└─ Budget & Cost Tracking section
   ├─ View monthly progress bar
   ├─ See summary stats
   └─ Click "View Full Cost Log →"

3. Cost Log Deep Dive

Settings → Agentic Writer → Cost Log
└─ Summary Stats (4 cards)
   ├─ All Time, This Month, Today, Avg Per Post
└─ Filters
   ├─ Post ID, Model, Type, Date Range
   └─ Apply Filters / Clear
└─ Detailed Table
   ├─ 50 records per page
   ├─ Pagination controls
   ├─ Click post title to edit
   └─ Export CSV button

Deleted Post Handling

Problem

Posts may be deleted but cost records remain

Solution

$post_title = get_the_title($cost->post_id);
if (!$post_title && $cost->post_id > 0) {
    $post_title = sprintf(__('[Removed Post #%d]'), $cost->post_id);
    $post_class = 'wpaw-removed-post'; // Gray, italic
}

Display

  • Shows [Removed Post #123] in gray italic
  • No link (prevents 404 errors)
  • Still shows all cost data
  • Filterable by post ID

Export CSV Feature

Implementation

JavaScript in render_cost_log_tab():

$('#wpaw-export-csv').on('click', function() {
    // Extract table data
    // Format as CSV with escaped quotes
    // Create blob and download
    // Filename: wp-agentic-writer-costs-YYYY-MM-DD.csv
});

CSV Format

"Date/Time","Post","Model","Type","Input Tokens","Output Tokens","Cost"
"2026-01-26 10:05:23","My Article","google/gemini-2.5-flash","Chat","1234","567","$0.0012"

Files Modified/Created

Created

  1. /includes/class-admin-columns.php - CPT column handler

Modified

  1. /wp-agentic-writer.php - Initialize admin columns
  2. /includes/class-settings.php - Add Cost Log tab + shortcut
  3. /assets/css/admin.css - Add all cost tracking styles

Unchanged (Already Working)

  • /includes/class-cost-tracker.php - Cost tracking logic
  • /assets/js/settings.js - Tab switching (supports dynamic tabs)
  • Database table wp_wp_agentic_writer_costs - Already exists

Testing Checklist

CPT Column

  • Column appears in post list
  • Shows correct costs per post
  • Color coding works (green/yellow/red)
  • Sorting works (click column header)
  • Shows - for posts without AI usage

Cost Log Tab

  • Tab appears in settings navigation
  • Summary stats display correctly
  • All filters work (Post ID, Model, Type, Date Range)
  • Table displays cost records
  • Pagination works
  • Deleted posts show [Removed Post #123]
  • Post links work for existing posts
  • Export CSV downloads correctly

Cost Shortcuts

  • Link appears under budget progress bar
  • Clicking opens Cost Log tab
  • Hover effect works

Responsive Design

  • Table scrolls horizontally on mobile
  • Filters stack properly on small screens
  • Stats grid adjusts to screen size

Performance Considerations

Optimizations

  1. Pagination - Only loads 50 records at a time
  2. Indexed Queries - Uses post_id, created_at indexes
  3. Prepared Statements - All queries use $wpdb->prepare()
  4. Conditional Loading - Admin columns only load in admin
  5. CSS Minification - Production should minify admin.css

Database Impact

  • Minimal: Uses existing wp_wp_agentic_writer_costs table
  • No new tables created
  • Queries are optimized with WHERE clauses

Future Enhancements (Not Implemented)

Potential Additions

  1. Charts - Visual cost trends over time
  2. Budget Alerts - Email when approaching limit
  3. Cost Breakdown - Pie chart by model/type
  4. Bulk Actions - Delete old cost records
  5. API Endpoint - REST API for cost data
  6. Dashboard Widget - Cost summary on WP dashboard

Summary

Total Implementation Time: ~3 hours

Features Delivered:

  • ✅ CPT column with sorting and color coding
  • ✅ Global cost log with filters and pagination
  • ✅ Summary statistics (4 cards)
  • ✅ Cost shortcuts for quick access
  • ✅ Export CSV functionality
  • ✅ Deleted post handling
  • ✅ Responsive design
  • ✅ Full styling and UX polish

User Benefits:

  • Quick cost overview in post list
  • Detailed cost analysis in settings
  • Easy filtering and searching
  • Export for external analysis
  • Budget monitoring at a glance
  • ROI tracking per article

Ready for Production: Yes ✅