feat: Active/Completed tabs on My Log page (v3.4.0)

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.
This commit is contained in:
2026-05-26 09:00:15 +01:00
parent bd8c5f2340
commit c5d8a34296
3 changed files with 77 additions and 10 deletions
+39 -10
View File
@@ -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() {
<!-- Notes List -->
<h2>Log entries</h2>
<!-- Active Notes List -->
<div class="wp-notes-active" id="active-notes">
<?php wp_notes_display_notes('active'); ?>
</div>
<!-- Completed Notes List -->
<div class="wp-notes-completed" id="completed-notes">
<?php wp_notes_display_notes('completed'); ?>
</div>
<!-- v3.4.0 — WP-native subsubsub tab strip. Single-pane: only the
selected tab's section is rendered below. URL-driven state
(?tab=active|completed) so it's bookmarkable + refresh-stable.
WP-admin core supplies .subsubsub and .current styling. -->
<ul class="subsubsub">
<li>
<a href="<?php echo $active_tab_url; ?>"<?php echo $current_tab === 'active' ? ' class="current"' : ''; ?>>
<?php esc_html_e('Active', 'a-wp-notes'); ?>
<span class="count">(<?php echo (int) $total_notes; ?>)</span>
</a> |
</li>
<li>
<a href="<?php echo $completed_tab_url; ?>"<?php echo $current_tab === 'completed' ? ' class="current"' : ''; ?>>
<?php esc_html_e('Completed', 'a-wp-notes'); ?>
<span class="count">(<?php echo (int) $total_done; ?>)</span>
</a>
</li>
</ul>
<div style="clear:both;"></div>
<?php if ($current_tab === 'active') : ?>
<div class="wp-notes-active" id="active-notes">
<?php wp_notes_display_notes('active'); ?>
</div>
<?php else : ?>
<div class="wp-notes-completed" id="completed-notes">
<?php wp_notes_display_notes('completed'); ?>
</div>
<?php endif; ?>
<!-- Footer: support link (lives at the BOTTOM, not the top) -->
<p class="wp-notes-footer-support">