2 Commits

Author SHA1 Message Date
ranger c5d8a34296 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.
2026-05-26 09:00:15 +01:00
ranger bd8c5f2340 ux: replace generic cog admin-menu icon with closed-book (v3.3.5)
The WordPress admin sidebar showed "Logbook" with the generic
cog wheel icon (dashicons-admin-generic) — fine for a settings
page, off-brand for a plugin whose entire identity is "logbook".

Swapped to dashicons-book-alt (closed book) — the most literal
possible match in the Dashicons set, and visually reinforces the
brand at the first place users see the plugin every day.

Alternatives also viable (commented in the changelog for future
reference): dashicons-edit (pencil), dashicons-clipboard,
dashicons-welcome-write-blog, dashicons-format-aside.

VERSION
- wp-notes.php header 3.3.4 → 3.3.5
- WP_NOTES_VERSION constant 3.3.4 → 3.3.5
- About page version-history leads with v3.3.5; v3.3.4 demoted.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-25 10:09:49 +01:00
4 changed files with 108 additions and 12 deletions
+55
View File
@@ -9,6 +9,61 @@ 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
The WordPress admin sidebar icon for Logbook is now
**`dashicons-book-alt`** (a closed book) instead of the generic
cog wheel (`dashicons-admin-generic`). The closed-book glyph is the
most literal possible match for the word "logbook" in the Dashicons
set — reinforces the brand identity at the first place users see
the plugin every day.
If you'd prefer a different icon, the line lives in
`wp-notes.php → wp_notes_admin_menu()` as the 7th arg to
`add_menu_page()`. Alternatives worth considering:
`dashicons-edit` (pencil), `dashicons-clipboard` (clipboard),
`dashicons-welcome-write-blog` (pencil over paper),
`dashicons-format-aside` (notes glyph). Full list at
https://developer.wordpress.org/resource/dashicons/
### Version bump
- wp-notes.php header 3.3.4 → 3.3.5
- WP_NOTES_VERSION constant 3.3.4 → 3.3.5
- About page version-history leads with v3.3.5; v3.3.4 demoted.
---
## [3.3.4] — 2026-05-25 ## [3.3.4] — 2026-05-25
**Repo renamed on Gitea: `a-wp-notes-v3` → `a-logbook`.** Also the **Repo renamed on Gitea: `a-wp-notes-v3` → `a-logbook`.** Also the
+5 -1
View File
@@ -125,7 +125,11 @@ function wp_notes_about_page() {
<h2>Version history</h2> <h2>Version history</h2>
<ul> <ul>
<li> <li>
<span class="ver">v3.3.4</span> &mdash; 25 May 2026 <span class="latest">latest</span><br> <span class="ver">v3.3.5</span> &mdash; 25 May 2026 <span class="latest">latest</span><br>
New admin-menu icon: closed-book (<code>dashicons-book-alt</code>) replaces the generic cog wheel. Visually reinforces the &ldquo;Logbook&rdquo; identity in the WP sidebar.
</li>
<li>
<span class="ver">v3.3.4</span> &mdash; 25 May 2026<br>
Repo renamed on Gitea: <code>a-wp-notes-v3</code> &rarr; <code>a-logbook</code>. The plugin&rsquo;s update checker and the &ldquo;View on Gitea&rdquo; / &ldquo;View all releases&rdquo; / &ldquo;View full CHANGELOG&rdquo; links now point at the new path. Local folder also renamed to <code>a-logbook</code>. The plugin&rsquo;s internal storage and slugs are unchanged &mdash; no data migration. Repo renamed on Gitea: <code>a-wp-notes-v3</code> &rarr; <code>a-logbook</code>. The plugin&rsquo;s update checker and the &ldquo;View on Gitea&rdquo; / &ldquo;View all releases&rdquo; / &ldquo;View full CHANGELOG&rdquo; links now point at the new path. Local folder also renamed to <code>a-logbook</code>. The plugin&rsquo;s internal storage and slugs are unchanged &mdash; no data migration.
</li> </li>
<li> <li>
+8
View File
@@ -198,6 +198,14 @@ function wp_notes_admin_styles() {
color: #3c763d; 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 */ /* Responsive Design */
@media screen and (max-width: 782px) { @media screen and (max-width: 782px) {
.wp-notes-formatting { .wp-notes-formatting {
+40 -11
View File
@@ -5,7 +5,7 @@
* Plugin Name: Logbook * Plugin Name: Logbook
* Plugin URI: https://icanhelp.ie/wp-notes * Plugin URI: https://icanhelp.ie/wp-notes
* Description: A lightweight task &amp; 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. * Description: A lightweight task &amp; 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.4 * Version: 3.4.0
* Requires at least: 5.0 * Requires at least: 5.0
* Requires PHP: 7.2 * Requires PHP: 7.2
* Author: IR240474 * Author: IR240474
@@ -33,7 +33,7 @@ if (!isset($wp_notes_init)) {
$wp_notes_init = true; $wp_notes_init = true;
// Plugin Constants // Plugin Constants
if (!defined('WP_NOTES_VERSION')) define('WP_NOTES_VERSION', '3.3.4'); 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_FILE')) define('WP_NOTES_FILE', __FILE__);
if (!defined('WP_NOTES_PATH')) define('WP_NOTES_PATH', plugin_dir_path(__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__)); if (!defined('WP_NOTES_URL')) define('WP_NOTES_URL', plugin_dir_url(__FILE__));
@@ -174,7 +174,7 @@ function wp_notes_admin_menu() {
'manage_options', 'manage_options',
'wp-notes', 'wp-notes',
'wp_notes_page_callback', 'wp_notes_page_callback',
'dashicons-admin-generic', 'dashicons-book-alt', // closed book — reinforces the "logbook" identity
3 3
); );
@@ -832,6 +832,14 @@ function wp_notes_page_callback() {
$total_notes = count($notes); $total_notes = count($notes);
$total_done = count($done_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 // Get user settings
$settings = get_option('wp_notes_settings', array( $settings = get_option('wp_notes_settings', array(
'default_font' => 'Arial', 'default_font' => 'Arial',
@@ -1005,15 +1013,36 @@ function wp_notes_page_callback() {
<!-- Notes List --> <!-- Notes List -->
<h2>Log entries</h2> <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 --> <!-- v3.4.0 — WP-native subsubsub tab strip. Single-pane: only the
<div class="wp-notes-completed" id="completed-notes"> selected tab's section is rendered below. URL-driven state
<?php wp_notes_display_notes('completed'); ?> (?tab=active|completed) so it's bookmarkable + refresh-stable.
</div> 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) --> <!-- Footer: support link (lives at the BOTTOM, not the top) -->
<p class="wp-notes-footer-support"> <p class="wp-notes-footer-support">