super-productivity/packages/plugin-dev/procrastination-buster
Johannes Millan 4d22a64955
Feat/plugin UI kit (#6362)
* fix(e2e): stabilize undo task delete sync test

Two flakiness sources fixed:
- Click on task element could activate title inline editor, causing
  Backspace to edit text instead of triggering delete. Now clicks the
  drag handle which calls focusSelf() without entering edit mode.
- Replaced deleteTask helper with inline sequence to avoid wasting
  2s of the 5s undo snackbar window on dialog-detection timeout.

* refactor: address code review findings from 2026-02-03

- Extract getBreakCycle helper to replace error-prone `cycle - 1 || 1`
  pattern at 3 call sites
- Add clarifying comment on intentionally broad 'timed out' match
- Reduce Pomodoro E2E test from 9 to 5 sessions (sufficient coverage)
- Remove dead _isTransientNetworkError wrapper from DropboxApi
- Extract stubWindowConfirm helper in task reducer tests

* fix(sync): prevent Formly from clearing provider config on show (#6345)

resetOnHide: true caused Formly to reset field values when provider
fieldGroups transitioned from hidden to visible, discarding user input
if sync was enabled before selecting a provider.

* fix(tasks): fix huge space between emoji and text in tag/project menus

Use matMenuItemIcon attribute on emoji spans so they project into the
icon slot of mat-menu-item instead of the text slot. Update emoji icon
sizing to 24x24px to match mat-icon and add overflow: hidden.

Closes #5977

* fix(tasks): guard against undefined task entities in selectors and archive (#6359)

Prevent TypeError crashes (reading 'dueWithTime', 'dueDay', 'issueProviderId') caused
by orphaned IDs in NgRx state. Fix archive merge to deduplicate IDs, filter orphans,
and use correct entity precedence (young over old). Add defensive null guards to
selectors and archive/task service methods.

* fix(tasks): guard against undefined task in mainListTasksInProject$ (#6360)

* fix(tasks): detect and sanitize orphaned task IDs to prevent startup crashes (#6359, #6360)

Orphaned task IDs (entries in task.ids without matching entities) caused
TypeError on app startup. Fix addresses three layers: validation now
flags orphaned IDs instead of silently skipping them, loadAllData
sanitizes IDs on load as a safety net, and data repair no longer crashes
when encountering orphaned IDs it's trying to fix.

* fix(sync): prevent recurring task duplication across clients

Remove SuperSync special-case that bypassed initial sync wait, causing
repeatable task effects to fire before sync completed. Add post-sync
cleanup effect that detects and removes stale duplicate repeat instances
when multiple active instances exist for the same repeat config.

* fix(sync): restore WebDAV provider compatibility warning text

* feat(sync): mark WebDAV and LocalFile sync options as experimental

* feat(plugins): add UI Kit with inject-first CSS strategy for iframe plugins

Introduce a lightweight CSS reset (UI Kit) that auto-styles basic HTML
elements in plugin iframes to match the host app theme. Injected after
<head> so plugin styles always win by source order.

UI Kit provides: element resets (body, headings, buttons, inputs, tables,
links, code, lists, hr), .btn-primary/.btn-outline button variants, and
.card/.card-clickable components.

All bundled plugins updated to use UI Kit classes, removing redundant
custom CSS (-542 lines net). Pico CSS removed from automations plugin.
sync-md converted from hardcoded colors to host theme variables.

* feat(plugins): extract shared CSS utilities into UI Kit

Move .text-muted, .text-primary, .page-fade and @keyframes fadeIn from
plugin CSS into the UI Kit so all iframe plugins get them automatically.
Add box-shadow focus ring to input:focus for better accessibility.
Remove per-plugin focus overrides now covered by the UI Kit.
2026-02-04 18:18:22 +01:00
..
i18n feat(plugins): add German translations to procrastination-buster 2026-01-16 22:34:50 +01:00
src Feat/plugin UI kit (#6362) 2026-02-04 18:18:22 +01:00
.gitignore feat(plugin-api): create foundational plugin API package 2025-06-27 18:13:19 +02:00
package-lock.json build(deps): bump the npm_and_yarn group across 4 directories with 1 update (#6141) 2026-01-25 10:48:01 +01:00
package.json build(deps): bump the npm_and_yarn group across 4 directories with 1 update (#6141) 2026-01-25 10:48:01 +01:00
plugin-message-example.md feat(plugin-api): create foundational plugin API package 2025-06-27 18:13:19 +02:00
README.md feat(plugin-api): create foundational plugin API package 2025-06-27 18:13:19 +02:00
tsconfig.json feat(plugin-api): create foundational plugin API package 2025-06-27 18:13:19 +02:00
vite.config.ts feat(plugins): improve on infrastructre for bundled plugins 2025-11-26 16:22:01 +01:00

Procrastination Buster Plugin

A Super Productivity plugin that helps identify procrastination blockers and provides tailored strategies to overcome them.

Features

  • 🎯 Identify 8 different procrastination types
  • 💡 Get tailored strategies for each type
  • ⏱️ Start Pomodoro timer directly from strategies
  • Add strategies as tasks
  • 🌓 Dark mode support using CSS variables

Installation

Development

# Install dependencies
npm install

# Start development server
npm run dev

# Build for production
npm run build

# Create plugin ZIP
npm run package

Use in Super Productivity

  1. Run npm run build
  2. Upload the generated dist/plugin.zip in Super Productivity
  3. Or copy the dist folder to src/assets/procrastination-buster/

Usage

  1. Shortcut: Use keyboard shortcut for quick access
  2. Side Panel: Open the plugin via the side panel
  3. Automatic: After 15 minutes of inactivity on a task

Procrastination Types

  1. Overwhelm - "Too much at once"
  2. Perfectionism - "It's not perfect enough"
  3. Unclear - "I don't know what to do"
  4. Boredom - "It's boring"
  5. Fear - "I might fail"
  6. Low Energy - "I'm too tired"
  7. Distraction - "Other things are more interesting"
  8. Resistance - "I don't want to do this"

Technology

  • SolidJS for reactive UI
  • Vite for fast development and builds
  • TypeScript for type safety
  • Super Productivity Plugin API
  • CSS Variables for theme integration

Development

The plugin consists of two parts:

  1. plugin.ts - Backend logic that communicates with Super Productivity
  2. SolidJS App - Frontend UI in iframe

Project Structure

procrastination-buster/
├── src/
│   ├── plugin.ts         # Plugin backend
│   ├── App.tsx          # Main component
│   ├── types.ts         # TypeScript definitions
│   ├── BlockerSelector.tsx
│   └── StrategyList.tsx
├── manifest.json        # Plugin metadata
├── index.html          # HTML entry
└── vite.config.ts      # Build configuration

Customization

Add New Strategies

Edit src/types.ts and add new strategies to the appropriate types.

Styling Customization

Edit src/App.css for visual adjustments. The plugin uses CSS variables for seamless theme integration:

  • --primary-color - Main theme color
  • --text-color - Primary text
  • --background-color - Background
  • --card-background - Card backgrounds
  • --border-radius - Standard radius
  • And many more...

License

MIT