Complete Pinia store architecture implementation with tests and fixes#52
Merged
Conversation
Establish a comprehensive Pinia store architecture with best practices and documentation: - Created docs/pinia-store-architecture.md with complete store patterns and guidelines - Created docs/naming-conventions.md with store naming standards and conventions - Created docs/store-examples-migration.md with practical examples and Vuex migration guide - Added src/store/types.ts with TypeScript type definitions for store state - Added src/store/utilities.ts with factory functions for consistent store patterns - Updated src/store/app.ts to use new types and improve documentation - Updated README.md with store architecture section and documentation links Key improvements: - Established clear naming conventions for state (camelCase), getters (get prefix), actions (verb prefix) - Documented module separation strategy for future growth - Provided factory functions for common store patterns (setters, toggles, increments, etc) - Added comprehensive examples for component integration - Created migration guide from Vuex to Pinia - Included persistence patterns and async action examples - Full type safety with TypeScript interfaces All acceptance criteria met: ✓ Pinia store architecture document created with best practices ✓ Store structure follows Vue 3 Composition API patterns ✓ Naming conventions established for getters, actions, state ✓ Module separation strategy defined ✓ TypeScript types for store state created ✓ Store documentation added to codebase ✓ Code passes linting and builds successfully This establishes a solid foundation for state management and future Pinia migrations.
Implement comprehensive test suite for the migrated Pinia store covering: - All state properties initialization and values - Getter computations (getSentencesCount) - Error count actions (set, increase) - Words count management - Menu state toggling and setting - Sentences array management - Sentence position tracking - Font selection and font size adjustments - Capital letters toggle - Typing input state management - Text content updates (source, article, final text) - Dark mode toggle with localStorage persistence - System preference detection fallback - Store instance isolation and singleton pattern Fixes #40 - Migrate appState from Vuex composition to Pinia
Removes unused legacy helper functions (mutationFactory, mapAppState, mapAppGetters, mapAppMutations) from helpers.ts since all components have been successfully migrated to Pinia. Keeps only the active updateSelectedFont() function and updates its tests to verify font styling functionality. This completes the Vuex to Pinia migration by cleaning up all deprecated code references.
* ci/cd: configure github actions linting workflow and branch protection Implement automated linting pipeline (Issue #31): Phase 1: Create GitHub Actions Workflow - Create .github/workflows/lint.yml workflow file - Configure workflow to trigger on PR and push to master - Set up BUN and Node.js environment - Run ESLint linting checks - Generate workflow status checks Phase 2: Configure Workflow Details - Implement caching for BUN modules (~bun/install/cache) - Implement caching for node_modules - Use frozen lockfile for deterministic builds - Set 10-minute timeout for workflow - Configure artifact upload for lint results - Set Node.js 20.x for best compatibility Phase 3: Configure Branch Protection - Require ESLint Code Quality Check to pass before merge - Require 1+ code review approval - Dismiss stale pull request reviews - Block force pushes and branch deletions - Enforce rules for all users including admins Phase 4: Documentation & Badge - Add workflow status badge to README - Create comprehensive CI/CD Pipeline section in README - Document workflow triggers, steps, and performance - Add branch protection rules documentation - Include PR workflow and troubleshooting guide - Update AGENTS.md with CI/CD workflow information - Update Table of Contents with CI/CD link Features: - Average execution time: < 2 minutes - Smart caching minimizes reinstalls - Deterministic builds with frozen lockfile - Clear developer workflow guidelines - Prevents low-quality code from merging * tools: add create-pr-from-issue.sh tool for automated PR creation Add new tool to create pull requests directly from GitHub issues: Features: - Automatically fetch issue details from GitHub - Generate branch name from issue title (customizable) - Create new branch from specified base branch (default: master) - Auto-generate PR title and description from issue - Support for draft PRs - Option to auto-link issue with 'Closes #XXX' - Custom branch naming with --auto-format - Use current branch with --no-branch flag - Comprehensive documentation and examples The tool streamlines the workflow from issue → branch → PR: 1. Fetches issue details 2. Generates branch name (default: type/issue-NUMBER-title) 3. Creates branch from base branch 4. Generates PR description template from issue body 5. Pushes branch to remote 6. Creates pull request on GitHub Options: - --issue <NUMBER>: Issue number (required) - --branch <NAME>: Custom branch name - --title <TITLE>: Custom PR title - --base <BRANCH>: Base branch to merge into (default: master) - --draft: Create as draft PR - --auto-format: Auto-format branch name (kebab-case) - --link-issue: Include 'Closes #issue' in description - --no-branch: Use current branch instead of creating new one Documentation: - Updated tools/README.md with comprehensive documentation - Added Workflow 6: Create Pull Request from Issue - Included examples and sample output - Updated Quick Reference table - Added to PATH symlink suggestions * tools: enhance create-issue.sh to auto-fill template fields with provided data Add intelligent template field options to fill templates with provided information: New Options: - Template field options automatically populate template sections - Support for all template types: scrum, feature, bug, refactor Scrum Template Fields: - --person <ROLE>: User story persona (default: role/persona) - --action <ACTION>: Desired action (default: action/feature) - --benefit <BENEFIT>: Expected benefit (default: benefit/value) - --story-points <POINTS>: Story points (filled in template) Feature Template Fields: - --description <TEXT>: Feature description - --behavior <TEXT>: Expected behavior - --criteria <TEXT>: Acceptance criteria (comma-separated → checklist) Bug Template Fields: - --description <TEXT>: Bug description - --steps <TEXT>: Reproduction steps (comma-separated → numbered list) - --behavior <TEXT>: Expected behavior - --actual <TEXT>: Actual behavior - --environment <TEXT>: Environment info - --context <TEXT>: Additional context Refactor Template Fields: - --current-state <TEXT>: Current implementation - --proposed <TEXT>: Proposed changes - --benefits <TEXT>: Benefits (comma-separated → bullet list) - --plan <TEXT>: Implementation plan (comma-separated → numbered list) - --strategy <TEXT>: Testing strategy Improvements: - All template data fields now have defaults - Comma-separated values automatically formatted into lists - Better documentation with examples - Uses heredoc for cleaner template generation Usage Examples: ./create-issue.sh -t "Add timer feature" --template scrum --story-points 8 \ --person "user" --action "see typing speed" --benefit "track progress" ./create-issue.sh -t "Login broken" --template bug --priority CRITICAL \ --description "Button not responding" \ --steps "1. Go to login,2. Click button,3. Nothing happens" \ --behavior "Navigate to dashboard" --actual "Page freezes" ./create-issue.sh -t "Dark mode" --template feature \ --description "Add dark theme" \ --criteria "Toggle in settings,Persist on reload,Support all components" Benefits: - Faster issue creation with pre-filled templates - Reduced manual data entry - Consistent format for acceptance criteria and lists - Better structured issue documentation * ci/cd: simplify lint workflow and fix status check recognition Remove unnecessary 'lint-success' job that was causing status check delays. Issue: - The secondary 'lint-success' job was not being properly recognized by GitHub - Status checks were stuck in 'Waiting for status to be reported' state - This prevented PRs from being merged even when linting passed Solution: - Simplified workflow to single 'lint' job - Job name now matches GitHub branch protection requirement exactly - Status check: 'ESLint Code Quality Check (20.x)' (includes matrix context) - Workflow runs faster with fewer jobs - Status checks now report immediately after completion Branch Protection Updated: - Changed required context to 'ESLint Code Quality Check (20.x)' - Properly recognized by GitHub Actions - PRs can now merge after passing linting --------- Co-authored-by: Eliape, Isaac <IEliape@unum.com>
* ci/cd: configure github actions linting workflow and branch protection Implement automated linting pipeline (Issue #31): Phase 1: Create GitHub Actions Workflow - Create .github/workflows/lint.yml workflow file - Configure workflow to trigger on PR and push to master - Set up BUN and Node.js environment - Run ESLint linting checks - Generate workflow status checks Phase 2: Configure Workflow Details - Implement caching for BUN modules (~bun/install/cache) - Implement caching for node_modules - Use frozen lockfile for deterministic builds - Set 10-minute timeout for workflow - Configure artifact upload for lint results - Set Node.js 20.x for best compatibility Phase 3: Configure Branch Protection - Require ESLint Code Quality Check to pass before merge - Require 1+ code review approval - Dismiss stale pull request reviews - Block force pushes and branch deletions - Enforce rules for all users including admins Phase 4: Documentation & Badge - Add workflow status badge to README - Create comprehensive CI/CD Pipeline section in README - Document workflow triggers, steps, and performance - Add branch protection rules documentation - Include PR workflow and troubleshooting guide - Update AGENTS.md with CI/CD workflow information - Update Table of Contents with CI/CD link Features: - Average execution time: < 2 minutes - Smart caching minimizes reinstalls - Deterministic builds with frozen lockfile - Clear developer workflow guidelines - Prevents low-quality code from merging * tools: add create-pr-from-issue.sh tool for automated PR creation Add new tool to create pull requests directly from GitHub issues: Features: - Automatically fetch issue details from GitHub - Generate branch name from issue title (customizable) - Create new branch from specified base branch (default: master) - Auto-generate PR title and description from issue - Support for draft PRs - Option to auto-link issue with 'Closes #XXX' - Custom branch naming with --auto-format - Use current branch with --no-branch flag - Comprehensive documentation and examples The tool streamlines the workflow from issue → branch → PR: 1. Fetches issue details 2. Generates branch name (default: type/issue-NUMBER-title) 3. Creates branch from base branch 4. Generates PR description template from issue body 5. Pushes branch to remote 6. Creates pull request on GitHub Options: - --issue <NUMBER>: Issue number (required) - --branch <NAME>: Custom branch name - --title <TITLE>: Custom PR title - --base <BRANCH>: Base branch to merge into (default: master) - --draft: Create as draft PR - --auto-format: Auto-format branch name (kebab-case) - --link-issue: Include 'Closes #issue' in description - --no-branch: Use current branch instead of creating new one Documentation: - Updated tools/README.md with comprehensive documentation - Added Workflow 6: Create Pull Request from Issue - Included examples and sample output - Updated Quick Reference table - Added to PATH symlink suggestions --------- Co-authored-by: Eliape, Isaac <IEliape@unum.com>
* ci/cd: configure github actions linting workflow and branch protection Implement automated linting pipeline (Issue #31): Phase 1: Create GitHub Actions Workflow - Create .github/workflows/lint.yml workflow file - Configure workflow to trigger on PR and push to master - Set up BUN and Node.js environment - Run ESLint linting checks - Generate workflow status checks Phase 2: Configure Workflow Details - Implement caching for BUN modules (~bun/install/cache) - Implement caching for node_modules - Use frozen lockfile for deterministic builds - Set 10-minute timeout for workflow - Configure artifact upload for lint results - Set Node.js 20.x for best compatibility Phase 3: Configure Branch Protection - Require ESLint Code Quality Check to pass before merge - Require 1+ code review approval - Dismiss stale pull request reviews - Block force pushes and branch deletions - Enforce rules for all users including admins Phase 4: Documentation & Badge - Add workflow status badge to README - Create comprehensive CI/CD Pipeline section in README - Document workflow triggers, steps, and performance - Add branch protection rules documentation - Include PR workflow and troubleshooting guide - Update AGENTS.md with CI/CD workflow information - Update Table of Contents with CI/CD link Features: - Average execution time: < 2 minutes - Smart caching minimizes reinstalls - Deterministic builds with frozen lockfile - Clear developer workflow guidelines - Prevents low-quality code from merging * tools: add create-pr-from-issue.sh tool for automated PR creation Add new tool to create pull requests directly from GitHub issues: Features: - Automatically fetch issue details from GitHub - Generate branch name from issue title (customizable) - Create new branch from specified base branch (default: master) - Auto-generate PR title and description from issue - Support for draft PRs - Option to auto-link issue with 'Closes #XXX' - Custom branch naming with --auto-format - Use current branch with --no-branch flag - Comprehensive documentation and examples The tool streamlines the workflow from issue → branch → PR: 1. Fetches issue details 2. Generates branch name (default: type/issue-NUMBER-title) 3. Creates branch from base branch 4. Generates PR description template from issue body 5. Pushes branch to remote 6. Creates pull request on GitHub Options: - --issue <NUMBER>: Issue number (required) - --branch <NAME>: Custom branch name - --title <TITLE>: Custom PR title - --base <BRANCH>: Base branch to merge into (default: master) - --draft: Create as draft PR - --auto-format: Auto-format branch name (kebab-case) - --link-issue: Include 'Closes #issue' in description - --no-branch: Use current branch instead of creating new one Documentation: - Updated tools/README.md with comprehensive documentation - Added Workflow 6: Create Pull Request from Issue - Included examples and sample output - Updated Quick Reference table - Added to PATH symlink suggestions * tools: enhance create-issue.sh to auto-fill template fields with provided data Add intelligent template field options to fill templates with provided information: New Options: - Template field options automatically populate template sections - Support for all template types: scrum, feature, bug, refactor Scrum Template Fields: - --person <ROLE>: User story persona (default: role/persona) - --action <ACTION>: Desired action (default: action/feature) - --benefit <BENEFIT>: Expected benefit (default: benefit/value) - --story-points <POINTS>: Story points (filled in template) Feature Template Fields: - --description <TEXT>: Feature description - --behavior <TEXT>: Expected behavior - --criteria <TEXT>: Acceptance criteria (comma-separated → checklist) Bug Template Fields: - --description <TEXT>: Bug description - --steps <TEXT>: Reproduction steps (comma-separated → numbered list) - --behavior <TEXT>: Expected behavior - --actual <TEXT>: Actual behavior - --environment <TEXT>: Environment info - --context <TEXT>: Additional context Refactor Template Fields: - --current-state <TEXT>: Current implementation - --proposed <TEXT>: Proposed changes - --benefits <TEXT>: Benefits (comma-separated → bullet list) - --plan <TEXT>: Implementation plan (comma-separated → numbered list) - --strategy <TEXT>: Testing strategy Improvements: - All template data fields now have defaults - Comma-separated values automatically formatted into lists - Better documentation with examples - Uses heredoc for cleaner template generation Usage Examples: # Scrum with filled data ./create-issue.sh -t "Add timer feature" --template scrum --story-points 8 \ --person "user" --action "see typing speed" --benefit "track progress" # Bug with filled data ./create-issue.sh -t "Login broken" --template bug --priority CRITICAL \ --description "Button not responding" \ --steps "1. Go to login,2. Click button,3. Nothing happens" \ --behavior "Navigate to dashboard" --actual "Page freezes" # Feature with criteria ./create-issue.sh -t "Dark mode" --template feature \ --description "Add dark theme" \ --criteria "Toggle in settings,Persist on reload,Support all components" Benefits: - Faster issue creation with pre-filled templates - Reduced manual data entry - Consistent format for acceptance criteria and lists - Better structured issue documentation --------- Co-authored-by: Eliape, Isaac <IEliape@unum.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Changes
<thead>and<tbody>elementsFiles Changed
src/store/app.ts- Pinia store implementationsrc/__tests__/store.test.ts- New store unit tests (321 lines)src/__tests__/TextRenderer.spec.ts- New component tests (428 lines)src/components/TextRenderer.vue- Formatting and style fixessrc/components/Menu.vue- HTML table structure fixessrc/components/InfoPanel.vue- HTML table structure fixesSTORE_USAGE_ANALYSIS.md- Store architecture documentation