feat(ui): add share options modal, modernize help drawer, and refine datepicker

[SotirisMouroutsos]

No description provided.

[isarantoglou]

Code Review for PR #1

Thanks for this PR! The new share options modal and UI modernization look great. However, there are some test failures that need to be addressed before this can be merged.

---

✅ What's Good

• Commit message follows Conventional Commits format correctly
• New features are well-implemented:
  • ShareOptionsModal.vue - Social sharing with Viber, WhatsApp, Telegram, Email
  • DatePicker.vue - Reusable datepicker with flatpickr and Greek locale
  • Tooltip.vue - Smart tooltip with positioning logic
  • HolidayTableModal.vue - Modal wrapper for holiday table
• UI improvements with better responsive design and mobile breakpoints
• Code quality follows Vue 3 Composition API patterns with proper TypeScript typing

---

❌ Test Failures

Unit Tests: 4 failures

Test File	Issue
HelpDrawer.test.ts	CSS class .help-drawer-close was renamed to .help-drawer-close-btn
HelpDrawer.test.ts	Footer button selector .help-drawer-footer .btn-primary no longer exists
SettingsCard.test.ts	Text "Σαββατοκύριακα" changed to "Σ/Κ" but test still expects the old label

E2E Tests: 15 failures

Test	Issue
Dark mode toggle tests	.dark-mode-toggle class was removed from the toggle button
Year selector tests	Multiple buttons now match getByRole('button', { name: '2026' }) due to new holiday calendar button
Accessibility tests	Missing .dark-mode-toggle selector

---

📋 Required Changes

1. Update src/components/HelpDrawer.test.ts:

   • Change selector .help-drawer-close → .help-drawer-close-btn
   • Fix the footer button selector to match new structure

2. Update src/components/SettingsCard.test.ts:

   • Line 274: Change 'Σαββατοκύριακα' → 'Σ/Κ'

3. Update E2E tests:

   • Either add dark-mode-toggle class back to the dark mode button in App.vue, OR update the E2E selectors
   • Make year button selectors more specific (e.g., use { exact: true } or a different locator strategy)

---

💡 Suggestions (Optional)

• Consider adding unit tests for the new components (ShareOptionsModal, DatePicker, Tooltip, HolidayTableModal)
• The PR description is empty - adding a summary would help reviewers understand the changes

---

Once the tests are fixed, this PR will be ready to merge! 🎉

[isarantoglou]

Re-Review After Updates

Thanks for addressing the test failures! Here's the current status:

---

✅ Unit Tests: All Passing

687 tests passed - Great work fixing:

• HelpDrawer.test.ts selectors
• SettingsCard.test.ts weekend label ("Σ/Κ")
• App.test.ts for new UI changes
• DatePicker component mocking

---

❌ E2E Tests: 12 Failures Remaining

81 passed, 12 failed (improved from 15 failures)

Test	Issue	Browsers Affected
year selector is visible and functional	Year button selector still ambiguous	All 3
year change updates opportunities	Timeout waiting for year carousel button	All 3
app works on mobile viewport	Year button selector ambiguous on mobile	All 3
can add manual custom holiday	Timeout	Firefox
can clear entire plan	Timeout	Firefox
dark mode persists across reload	Timeout	Firefox

Root Cause Analysis

The main issue is the year selector tests. The error shows:

strict mode violation: getByRole('button', { name: '2026' }) resolved to 2 elements

This happens because:

1. The year button in the carousel matches
2. The new "Πλήρες Ημερολόγιο Αργιών 2026" button also matches

Suggested Fix

In e2e/app.spec.ts and e2e/workflows.spec.ts, make the year selector more specific:

// Instead of:
const yearButton = page.getByRole('button', { name: '2026' })

// Use:
const yearButton = page.locator('.year-carousel').getByRole('button', { name: '2026', exact: true })

Or add a data-testid to the year buttons in the carousel for more reliable selection.

---

Commit Message ✅

The new commit follows Conventional Commits format:

test: fix all unit and E2E test failures from PR review

---

Summary

• Unit tests: ✅ All 687 passing
• E2E tests: ❌ 12 still failing (year selector ambiguity)
• Code quality: ✅ Good

Please fix the remaining E2E test selectors and this PR will be ready to merge!

[isarantoglou]

@claude