From c5d8a342965d8f9390897772d77e0a8aba52b6be Mon Sep 17 00:00:00 2001 From: David Keane Date: Tue, 26 May 2026 09:00:15 +0100 Subject: [PATCH] feat: Active/Completed tabs on My Log page (v3.4.0) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Replaces the two stacked sections (Active above, Completed below) on the main Logbook page with a single-pane WP-admin tabbed view using the native subsubsub pattern (same as Posts/Comments/Plugins). - Two tabs: Active (N) | Completed (M) with live counts - URL-driven state via ?tab=active|completed; bookmarkable, refresh-stable, back-button works, invalid values fall back to Active server-side via whitelist + sanitize_key - No JavaScript — each tab is a hyperlink built with add_query_arg - WP-admin core CSS handles .subsubsub + .current; only a small margin block added in wp-notes-styles.php - Single-pane render: only the selected tab's section is in the DOM, so no flash-of-wrong-content - "Add a Note" form stays visible on both tabs for UI consistency Flagged in the 2026-05-25 UX audit as the highest-payoff next move (Tier 3 item #7). When the v4 timer/time_logged field ships, the structure can extend to 3 tabs (TODO/IN PROGRESS/Completed) in the same place; without it, an IN PROGRESS tab would always be empty, so v3.4.0 ships the 2-tab version matching the current data model. Storage model unchanged — Active and Completed remain in their separate options (wp_notes, wp_done_notes). The wp_notes_display_notes($type) function is unchanged. MINOR bump: new feature, no breaking changes. --- CHANGELOG.md | 30 +++++++++++++++++++++++++ inc/wp-notes-styles.php | 8 +++++++ wp-notes.php | 49 ++++++++++++++++++++++++++++++++--------- 3 files changed, 77 insertions(+), 10 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index d4f1bb3..a2585e4 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,6 +9,36 @@ Format: [Keep a Changelog 1.1.0](https://keepachangelog.com/en/1.1.0/) — versi --- +## [3.4.0] — 2026-05-27 + +### Added — Active / Completed tabs on the My Log page + +The main Logbook page used to render two stacked sections — Active notes from `wp_notes` above, Completed notes from `wp_done_notes` below. As the lists grew, this became a "wall of stacked sections" with Completed pushing content off the visible fold and users having to scroll past it to scan their active work. + +v3.4.0 replaces the stacked layout with a **single-pane tabbed view** using WordPress's native `subsubsub` filter-tab pattern (the same one Posts / Comments / Plugins admin pages use): + +- **Two tabs**: `Active (N)` and `Completed (M)`. Counts in the labels match the actual list lengths. +- **URL-driven state**: `?page=wp-notes&tab=active` (default) and `?page=wp-notes&tab=completed`. Bookmarkable, refresh-stable, back-button works. Invalid tab values fall back to Active server-side. +- **No JavaScript**: each tab is a hyperlink. WP-admin core CSS handles the `.subsubsub` and `.current` styling; we just add a small top/bottom margin block. +- **Single-pane render**: only the selected tab's section is in the DOM, so no flash-of-wrong-content and no wasted markup. +- **"Add a Note" form stays visible on both tabs** — even from Completed you can think of something new to log. + +This was flagged in the 2026-05-25 UX audit as the highest-payoff next move (Tier 3 item #7). When the v4 roadmap's timer / `time_logged` field ships, the tab structure can extend naturally to three tabs (TODO / IN PROGRESS / Completed) in the same place; for now, without that field, an IN PROGRESS tab would always be empty, so v3.4.0 ships the 2-tab version that matches the current data model. + +### Files changed + +- `wp-notes.php` — `wp_notes_page_callback()`: tab detection from `$_GET['tab']` (sanitized + whitelisted), `subsubsub` markup with link-builder via `add_query_arg`, single-pane conditional render of either the active or completed section. Replaces the previous two-stacked-section block. +- `inc/wp-notes-styles.php` — minor spacing (`margin: 12px 0 18px`) on `.subsubsub` so the tab strip has breathing room. +- Plugin header `Version: 3.3.5 → 3.4.0`; `WP_NOTES_VERSION` constant updated to match. MINOR bump (new feature, no breaking changes). + +### Not changed + +- Storage model — Active and Completed remain in their separate options (`wp_notes`, `wp_done_notes`). +- The `wp_notes_display_notes($type)` function in `inc/wp-notes-display.php` — already accepts the section type, no signature change needed. +- No new DB writes, schema changes, AJAX endpoints, or dependencies. + +--- + ## [3.3.5] — 2026-05-25 ### Changed — Admin-menu icon diff --git a/inc/wp-notes-styles.php b/inc/wp-notes-styles.php index 04564cf..211b58d 100644 --- a/inc/wp-notes-styles.php +++ b/inc/wp-notes-styles.php @@ -198,6 +198,14 @@ function wp_notes_admin_styles() { color: #3c763d; } + /* v3.4.0 — Active/Completed tab strip on the My Log page. + WP-admin core already styles .subsubsub and .current; + we only need to add breathing room above + below. */ + .wp-notes-page .subsubsub, + .wrap > .subsubsub { + margin: 12px 0 18px; + } + /* Responsive Design */ @media screen and (max-width: 782px) { .wp-notes-formatting { diff --git a/wp-notes.php b/wp-notes.php index a490243..4a15ebc 100644 --- a/wp-notes.php +++ b/wp-notes.php @@ -5,7 +5,7 @@ * Plugin Name: Logbook * Plugin URI: https://icanhelp.ie/wp-notes * Description: A lightweight task & logbook plugin for WordPress. Log your daily work, mark tasks done, and keep a tidy record inside the dashboard. Perfect for freelancers showing clients what's been delivered and students proving work to teachers. - * Version: 3.3.5 + * Version: 3.4.0 * Requires at least: 5.0 * Requires PHP: 7.2 * Author: IR240474 @@ -33,7 +33,7 @@ if (!isset($wp_notes_init)) { $wp_notes_init = true; // Plugin Constants - if (!defined('WP_NOTES_VERSION')) define('WP_NOTES_VERSION', '3.3.5'); + if (!defined('WP_NOTES_VERSION')) define('WP_NOTES_VERSION', '3.4.0'); if (!defined('WP_NOTES_FILE')) define('WP_NOTES_FILE', __FILE__); if (!defined('WP_NOTES_PATH')) define('WP_NOTES_PATH', plugin_dir_path(__FILE__)); if (!defined('WP_NOTES_URL')) define('WP_NOTES_URL', plugin_dir_url(__FILE__)); @@ -832,6 +832,14 @@ function wp_notes_page_callback() { $total_notes = count($notes); $total_done = count($done_notes); + // v3.4.0 — which tab is selected? Default 'active'. Whitelist-only. + $current_tab = isset($_GET['tab']) ? sanitize_key(wp_unslash($_GET['tab'])) : 'active'; + if (!in_array($current_tab, array('active', 'completed'), true)) { + $current_tab = 'active'; + } + $active_tab_url = esc_url(add_query_arg(array('page' => 'wp-notes', 'tab' => 'active'), admin_url('admin.php'))); + $completed_tab_url = esc_url(add_query_arg(array('page' => 'wp-notes', 'tab' => 'completed'), admin_url('admin.php'))); + // Get user settings $settings = get_option('wp_notes_settings', array( 'default_font' => 'Arial', @@ -1005,15 +1013,36 @@ function wp_notes_page_callback() {

Log entries

- -
- -
- -
- -
+ + +
+ + +
+ +
+ +
+ +
+