feat: migrate all clipboard operations from useClipboard to ClipboardService

- Replace useClipboard with platform-agnostic ClipboardService across 13 files
- Add proper error handling with user notifications for all clipboard operations
- Fix naming conflicts between method names and imported function names
- Ensure consistent async/await patterns throughout the codebase
- Add notification system to HelpView.vue for user feedback on clipboard errors
- Remove unnecessary wrapper methods for cleaner code

Files migrated:
- View components: UserProfileView, QuickActionBvcEndView, ProjectViewView,
  InviteOneView, SeedBackupView, HelpView, AccountViewView, DatabaseMigration,
  ConfirmGiftView, ClaimView, OnboardMeetingSetupView
- Utility functions: libs/util.ts (doCopyTwoSecRedo)
- Components: HiddenDidDialog

Naming conflicts resolved:
- DatabaseMigration: copyToClipboard() → copyExportedDataToClipboard()
- ShareMyContactInfoView: copyToClipboard() → copyContactMessageToClipboard() → removed
- HiddenDidDialog: copyToClipboard() → copyTextToClipboard()
- ClaimView: copyToClipboard() → copyTextToClipboard()
- ConfirmGiftView: copyToClipboard() → copyTextToClipboard()

This migration ensures reliable clipboard functionality across iOS, Android,
and web platforms with proper error handling and user feedback.

Closes: Platform-specific clipboard issues on mobile devices

.cursor/rules/README.md

@@ -104,6 +104,161 @@ High-level meta-rules that bundle related sub-rules for specific workflows.
 - **`meta_bug_diagnosis.mdc`** - Bug investigation workflow bundling
 - **`meta_bug_fixing.mdc`** - Bug fix implementation workflow bundling
 - **`meta_feature_implementation.mdc`** - Feature implementation workflow bundling
+- **`meta_research.mdc`** - Investigation and research workflow bundling
+
+### **Workflow State Management**
+
+The project uses a sophisticated workflow state management system to ensure systematic development processes and maintain code quality across all phases of development.
+
+#### **Workflow State System**
+
+The workflow state is managed through `.cursor/rules/.workflow_state.json` and enforces different modes with specific constraints. The system automatically tracks workflow progression and maintains a complete history of mode transitions.
+
+**Available Modes**:
+- **`diagnosis`** - Investigation and analysis phase (read-only)
+- **`fixing`** - Implementation and bug fixing phase (full access)
+- **`planning`** - Design and architecture phase (design only)
+- **`research`** - Investigation and research phase (investigation only)
+- **`documentation`** - Documentation writing phase (writing only)
+
+**Mode Constraints**:
+```json
+{
+  "diagnosis": {
+    "mode": "read_only",
+    "forbidden": ["modify", "create", "build", "commit"],
+    "allowed": ["read", "search", "analyze", "document"]
+  },
+  "fixing": {
+    "mode": "implementation",
+    "forbidden": [],
+    "allowed": ["modify", "create", "build", "commit", "test"]
+  }
+}
+```
+
+**Workflow History Tracking**:
+
+The system automatically maintains a `workflowHistory` array that records all mode transitions and meta-rule invocations:
+
+```json
+{
+  "workflowHistory": [
+    {
+      "mode": "research",
+      "invoked": "meta_core_always_on.mdc",
+      "timestamp": "2025-08-25T02:14:37Z"
+    },
+    {
+      "mode": "diagnosis",
+      "invoked": "meta_bug_diagnosis.mdc", 
+      "timestamp": "2025-08-25T02:14:37Z"
+    }
+  ]
+}
+```
+
+**History Entry Format**:
+- **`mode`**: The workflow mode that was activated
+- **`invoked`**: The specific meta-rule that triggered the mode change
+- **`timestamp`**: UTC timestamp when the mode transition occurred
+
+**History Purpose**:
+- **Workflow Continuity**: Track progression through development phases
+- **Meta-Rule Usage**: Monitor which rules are invoked and when
+- **Temporal Context**: Maintain chronological order of workflow changes
+- **State Persistence**: Preserve workflow history across development sessions
+- **Debugging Support**: Help diagnose workflow state issues
+- **Process Analysis**: Understand development patterns and meta-rule effectiveness
+
+#### **Commit Override System**
+
+The workflow includes a flexible commit override mechanism that allows commits on demand while maintaining workflow integrity:
+
+```json
+{
+  "overrides": {
+    "commit": {
+      "allowed": true,
+      "requires_override": true,
+      "override_reason": "user_requested"
+    }
+  }
+}
+```
+
+**Override Benefits**:
+- ✅ **Investigation Commits**: Document findings during diagnosis phases
+- ✅ **Work-in-Progress**: Commit partial solutions during complex investigations
+- ✅ **Emergency Fixes**: Commit critical fixes without mode transitions
+- ✅ **Flexible Workflow**: Maintain systematic approach while accommodating real needs
+
+**Override Limitations**:
+- ❌ **Does NOT bypass**: Version control rules, commit message standards, or security requirements
+- ❌ **Does NOT bypass**: Code quality standards, testing requirements, or documentation requirements
+
+#### **Workflow Enforcement**
+
+The system automatically enforces workflow constraints through the core always-on rules:
+
+**Before Every Interaction**:
+1. **Read current workflow state** from `.cursor/rules/.workflow_state.json`
+2. **Identify current mode** and its constraints
+3. **Validate user request** against current mode constraints
+4. **Enforce constraints** before generating response
+5. **Guide model behavior** based on current mode
+
+**Mode-Specific Enforcement**:
+- **Diagnosis Mode**: Blocks modification, creation, building, and commits
+- **Fixing Mode**: Allows full implementation and testing capabilities
+- **Planning Mode**: Focuses on design and architecture, blocks implementation
+- **Research Mode**: Enables investigation and analysis, blocks modification
+- **Documentation Mode**: Allows writing and editing, blocks implementation
+
+#### **Workflow Transitions**
+
+To change workflow modes, invoke the appropriate meta-rule:
+
+```bash
+# Switch to bug fixing mode
+@meta_bug_fixing.mdc
+
+# Switch to feature planning mode  
+@meta_feature_planning.mdc
+
+# Switch to documentation mode
+@meta_documentation.mdc
+```
+
+**Transition Requirements**:
+- **Mode Changes**: Require explicit meta-rule invocation
+- **State Updates**: Automatically update workflow state file
+- **Constraint Enforcement**: Immediately apply new mode constraints
+- **History Tracking**: Automatically maintained in `workflowHistory` array
+- **Timestamp Recording**: Each transition recorded with UTC timestamp
+
+#### **Integration with Development Process**
+
+The workflow system integrates seamlessly with existing development practices:
+
+**Version Control**:
+- All commits must follow TimeSafari commit message standards
+- Security audit checklists are enforced regardless of workflow mode
+- Documentation updates are required for substantial changes
+
+**Quality Assurance**:
+- Code quality standards (PEP8, TypeScript, etc.) are always enforced
+- Testing requirements apply to all implementation work
+- Documentation standards are maintained across all phases
+
+**Build System**:
+- Build Architecture Guard protects critical build files
+- Platform-specific build processes respect workflow constraints
+- Asset generation follows established patterns
+
+**Migration Context**:
+- Database migration work respects investigation vs. implementation phases
+- Component migration progress is tracked through workflow states
 
 ## Usage Guidelines
 

.cursor/rules/always_on_rules.mdc

@@ -0,0 +1,192 @@
+# Meta-Rule: Core Always-On Rules
+
+**Author**: Matthew Raymer
+**Date**: 2025-08-21
+**Status**: 🎯 **ACTIVE** - Core rules for every prompt
+
+## Purpose
+
+This meta-rule bundles the core rules that should be applied to **every single
+prompt** because they define fundamental behaviors, principles, and context
+that are essential for all AI interactions.
+
+## When to Use
+
+**ALWAYS** - These rules apply to every single prompt, regardless of the task
+or context. They form the foundation for all AI assistant behavior.
+
+## Bundled Rules
+
+### **Core Human Competence Principles**
+
+- **`core/base_context.mdc`** - Human competence first principles, interaction
+  guidelines, and output contract requirements
+- **`core/less_complex.mdc`** - Minimalist solution principle and complexity
+  guidelines
+
+### **Time & Context Standards**
+
+- **`development/time.mdc`** - Time handling principles and UTC standards
+- **`development/time_examples.mdc`** - Practical time implementation examples
+- **`development/time_implementation.mdc`** - Detailed time implementation
+  guidelines
+
+### **Version Control & Process**
+
+- **`workflow/version_control.mdc`** - Version control principles and commit
+  guidelines
+- **`workflow/commit_messages.mdc`** - Commit message format and conventions
+
+### **Application Context**
+
+- **`app/timesafari.mdc`** - Core TimeSafari application context and
+  development principles
+- **`app/timesafari_development.mdc`** - TimeSafari-specific development
+  workflow and quality standards
+
+## Why These Rules Are Always-On
+
+### **Base Context**
+
+- **Human Competence First**: Every interaction must increase human competence
+- **Output Contract**: All responses must follow the required structure
+- **Competence Hooks**: Learning and collaboration must be built into every response
+
+### **Time Standards**
+
+- **UTC Consistency**: All timestamps must use UTC for system operations
+- **Evidence Collection**: Time context is essential for debugging and investigation
+- **Cross-Platform**: Time handling affects all platforms and features
+
+### **Version Control**
+
+- **Commit Standards**: Every code change must follow commit message conventions
+- **Process Consistency**: Version control affects all development work
+- **Team Collaboration**: Commit standards enable effective team communication
+
+### **Application Context**
+
+- **Platform Awareness**: Every task must consider web/mobile/desktop platforms
+- **Architecture Principles**: All work must follow TimeSafari patterns
+- **Development Standards**: Quality and testing requirements apply to all work
+
+## Application Priority
+
+### **Primary (Apply First)**
+
+1. **Base Context** - Human competence and output contract
+2. **Time Standards** - UTC and timestamp requirements
+3. **Application Context** - TimeSafari principles and platforms
+
+### **Secondary (Apply as Needed)**
+
+1. **Version Control** - When making code changes
+2. **Complexity Guidelines** - When evaluating solution approaches
+
+## Integration with Other Meta-Rules
+
+### **Feature Planning**
+
+- Base context ensures human competence focus
+- Time standards inform planning and estimation
+- Application context drives platform considerations
+
+### **Bug Diagnosis**
+
+- Base context ensures systematic investigation
+- Time standards enable proper evidence collection
+- Application context provides system understanding
+
+### **Bug Fixing**
+
+- Base context ensures quality implementation
+- Time standards maintain logging consistency
+- Application context guides testing strategy
+
+### **Feature Implementation**
+
+- Base context ensures proper development approach
+- Time standards maintain system consistency
+- Application context drives architecture decisions
+
+## Success Criteria
+
+- [ ] **Base context applied** to every single prompt
+- [ ] **Time standards followed** for all timestamps and logging
+- [ ] **Version control standards** applied to all code changes
+- [ ] **Application context considered** for all platform work
+- [ ] **Human competence focus** maintained in all interactions
+- [ ] **Output contract structure** followed in all responses
+
+## Common Pitfalls
+
+- **Don't skip base context** - loses human competence focus
+- **Don't ignore time standards** - creates inconsistent timestamps
+- **Don't forget application context** - misses platform considerations
+- **Don't skip version control** - creates inconsistent commit history
+- **Don't lose competence focus** - reduces learning value
+
+## Feedback & Improvement
+
+### **Rule Effectiveness Ratings (1-5 scale)**
+
+- **Base Context**: ___/5 - Comments: _______________
+- **Time Standards**: ___/5 - Comments: _______________
+- **Version Control**: ___/5 - Comments: _______________
+- **Application Context**: ___/5 - Comments: _______________
+
+### **Always-On Effectiveness**
+
+- **Consistency**: Are these rules applied consistently across all prompts?
+- **Value**: Do these rules add value to every interaction?
+- **Overhead**: Are these rules too burdensome for simple tasks?
+
+### **Integration Feedback**
+
+- **With Other Meta-Rules**: How well do these integrate with workflow rules?
+- **Context Switching**: Do these rules help or hinder context switching?
+- **Learning Curve**: Are these rules easy for new users to understand?
+
+### **Overall Experience**
+
+- **Quality Improvement**: Do these rules improve response quality?
+- **Efficiency**: Do these rules make interactions more efficient?
+- **Recommendation**: Would you recommend keeping these always-on?
+
+## Model Implementation Checklist
+
+### Before Every Prompt
+
+- [ ] **Base Context**: Ensure human competence principles are active
+- [ ] **Time Standards**: Verify UTC and timestamp requirements are clear
+- [ ] **Application Context**: Confirm TimeSafari context is loaded
+- [ ] **Version Control**: Prepare commit standards if code changes are needed
+
+### During Response Creation
+
+- [ ] **Output Contract**: Follow required response structure
+- [ ] **Competence Hooks**: Include learning and collaboration elements
+- [ ] **Time Consistency**: Apply UTC standards for all time references
+- [ ] **Platform Awareness**: Consider all target platforms
+
+### After Response Creation
+
+- [ ] **Validation**: Verify all always-on rules were applied
+- [ ] **Quality Check**: Ensure response meets competence standards
+- [ ] **Context Review**: Confirm application context was properly considered
+- [ ] **Feedback Collection**: Note any issues with always-on application
+
+---
+
+**See also**:
+
+- `.cursor/rules/meta_feature_planning.mdc` for workflow-specific rules
+- `.cursor/rules/meta_bug_diagnosis.mdc` for investigation workflows
+- `.cursor/rules/meta_bug_fixing.mdc` for fix implementation
+- `.cursor/rules/meta_feature_implementation.mdc` for feature development
+
+**Status**: Active core always-on meta-rule
+**Priority**: Critical (applies to every prompt)
+**Estimated Effort**: Ongoing reference
+**Dependencies**: All bundled sub-rules
+**Stakeholders**: All AI interactions, Development team

.cursor/rules/harbor_pilot_universal.mdc

@@ -0,0 +1,207 @@
+---
+alwaysApply: true
+inherits: base_context.mdc
+---
+```json
+{
+  "coaching_level": "standard",
+  "socratic_max_questions": 2,
+  "verbosity": "concise",
+  "timebox_minutes": 10,
+  "format_enforcement": "strict"
+}
+```
+
+# Harbor Pilot — Universal Directive for Human-Facing Technical Guides
+
+**Author**: System/Shared  
+**Date**: 2025-08-21 (UTC)  
+**Status**: 🚢 ACTIVE — General ruleset extending *Base Context — Human Competence First*
+
+> **Alignment with Base Context**
+> - **Purpose fit**: Prioritizes human competence and collaboration while delivering reproducible artifacts.  
+> - **Output Contract**: This directive **adds universal constraints** for any technical topic while **inheriting** the Base Context contract sections.  
+> - **Toggles honored**: Uses the same toggle semantics; defaults above can be overridden by the caller.
+
+---
+
+## Objective
+Produce a **developer-grade, reproducible guide** for any technical topic that onboards a competent practitioner **without meta narration** and **with evidence-backed steps**.
+
+## Scope & Constraints
+- **One Markdown document** as the deliverable.
+- Use **absolute dates** in **UTC** (e.g., `2025-08-21T14:22Z`) — avoid “today/yesterday”.
+- Include at least **one diagram** (Mermaid preferred). Choose the most fitting type:
+  - `sequenceDiagram` (protocols/flows), `flowchart`, `stateDiagram`, `gantt` (timelines), or `classDiagram` (schemas).
+- Provide runnable examples where applicable:
+  - **APIs**: `curl` + one client library (e.g., `httpx` for Python).
+  - **CLIs**: literal command blocks and expected output snippets.
+  - **Code**: minimal, self-contained samples (language appropriate).
+- Cite **evidence** for *Works/Doesn’t* items (timestamps, filenames, line numbers, IDs/status codes, or logs).
+- If something is unknown, output `TODO:<missing>` — **never invent**.
+
+## Required Sections (extends Base Output Contract)
+Follow this exact order **after** the Base Contract’s **Objective → Result → Use/Run** headers:
+
+1. **Context & Scope**
+   - Problem statement, audience, in/out-of-scope bullets.
+2. **Artifacts & Links**
+   - Repos/PRs, design docs, datasets/HARs/pcaps, scripts/tools, dashboards.
+3. **Environment & Preconditions**
+   - OS/runtime, versions/build IDs, services/endpoints/URLs, credentials/auth mode (describe acquisition, do not expose secrets).
+4. **Architecture / Process Overview**
+   - Short prose + **one diagram** selected from the list above.
+5. **Interfaces & Contracts (choose one)**
+   - **API-based**: Endpoint table (*Step, Method, Path/URL, Auth, Key Headers/Params, Sample Req/Resp ref*).
+   - **Data/Files**: I/O contract table (*Source, Format, Schema/Columns, Size, Validation rules*).
+   - **Systems/Hardware**: Interfaces table (*Port/Bus, Protocol, Voltage/Timing, Constraints*).
+6. **Repro: End-to-End Procedure**
+   - Minimal copy-paste steps with code/commands and **expected outputs**.
+7. **What Works (with Evidence)**
+   - Each item: **Time (UTC)** • **Artifact/Req IDs** • **Status/Result** • **Where to verify**.
+8. **What Doesn’t (Evidence & Hypotheses)**
+   - Each failure: locus (file/endpoint/module), evidence snippet; short hypothesis and **next probe**.
+9. **Risks, Limits, Assumptions**
+   - SLOs/limits, rate/size caps, security boundaries (CORS/CSRF/ACLs), retries/backoff/idempotency patterns.
+10. **Next Steps (Owner • Exit Criteria • Target Date)**
+    - Actionable, assigned, and time-bound.
+11. **References**
+    - Canonical docs, specs, tickets, prior analyses.
+
+> **Competence Hooks (per Base Context; keep lightweight):**
+> - *Why this works* (≤3 bullets) — core invariants or guarantees.  
+> - *Common pitfalls* (≤3 bullets) — the traps we saw in evidence.  
+> - *Next skill unlock* (1 line) — the next capability to implement/learn.  
+> - *Teach-back* (1 line) — prompt the reader to restate the flow/architecture.
+
+> **Collaboration Hooks (per Base Context):**
+> - Name reviewers for **Interfaces & Contracts** and the **diagram**.  
+> - Short **sign-off checklist** before merging/publishing the guide.
+
+## Do / Don’t (Base-aligned)
+- **Do** quantify progress only against a defined scope with acceptance criteria.
+- **Do** include minimal sample payloads/headers or I/O schemas; redact sensitive values.
+- **Do** keep commentary lean; if timeboxed, move depth to **Deferred for depth**.
+- **Don’t** use marketing language or meta narration (“Perfect!”, “tool called”, “new chat”).  
+- **Don’t** include IDE-specific chatter or internal rules unrelated to the task.
+
+## Validation Checklist (self-check before returning)
+- [ ] All Required Sections present and ordered.  
+- [ ] Diagram compiles (basic Mermaid syntax) and fits the problem.  
+- [ ] If API-based, **Auth** and **Key Headers/Params** are listed for each endpoint.  
+- [ ] Repro section includes commands/code **and expected outputs**.  
+- [ ] Every Works/Doesn’t item has **UTC timestamp**, **status/result**, and **verifiable evidence**.  
+- [ ] Next Steps include **Owner**, **Exit Criteria**, **Target Date**.  
+- [ ] Unknowns are `TODO:<missing>` — no fabrication.  
+- [ ] Base **Output Contract** sections satisfied (Objective/Result/Use/Run/Competence/Collaboration/Assumptions/References).
+
+## Universal Template (fill-in)
+```markdown
+# <Title> — Working Notes (As of YYYY-MM-DDTHH:MMZ)
+
+## Objective
+<one line>
+
+## Result
+<link to the produced guide file or say “this document”>
+
+## Use/Run
+<how to apply/test and where to run samples>
+
+## Context & Scope
+- Audience: <role(s)>
+- In scope: <bullets>
+- Out of scope: <bullets>
+
+## Artifacts & Links
+- Repo/PR: <link>
+- Data/Logs: <paths or links>
+- Scripts/Tools: <paths>
+- Dashboards: <links>
+
+## Environment & Preconditions
+- OS/Runtime: <details>
+- Versions/Builds: <list>
+- Services/Endpoints: <list>
+- Auth mode: <Bearer/Session/Keys + how acquired>
+
+## Architecture / Process Overview
+<short prose>
+```mermaid
+<one suitable diagram: sequenceDiagram | flowchart | stateDiagram | gantt | classDiagram>
+```
+
+## Interfaces & Contracts
+### If API-based
+| Step | Method | Path/URL | Auth | Key Headers/Params | Sample |
+|---|---|---|---|---|---|
+| <…> | <…> | <…> | <…> | <…> | below |
+
+### If Data/Files
+| Source | Format | Schema/Columns | Size | Validation |
+|---|---|---|---|---|
+| <…> | <…> | <…> | <…> | <…> |
+
+### If Systems/Hardware
+| Interface | Protocol | Timing/Voltage | Constraints | Notes |
+|---|---|---|---|---|
+| <…> | <…> | <…> | <…> | <…> |
+
+## Repro: End-to-End Procedure
+```bash
+# commands / curl examples (redacted where necessary)
+```
+```python
+# minimal client library example (language appropriate)
+```
+> Expected output: <snippet/checks>
+
+## What Works (Evidence)
+- ✅ <short statement>  
+  - **Time**: <YYYY-MM-DDTHH:MMZ>  
+  - **Evidence**: file/line/log or request id/status  
+  - **Verify at**: <where>
+
+## What Doesn’t (Evidence & Hypotheses)
+- ❌ <short failure> at `<component/endpoint/file>`  
+  - **Time**: <YYYY-MM-DDTHH:MMZ>  
+  - **Evidence**: <snippet/id/status>  
+  - **Hypothesis**: <short>  
+  - **Next probe**: <short>
+
+## Risks, Limits, Assumptions
+<bullets: limits, security boundaries, retries/backoff, idempotency, SLOs>
+
+## Next Steps
+| Owner | Task | Exit Criteria | Target Date (UTC) |
+|---|---|---|---|
+| <name> | <action> | <measurable outcome> | <YYYY-MM-DD> |
+
+## References
+<links/titles>
+
+## Competence Hooks
+- *Why this works*: <≤3 bullets>
+- *Common pitfalls*: <≤3 bullets>
+- *Next skill unlock*: <1 line>
+- *Teach-back*: <1 line>
+
+## Collaboration Hooks
+- Reviewers: <names/roles>
+- Sign-off checklist: <≤5 checks>
+
+## Assumptions & Limits
+<bullets>
+
+## Deferred for depth
+<park deeper material here to respect timeboxing>
+```
+
+---
+
+**Notes for Implementers:**  
+- Respect Base *Do-Not* (no filler, no invented facts, no censorship).  
+- Prefer clarity over completeness when timeboxed; capture unknowns explicitly.
+- Apply historical comment management rules (see `.cursor/rules/historical_comment_management.mdc`)
+- Apply realistic time estimation rules (see `.cursor/rules/realistic_time_estimation.mdc`)
+- Apply Playwright test investigation rules (see `.cursor/rules/playwright_test_investigation.mdc`)

.cursor/rules/meta_bug_diagnosis.mdc

@@ -1,169 +1,285 @@
-# Meta-Rule: Bug Diagnosis
+# Meta-Rule: Bug Diagnosis Workflow
 
 **Author**: Matthew Raymer
-**Date**: 2025-08-21
+**Date**: August 24, 2025
-**Status**: 🎯 **ACTIVE** - Bug investigation workflow bundling
+**Status**: 🎯 **ACTIVE** - Core workflow for all bug investigation
 
 ## Purpose
 
-This meta-rule bundles all the rules needed for systematic bug investigation
+This meta-rule defines the systematic approach for investigating and diagnosing
-and root cause analysis. Use this when bugs are reported, performance
+bugs, defects, and unexpected behaviors in the TimeSafari application. It ensures
-issues occur, or unexpected behavior happens.
+consistent, thorough, and efficient problem-solving workflows.
+
+## Workflow Constraints
+
+**This meta-rule enforces DIAGNOSIS MODE for all bundled sub-rules:**
+
+```json
+{
+  "workflowMode": "diagnosis",
+  "constraints": {
+    "mode": "read_only",
+    "forbidden": ["modify", "create", "build", "commit"],
+    "required": "complete_investigation_before_fixing"
+  }
+}
+```
+
+**All bundled sub-rules automatically inherit these constraints.**
+
+## Workflow State Update
+
+**When this meta-rule is invoked, update the workflow state file:**
+
+```json
+{
+  "currentMode": "diagnosis",
+  "lastInvoked": "meta_bug_diagnosis.mdc",
+  "timestamp": "2025-01-27T15:30:00Z",
+  "constraints": {
+    "mode": "read_only",
+    "forbidden": ["modify", "create", "build", "commit"],
+    "allowed": ["read", "search", "analyze", "document"],
+    "required": "complete_investigation_before_fixing"
+  }
+}
+```
+
+**State File Location**: `.cursor/rules/.workflow_state.json`
+
+**This enables the core always-on rule to enforce diagnosis mode constraints.**
 
 ## When to Use
 
-- **Bug Reports**: Investigating reported bugs or issues
+**ALWAYS** - Apply this workflow to every bug investigation, regardless of
-- **Performance Issues**: Diagnosing slow performance or bottlenecks
+severity or complexity. This ensures systematic problem-solving and prevents
-- **Unexpected Behavior**: Understanding why code behaves unexpectedly
+common investigation pitfalls.
-- **Production Issues**: Investigating issues in live environments
-- **Test Failures**: Understanding why tests are failing
-- **Integration Problems**: Diagnosing issues between components
 
 ## Bundled Rules
 
-### **Investigation Process**
+### **Investigation Foundation**
 
-- **`development/research_diagnostic.mdc`** - Systematic investigation
+- **`development/research_diagnostic.mdc`** - Research and investigation methodologies
-  workflow with evidence collection and analysis
+- **`development/logging_standards.mdc`** - Logging and debugging best practices
-- **`development/investigation_report_example.mdc`** - Investigation
+- **`development/type_safety_guide.mdc`** - Type safety and error prevention
-  documentation templates and examples
-- **`core/harbor_pilot_universal.mdc`** - Technical guide creation
-  for complex investigations
 
-### **Evidence Collection**
+### **Development Workflow**
 
-- **`development/logging_standards.mdc`** - Logging implementation
+- **`workflow/version_control.mdc`** - Version control during investigation
-  standards for debugging and evidence collection
+- **`development/software_development.mdc`** - Development best practices
-- **`development/time.mdc`** - Timestamp requirements and time
-  handling standards for evidence
-- **`development/time_examples.mdc`** - Practical examples of
-  proper time handling in investigations
 
-### **Technical Context**
+## Critical Development Constraints
 
-- **`app/timesafari.mdc`** - Core application context and
+### **🚫 NEVER Use Build Commands During Diagnosis**
-  architecture for understanding the system
-- **`app/timesafari_platforms.mdc`** - Platform-specific
-  considerations and constraints
 
-## Workflow Sequence
+**Critical Rule**: Never use `npm run build:web` or similar build commands during bug diagnosis
 
-### **Phase 1: Initial Investigation (Start Here)**
+- **Reason**: These commands block the chat and prevent effective troubleshooting
+- **Impact**: Blocks user interaction, prevents real-time problem solving
+- **Alternative**: Use safe, fast commands for investigation
+- **When to use build**: Only after diagnosis is complete and fixes are ready for testing
 
-1. **Research Diagnostic** - Use `research_diagnostic.mdc` for
+### **Safe Diagnosis Commands**
-   systematic investigation approach
-2. **Evidence Collection** - Apply `logging_standards.mdc` and
-   `time.mdc` for proper evidence gathering
-3. **Context Understanding** - Review `timesafari.mdc` for
-   application context
 
-### **Phase 2: Deep Investigation**
+✅ **Safe to use during diagnosis:**
+- `npm run lint-fix` - Syntax and style checking
+- `npm run type-check` - TypeScript validation (if available)
+- `git status` - Version control status
+- `ls` / `dir` - File listing
+- `cat` / `read_file` - File content inspection
+- `grep_search` - Text pattern searching
 
-1. **Platform Analysis** - Check `timesafari_platforms.mdc` for
+❌ **Never use during diagnosis:**
-   platform-specific issues
+- `npm run build:web` - Blocks chat
-2. **Technical Guide Creation** - Use `harbor_pilot_universal.mdc`
+- `npm run build:electron` - Blocks chat  
-   for complex investigation documentation
+- `npm run build:capacitor` - Blocks chat
-3. **Evidence Analysis** - Apply `time_examples.mdc` for proper
+- Any long-running build processes
-   timestamp handling
 
-### **Phase 3: Documentation & Reporting**
+## Investigation Workflow
 
-1. **Investigation Report** - Use `investigation_report_example.mdc`
+### **Phase 1: Problem Definition**
-   for comprehensive documentation
-2. **Root Cause Analysis** - Synthesize findings into actionable
-   insights
 
-## Success Criteria
+1. **Gather Evidence**
+   - Error messages and stack traces
+   - User-reported symptoms
+   - System logs and timestamps
+   - Reproduction steps
 
-- [ ] **Root cause identified** with supporting evidence
+2. **Context Analysis**
-- [ ] **Evidence properly collected** with timestamps and context
+   - When did the problem start?
-- [ ] **Investigation documented** using appropriate templates
+   - What changed recently?
-- [ ] **Platform factors considered** in diagnosis
+   - Which platform/environment?
-- [ ] **Reproduction steps documented** for verification
+   - User actions leading to the issue
-- [ ] **Impact assessment completed** with scope defined
+
-- [ ] **Next steps identified** for resolution
+### **Phase 2: Systematic Investigation**
+
+1. **Code Inspection**
+   - Relevant file examination
+   - Import and dependency analysis
+   - Syntax and type checking
+   - Logic flow analysis
+
+2. **Environment Analysis**
+   - Platform-specific considerations
+   - Configuration and settings
+   - Database and storage state
+   - Network and API connectivity
+
+### **Phase 3: Root Cause Identification**
+
+1. **Pattern Recognition**
+   - Similar issues in codebase
+   - Common failure modes
+   - Platform-specific behaviors
+   - Recent changes impact
+
+2. **Hypothesis Testing**
+   - Targeted code changes
+   - Configuration modifications
+   - Environment adjustments
+   - Systematic elimination
+
+## Investigation Techniques
+
+### **Safe Code Analysis**
+
+- **File Reading**: Use `read_file` tool for targeted inspection
+- **Pattern Searching**: Use `grep_search` for code patterns
+- **Semantic Search**: Use `codebase_search` for related functionality
+- **Import Tracing**: Follow dependency chains systematically
+
+### **Error Analysis**
+
+- **Stack Trace Analysis**: Identify error origin and propagation
+- **Log Correlation**: Match errors with system events
+- **Timeline Reconstruction**: Build sequence of events
+- **Context Preservation**: Maintain investigation state
+
+### **Platform Considerations**
+
+- **Web Platform**: Browser-specific behaviors and limitations
+- **Electron Platform**: Desktop app considerations
+- **Capacitor Platform**: Mobile app behaviors
+- **Cross-Platform**: Shared vs. platform-specific code
+
+## Evidence Collection Standards
+
+### **Timestamps**
+
+- **UTC Format**: All timestamps in UTC for consistency
+- **Precision**: Include milliseconds for precise correlation
+- **Context**: Include relevant system state information
+- **Correlation**: Link events across different components
+
+### **Error Context**
+
+- **Full Error Objects**: Capture complete error information
+- **Stack Traces**: Preserve call stack for analysis
+- **User Actions**: Document steps leading to error
+- **System State**: Capture relevant configuration and state
+
+### **Reproduction Steps**
+
+- **Clear Sequence**: Step-by-step reproduction instructions
+- **Environment Details**: Platform, version, configuration
+- **Data Requirements**: Required data or state
+- **Expected vs. Actual**: Clear behavior comparison
+
+## Investigation Documentation
+
+### **Problem Summary**
+
+- **Issue Description**: Clear, concise problem statement
+- **Impact Assessment**: Severity and user impact
+- **Scope Definition**: Affected components and users
+- **Priority Level**: Based on impact and frequency
+
+### **Investigation Log**
+
+- **Timeline**: Chronological investigation steps
+- **Evidence**: Collected information and findings
+- **Hypotheses**: Tested theories and results
+- **Conclusions**: Root cause identification
+
+### **Solution Requirements**
+
+- **Fix Description**: Required changes and approach
+- **Testing Strategy**: Validation and verification steps
+- **Rollback Plan**: Reversion strategy if needed
+- **Prevention Measures**: Future issue prevention
+
+## Quality Standards
+
+### **Investigation Completeness**
+
+- **Evidence Sufficiency**: Adequate information for root cause
+- **Alternative Theories**: Considered and eliminated
+- **Platform Coverage**: All relevant platforms investigated
+- **Edge Cases**: Unusual scenarios considered
+
+### **Documentation Quality**
+
+- **Clear Communication**: Understandable to all stakeholders
+- **Technical Accuracy**: Precise technical details
+- **Actionable Insights**: Clear next steps and recommendations
+- **Knowledge Transfer**: Lessons learned for future reference
 
 ## Common Pitfalls
 
-- **Don't skip evidence collection** - leads to speculation
+### **Investigation Mistakes**
-- **Don't ignore platform differences** - misses platform-specific issues
-- **Don't skip documentation** - loses investigation insights
-- **Don't assume root cause** - verify with evidence
-- **Don't ignore time context** - misses temporal factors
-- **Don't skip reproduction steps** - makes verification impossible
 
-## Integration Points
+- **Jumping to Solutions**: Implementing fixes before understanding
+- **Insufficient Evidence**: Making assumptions without data
+- **Platform Blindness**: Ignoring platform-specific behaviors
+- **Scope Creep**: Expanding investigation beyond original problem
 
-### **With Other Meta-Rules**
+### **Communication Issues**
 
-- **Feature Planning**: Use complexity assessment for investigation planning
+- **Technical Jargon**: Using unclear terminology
-- **Bug Fixing**: Investigation results feed directly into fix implementation
+- **Missing Context**: Insufficient background information
-- **Feature Implementation**: Investigation insights inform future development
+- **Unclear Recommendations**: Vague or ambiguous next steps
+- **Poor Documentation**: Incomplete or unclear investigation records
 
-### **With Development Workflow**
+## Success Criteria
 
-- Investigation findings inform testing strategy
+- [ ] **Problem clearly defined** with sufficient evidence
-- Root cause analysis drives preventive measures
+- [ ] **Root cause identified** through systematic investigation
-- Evidence collection improves logging standards
+- [ ] **Solution approach determined** with clear requirements
+- [ ] **Documentation complete** for knowledge transfer
+- [ ] **No chat-blocking commands** used during investigation
+- [ ] **Platform considerations** properly addressed
+- [ ] **Timeline and context** properly documented
 
-## Feedback & Improvement
+## Integration with Other Meta-Rules
 
-### **Sub-Rule Ratings (1-5 scale)**
+### **Bug Fixing**
 
-- **Research Diagnostic**: ___/5 - Comments: _______________
+- **Investigation Results**: Provide foundation for fix implementation
-- **Investigation Report**: ___/5 - Comments: _______________
+- **Solution Requirements**: Define what needs to be built
-- **Technical Guide Creation**: ___/5 - Comments: _______________
+- **Testing Strategy**: Inform validation approach
-- **Logging Standards**: ___/5 - Comments: _______________
+- **Documentation**: Support implementation guidance
-- **Time Standards**: ___/5 - Comments: _______________
 
-### **Workflow Feedback**
+### **Feature Planning**
 
-- **Investigation Effectiveness**: How well did the process help find root cause?
+- **Root Cause Analysis**: Identify systemic issues
-- **Missing Steps**: What investigation steps should be added?
+- **Prevention Measures**: Plan future issue avoidance
-- **Process Gaps**: Where did the workflow break down?
+- **Architecture Improvements**: Identify structural enhancements
+- **Process Refinements**: Improve development workflows
 
-### **Sub-Rule Improvements**
+### **Research and Documentation**
 
-- **Clarity Issues**: Which rules were unclear or confusing?
+- **Knowledge Base**: Contribute to troubleshooting guides
-- **Missing Examples**: What examples would make rules more useful?
+- **Pattern Recognition**: Identify common failure modes
-- **Template Improvements**: How could investigation templates be better?
+- **Best Practices**: Develop investigation methodologies
-
+- **Team Training**: Improve investigation capabilities
-### **Overall Experience**
-
-- **Time Saved**: How much time did this meta-rule save you?
-- **Quality Improvement**: Did following these rules improve your investigation?
-- **Recommendation**: Would you recommend this meta-rule to others?
-
-## Model Implementation Checklist
-
-### Before Bug Investigation
-
-- [ ] **Problem Definition**: Clearly define what needs to be investigated
-- [ ] **Scope Definition**: Determine investigation scope and boundaries
-- [ ] **Evidence Planning**: Plan evidence collection strategy
-- [ ] **Stakeholder Identification**: Identify who needs to be involved
-
-### During Bug Investigation
-
-- [ ] **Rule Application**: Apply bundled rules in recommended sequence
-- [ ] **Evidence Collection**: Collect evidence systematically with timestamps
-- [ ] **Documentation**: Document investigation process and findings
-- [ ] **Validation**: Verify findings with reproduction steps
-
-### After Bug Investigation
-
-- [ ] **Report Creation**: Create comprehensive investigation report
-- [ ] **Root Cause Analysis**: Document root cause with evidence
-- [ ] **Feedback Collection**: Collect feedback on meta-rule effectiveness
-- [ ] **Process Improvement**: Identify improvements for future investigations
 
 ---
 
 **See also**:
 
-- `.cursor/rules/meta_feature_planning.mdc` for planning investigation work
 - `.cursor/rules/meta_bug_fixing.mdc` for implementing fixes
-- `.cursor/rules/meta_feature_implementation.mdc` for preventive measures
+- `.cursor/rules/meta_feature_planning.mdc` for planning improvements
+- `.cursor/rules/meta_documentation.mdc` for documentation standards
 
 **Status**: Active meta-rule for bug diagnosis
 **Priority**: High

.cursor/rules/meta_bug_fixing.mdc

@@ -10,6 +10,45 @@ This meta-rule bundles all the rules needed for implementing bug fixes
 with proper testing and validation. Use this after diagnosis when
 implementing the actual fix.
 
+## Workflow Constraints
+
+**This meta-rule enforces FIXING MODE for all bundled sub-rules:**
+
+```json
+{
+  "workflowMode": "fixing",
+  "constraints": {
+    "mode": "implementation",
+    "allowed": ["modify", "create", "build", "test", "commit"],
+    "required": "diagnosis_complete_before_fixing"
+  }
+}
+```
+
+**All bundled sub-rules automatically inherit these constraints.**
+
+## Workflow State Update
+
+**When this meta-rule is invoked, update the workflow state file:**
+
+```json
+{
+  "currentMode": "fixing",
+  "lastInvoked": "meta_bug_fixing.mdc",
+  "timestamp": "2025-01-27T15:30:00Z",
+  "constraints": {
+    "mode": "implementation",
+    "allowed": ["modify", "create", "build", "test", "commit"],
+    "forbidden": [],
+    "required": "diagnosis_complete_before_fixing"
+  }
+}
+```
+
+**State File Location**: `.cursor/rules/.workflow_state.json`
+
+**This enables the core always-on rule to enforce fixing mode constraints.**
+
 ## When to Use
 
 - **Post-Diagnosis**: After root cause is identified and fix is planned

.cursor/rules/meta_change_evaluation.mdc

@@ -0,0 +1,383 @@
+# Meta-Rule: Change Evaluation and Breaking Change Detection
+
+**Author**: Matthew Raymer  
+**Date**: 2025-08-25  
+**Status**: 🎯 **ACTIVE** - Manually activated change evaluation rule
+
+## Purpose
+
+This meta-rule provides a systematic approach to evaluate changes between
+branches and detect potential breaking changes. It's designed to catch
+problematic model behavior by analyzing the nature, scope, and impact of
+code changes before they cause issues.
+
+## When to Use
+
+**Manual Activation Only** - This rule should be invoked when:
+
+- Reviewing changes before merging branches
+- Investigating unexpected behavior after updates
+- Validating that model-generated changes are safe
+- Analyzing the impact of recent commits
+- Debugging issues that may be caused by recent changes
+
+## Workflow State Enforcement
+
+**This meta-rule enforces current workflow mode constraints:**
+
+### **Current Workflow State**
+
+```json
+{
+  "workflowState": {
+    "currentMode": "diagnosis|fixing|planning|research|documentation",
+    "constraints": {
+      "mode": "read_only|implementation|design_only|investigation|writing_only",
+      "allowed": ["array", "of", "allowed", "actions"],
+      "forbidden": ["array", "of", "forbidden", "actions"]
+    }
+  }
+}
+```
+
+### **Mode-Specific Enforcement**
+
+**Diagnosis Mode (read_only):**
+
+- ❌ **Forbidden**: File modification, code creation, build commands, git
+  commits
+- ✅ **Allowed**: File reading, code analysis, investigation, documentation
+- **Response**: Focus on analysis and documentation, not implementation
+
+**Fixing Mode (implementation):**
+
+- ✅ **Allowed**: File modification, code creation, build commands, testing,
+  git commits
+- ❌ **Forbidden**: None (full implementation mode)
+- **Response**: Proceed with implementation and testing
+
+**Planning Mode (design_only):**
+
+- ❌ **Forbidden**: Implementation, coding, building, deployment
+- ✅ **Allowed**: Analysis, design, estimation, documentation, architecture
+- **Response**: Focus on planning and design, not implementation
+
+**Research Mode (investigation):**
+
+- ❌ **Forbidden**: File modification, implementation, deployment
+- ✅ **Allowed**: Investigation, analysis, research, documentation
+- **Response**: Focus on investigation and analysis
+
+**Documentation Mode (writing_only):**
+
+- ❌ **Forbidden**: Implementation, coding, building, deployment
+- ✅ **Allowed**: Writing, editing, formatting, structuring, reviewing
+- **Response**: Focus on documentation creation and improvement
+
+## Change Evaluation Process
+
+### **Phase 1: Change Discovery and Analysis**
+
+1. **Branch Comparison Analysis**
+
+   - Compare working branch with master/main branch
+   - Identify all changed files and their modification types
+   - Categorize changes by scope and impact
+
+2. **Change Pattern Recognition**
+
+   - Identify common change patterns (refactoring, feature addition, bug
+     fixes)
+   - Detect unusual or suspicious change patterns
+   - Flag changes that deviate from established patterns
+
+3. **Dependency Impact Assessment**
+
+   - Analyze changes to imports, exports, and interfaces
+   - Identify potential breaking changes to public APIs
+   - Assess impact on dependent components and services
+
+### **Phase 2: Breaking Change Detection**
+
+1. **API Contract Analysis**
+
+   - Check for changes to function signatures, method names, class
+     interfaces
+   - Identify removed or renamed public methods/properties
+   - Detect changes to configuration options and constants
+
+2. **Data Structure Changes**
+
+   - Analyze database schema modifications
+   - Check for changes to data models and interfaces
+   - Identify modifications to serialization/deserialization logic
+
+3. **Behavioral Changes**
+
+   - Detect changes to business logic and algorithms
+   - Identify modifications to error handling and validation
+   - Check for changes to user experience and workflows
+
+### **Phase 3: Risk Assessment and Recommendations**
+
+1. **Risk Level Classification**
+
+   - **LOW**: Cosmetic changes, documentation updates, minor refactoring
+   - **MEDIUM**: Internal API changes, configuration modifications,
+     performance improvements
+   - **HIGH**: Public API changes, breaking interface modifications, major
+     architectural changes
+   - **CRITICAL**: Database schema changes, authentication modifications,
+     security-related changes
+
+2. **Impact Analysis**
+
+   - Identify affected user groups and use cases
+   - Assess potential for data loss or corruption
+   - Evaluate impact on system performance and reliability
+
+3. **Mitigation Strategies**
+
+   - Recommend testing approaches for affected areas
+   - Suggest rollback strategies if needed
+   - Identify areas requiring additional validation
+
+## Implementation Guidelines
+
+### **Change Analysis Tools**
+
+1. **Git Diff Analysis**
+
+   ```bash
+   # Compare working branch with master
+   git diff master..HEAD --name-only
+   git diff master..HEAD --stat
+   git log master..HEAD --oneline
+   ```
+
+2. **File Change Categorization**
+
+   - **Core Files**: Application entry points, main services, critical
+     utilities
+   - **Interface Files**: Public APIs, component interfaces, data models
+   - **Configuration Files**: Environment settings, build configurations,
+     deployment scripts
+   - **Test Files**: Unit tests, integration tests, test utilities
+
+3. **Change Impact Mapping**
+
+   - Map changed files to affected functionality
+   - Identify cross-dependencies and ripple effects
+   - Document potential side effects and unintended consequences
+
+### **Breaking Change Detection Patterns**
+
+1. **Function Signature Changes**
+
+   ```typescript
+   // BEFORE
+   function processData(data: string, options?: Options): Result
+   
+   // AFTER - BREAKING CHANGE
+   function processData(data: string, options: Required<Options>): Result
+   ```
+
+2. **Interface Modifications**
+
+   ```typescript
+   // BEFORE
+   interface UserProfile {
+     name: string;
+     email: string;
+   }
+   
+   // AFTER - BREAKING CHANGE
+   interface UserProfile {
+     name: string;
+     email: string;
+     phone: string; // Required new field
+   }
+   ```
+
+3. **Configuration Changes**
+
+   ```typescript
+   // BEFORE
+   const config = {
+     apiUrl: 'https://api.example.com',
+     timeout: 5000
+   };
+   
+   // AFTER - BREAKING CHANGE
+   const config = {
+     apiUrl: 'https://api.example.com',
+     timeout: 5000,
+     retries: 3 // New required configuration
+   };
+   ```
+
+## Output Format
+
+### **Change Evaluation Report**
+
+```markdown
+# Change Evaluation Report
+
+## Executive Summary
+
+- **Risk Level**: [LOW|MEDIUM|HIGH|CRITICAL]
+- **Overall Assessment**: [SAFE|CAUTION|DANGEROUS|CRITICAL]
+- **Recommendation**: [PROCEED|REVIEW|HALT|IMMEDIATE_ROLLBACK]
+
+## Change Analysis
+
+### Files Modified
+
+- **Total Changes**: [X] files
+- **Core Files**: [X] files
+- **Interface Files**: [X] files
+- **Configuration Files**: [X] files
+- **Test Files**: [X] files
+
+### Change Categories
+
+- **Refactoring**: [X] changes
+- **Feature Addition**: [X] changes
+- **Bug Fixes**: [X] changes
+- **Configuration**: [X] changes
+- **Documentation**: [X] changes
+
+## Breaking Change Detection
+
+### API Contract Changes
+
+- **Function Signatures**: [X] modified
+- **Interface Definitions**: [X] modified
+- **Public Methods**: [X] added/removed/modified
+
+### Data Structure Changes
+
+- **Database Schema**: [X] modifications
+- **Data Models**: [X] changes
+- **Serialization**: [X] changes
+
+### Behavioral Changes
+
+- **Business Logic**: [X] modifications
+- **Error Handling**: [X] changes
+- **User Experience**: [X] changes
+
+## Risk Assessment
+
+### Impact Analysis
+
+- **User Groups Affected**: [Description]
+- **Use Cases Impacted**: [Description]
+- **Performance Impact**: [Description]
+- **Reliability Impact**: [Description]
+
+### Dependencies
+
+- **Internal Dependencies**: [List]
+- **External Dependencies**: [List]
+- **Configuration Dependencies**: [List]
+
+## Recommendations
+
+### Testing Requirements
+
+- [ ] Unit tests for modified components
+- [ ] Integration tests for affected workflows
+- [ ] Performance tests for changed algorithms
+- [ ] User acceptance tests for UI changes
+
+### Validation Steps
+
+- [ ] Code review by domain experts
+- [ ] API compatibility testing
+- [ ] Database migration testing
+- [ ] End-to-end workflow testing
+
+### Rollback Strategy
+
+- **Rollback Complexity**: [LOW|MEDIUM|HIGH]
+- **Rollback Time**: [Estimated time]
+- **Data Preservation**: [Strategy description]
+
+## Conclusion
+
+[Summary of findings and final recommendation]
+```
+
+## Usage Examples
+
+### **Example 1: Safe Refactoring**
+
+```bash
+@meta_change_evaluation.mdc analyze changes between feature-branch and master
+```
+
+### **Example 2: Breaking Change Investigation**
+
+```bash
+@meta_change_evaluation.mdc evaluate potential breaking changes in recent commits
+```
+
+### **Example 3: Pre-Merge Validation**
+
+```bash
+@meta_change_evaluation.mdc validate changes before merging feature-branch to master
+```
+
+## Success Criteria
+
+- [ ] **Change Discovery**: All modified files are identified and categorized
+- [ ] **Pattern Recognition**: Unusual change patterns are detected and flagged
+- [ ] **Breaking Change Detection**: All potential breaking changes are identified
+- [ ] **Risk Assessment**: Accurate risk levels are assigned with justification
+- [ ] **Recommendations**: Actionable recommendations are provided
+- [ ] **Documentation**: Complete change evaluation report is generated
+
+## Common Pitfalls
+
+- **Missing Dependencies**: Failing to identify all affected components
+- **Underestimating Impact**: Not considering ripple effects of changes
+- **Incomplete Testing**: Missing critical test scenarios for changes
+- **Configuration Blindness**: Overlooking configuration file changes
+- **Interface Assumptions**: Assuming internal changes won't affect external
+  users
+
+## Integration with Other Meta-Rules
+
+### **With Bug Diagnosis**
+
+- Use change evaluation to identify recent changes that may have caused
+  bugs
+- Correlate change patterns with reported issues
+
+### **With Feature Planning**
+
+- Evaluate the impact of planned changes before implementation
+- Identify potential breaking changes early in the planning process
+
+### **With Bug Fixing**
+
+- Validate that fixes don't introduce new breaking changes
+- Ensure fixes maintain backward compatibility
+
+---
+
+**See also**:
+
+- `.cursor/rules/meta_core_always_on.mdc` for core always-on rules
+- `.cursor/rules/meta_feature_planning.mdc` for feature development
+  workflows
+- `.cursor/rules/meta_bug_diagnosis.mdc` for bug investigation workflows
+- `.cursor/rules/meta_bug_fixing.mdc` for fix implementation workflows
+
+**Status**: Active change evaluation meta-rule
+**Priority**: High (applies to all change evaluation tasks)
+**Estimated Effort**: Ongoing reference
+**Dependencies**: All bundled sub-rules
+**Stakeholders**: Development team, Quality Assurance team, Release
+Management team

.cursor/rules/meta_core_always_on.mdc

@@ -14,6 +14,109 @@ This meta-rule bundles the core rules that should be applied to **every single
 prompt** because they define fundamental behaviors, principles, and context
 that are essential for all AI interactions.
 
+## Workflow Constraints
+
+**This meta-rule enforces ALWAYS-ON MODE for all bundled sub-rules:**
+
+```json
+{
+  "workflowMode": "always_on",
+  "constraints": {
+    "mode": "foundation",
+    "alwaysApplied": true,
+    "required": "applied_to_every_prompt"
+  }
+}
+```
+
+**All bundled sub-rules automatically inherit these constraints.**
+
+## Workflow State Enforcement
+
+**This meta-rule enforces current workflow mode constraints for all interactions:**
+
+### **Current Workflow State**
+```json
+{
+  "workflowState": {
+    "currentMode": "diagnosis|fixing|planning|research|documentation",
+    "constraints": {
+      "mode": "read_only|implementation|design_only|investigation|writing_only",
+      "allowed": ["array", "of", "allowed", "actions"],
+      "forbidden": ["array", "of", "forbidden", "actions"]
+    }
+  }
+}
+```
+
+### **Constraint Enforcement Rules**
+
+**Before responding to any user request, enforce current mode constraints:**
+
+1. **Read current workflow state** from `.cursor/rules/.workflow_state.json`
+2. **Identify current mode** and its constraints
+3. **Validate user request** against current mode constraints
+4. **Enforce constraints** before generating response
+5. **Guide model behavior** based on current mode
+
+### **Mode-Specific Enforcement**
+
+**Diagnosis Mode (read_only):**
+- ❌ **Forbidden**: File modification, code creation, build commands, git commits
+- ✅ **Allowed**: File reading, code analysis, investigation, documentation
+- **Response**: Guide user toward investigation and analysis, not implementation
+
+**Fixing Mode (implementation):**
+- ✅ **Allowed**: File modification, code creation, build commands, testing, git commits
+- ❌ **Forbidden**: None (full implementation mode)
+- **Response**: Proceed with implementation and testing
+
+**Planning Mode (design_only):**
+- ❌ **Forbidden**: Implementation, coding, building, deployment
+- ✅ **Allowed**: Analysis, design, estimation, documentation, architecture
+- **Response**: Focus on planning and design, not implementation
+
+**Research Mode (investigation):**
+- ❌ **Forbidden**: File modification, implementation, deployment
+- ✅ **Allowed**: Investigation, analysis, research, documentation
+- **Response**: Focus on investigation and analysis
+
+**Documentation Mode (writing_only):**
+- ❌ **Forbidden**: Implementation, coding, building, deployment
+- ✅ **Allowed**: Writing, editing, formatting, structuring, reviewing
+- **Response**: Focus on documentation creation and improvement
+
+### **Constraint Violation Response**
+
+**If user request violates current mode constraints:**
+
+```
+❌ **WORKFLOW CONSTRAINT VIOLATION**
+
+**Current Mode**: [MODE_NAME]
+**Requested Action**: [ACTION] 
+**Constraint Violation**: [DESCRIPTION]
+
+**What You Can Do Instead**:
+- [LIST OF ALLOWED ALTERNATIVES]
+
+**To Enable This Action**: Invoke @meta_[appropriate_mode].mdc
+```
+
+### **Mode Transition Guidance**
+
+**When user needs to change modes, provide clear guidance:**
+
+```
+🔄 **MODE TRANSITION REQUIRED**
+
+**Current Mode**: [CURRENT_MODE]
+**Required Mode**: [REQUIRED_MODE]
+**Action**: Invoke @meta_[required_mode].mdc
+
+**This will enable**: [DESCRIPTION OF NEW CAPABILITIES]
+```
+
 ## When to Use
 
 **ALWAYS** - These rules apply to every single prompt, regardless of the task
@@ -165,6 +268,8 @@ or context. They form the foundation for all AI assistant behavior.
 - [ ] **Time Standards**: Verify UTC and timestamp requirements are clear
 - [ ] **Application Context**: Confirm TimeSafari context is loaded
 - [ ] **Version Control**: Prepare commit standards if code changes are needed
+- [ ] **Workflow State**: Read current mode constraints from state file
+- [ ] **Constraint Validation**: Validate user request against current mode
 
 ### During Response Creation
 
@@ -172,6 +277,8 @@ or context. They form the foundation for all AI assistant behavior.
 - [ ] **Competence Hooks**: Include learning and collaboration elements
 - [ ] **Time Consistency**: Apply UTC standards for all time references
 - [ ] **Platform Awareness**: Consider all target platforms
+- [ ] **Mode Enforcement**: Apply current mode constraints to response
+- [ ] **Constraint Violations**: Block forbidden actions and guide alternatives
 
 ### After Response Creation
 
@@ -179,6 +286,8 @@ or context. They form the foundation for all AI assistant behavior.
 - [ ] **Quality Check**: Ensure response meets competence standards
 - [ ] **Context Review**: Confirm application context was properly considered
 - [ ] **Feedback Collection**: Note any issues with always-on application
+- [ ] **Mode Compliance**: Verify response stayed within current mode constraints
+- [ ] **Transition Guidance**: Provide clear guidance for mode changes if needed
 
 ---
 
@@ -194,3 +303,9 @@ or context. They form the foundation for all AI assistant behavior.
 **Estimated Effort**: Ongoing reference
 **Dependencies**: All bundled sub-rules
 **Stakeholders**: All AI interactions, Development team
+
+**Dependencies**: All bundled sub-rules
+**Stakeholders**: All AI interactions, Development team
+
+**Dependencies**: All bundled sub-rules
+**Stakeholders**: All AI interactions, Development team

.cursor/rules/meta_documentation.mdc

@@ -10,6 +10,44 @@ This meta-rule bundles documentation-related rules to create comprehensive,
 educational documentation that increases human competence rather than just
 providing technical descriptions.
 
+## Workflow Constraints
+
+**This meta-rule enforces DOCUMENTATION MODE for all bundled sub-rules:**
+
+```json
+{
+  "workflowMode": "documentation",
+  "constraints": {
+    "mode": "writing_only",
+    "allowed": ["write", "edit", "format", "structure", "review"],
+    "forbidden": ["implement", "code", "build", "deploy"]
+  }
+}
+```
+
+**All bundled sub-rules automatically inherit these constraints.**
+
+## Workflow State Update
+
+**When this meta-rule is invoked, update the workflow state file:**
+
+```json
+{
+  "currentMode": "documentation",
+  "lastInvoked": "meta_documentation.mdc",
+  "timestamp": "2025-01-27T15:30:00Z",
+  "constraints": {
+    "mode": "writing_only",
+    "allowed": ["write", "edit", "format", "structure", "review"],
+    "forbidden": ["implement", "code", "build", "deploy"]
+  }
+}
+```
+
+**State File Location**: `.cursor/rules/.workflow_state.json`
+
+**This enables the core always-on rule to enforce documentation mode constraints.**
+
 ## When to Use
 
 **Use this meta-rule when**:

.cursor/rules/meta_feature_implementation.mdc

@@ -10,6 +10,45 @@ This meta-rule bundles all the rules needed for building features with
 proper architecture and cross-platform support. Use this when implementing
 planned features or refactoring existing code.
 
+## Workflow Constraints
+
+**This meta-rule enforces IMPLEMENTATION MODE for all bundled sub-rules:**
+
+```json
+{
+  "workflowMode": "implementation",
+  "constraints": {
+    "mode": "development",
+    "allowed": ["code", "build", "test", "refactor", "deploy"],
+    "required": "planning_complete_before_implementation"
+  }
+}
+```
+
+**All bundled sub-rules automatically inherit these constraints.**
+
+## Workflow State Update
+
+**When this meta-rule is invoked, update the workflow state file:**
+
+```json
+{
+  "currentMode": "implementation",
+  "lastInvoked": "meta_feature_implementation.mdc",
+  "timestamp": "2025-01-27T15:30:00Z",
+  "constraints": {
+    "mode": "development",
+    "allowed": ["code", "build", "test", "refactor", "deploy"],
+    "forbidden": [],
+    "required": "planning_complete_before_implementation"
+  }
+}
+```
+
+**State File Location**: `.cursor/rules/.workflow_state.json`
+
+**This enables the core always-on rule to enforce implementation mode constraints.**
+
 ## When to Use
 
 - **Feature Development**: Building new features from planning

.cursor/rules/meta_feature_planning.mdc

@@ -10,6 +10,44 @@ This meta-rule bundles all the rules needed for comprehensive feature planning
 across all platforms. Use this when starting any new feature development,
 planning sprints, or estimating work effort.
 
+## Workflow Constraints
+
+**This meta-rule enforces PLANNING MODE for all bundled sub-rules:**
+
+```json
+{
+  "workflowMode": "planning",
+  "constraints": {
+    "mode": "design_only",
+    "allowed": ["analyze", "plan", "design", "estimate", "document"],
+    "forbidden": ["implement", "code", "build", "test", "deploy"]
+  }
+}
+```
+
+**All bundled sub-rules automatically inherit these constraints.**
+
+## Workflow State Update
+
+**When this meta-rule is invoked, update the workflow state file:**
+
+```json
+{
+  "currentMode": "planning",
+  "lastInvoked": "meta_feature_planning.mdc",
+  "timestamp": "2025-01-27T15:30:00Z",
+  "constraints": {
+    "mode": "design_only",
+    "allowed": ["analyze", "plan", "design", "estimate", "document"],
+    "forbidden": ["implement", "code", "build", "test", "deploy"]
+  }
+}
+```
+
+**State File Location**: `.cursor/rules/.workflow_state.json`
+
+**This enables the core always-on rule to enforce planning mode constraints.**
+
 ## When to Use
 
 - **New Feature Development**: Planning features from concept to implementation

.cursor/rules/meta_research.mdc

@@ -11,6 +11,44 @@ systematic investigation, analysis, evidence collection, or research tasks. It p
 a comprehensive framework for thorough, methodical research workflows that produce
 actionable insights and evidence-based conclusions.
 
+## Workflow Constraints
+
+**This meta-rule enforces RESEARCH MODE for all bundled sub-rules:**
+
+```json
+{
+  "workflowMode": "research",
+  "constraints": {
+    "mode": "investigation",
+    "allowed": ["read", "search", "analyze", "plan"],
+    "forbidden": ["modify", "create", "build", "commit"]
+  }
+}
+```
+
+**All bundled sub-rules automatically inherit these constraints.**
+
+## Workflow State Update
+
+**When this meta-rule is invoked, update the workflow state file:**
+
+```json
+{
+  "currentMode": "research",
+  "lastInvoked": "meta_research.mdc",
+  "timestamp": "2025-01-27T15:30:00Z",
+  "constraints": {
+    "mode": "investigation",
+    "allowed": ["read", "search", "analyze", "plan"],
+    "forbidden": ["modify", "create", "build", "commit"]
+  }
+}
+```
+
+**State File Location**: `.cursor/rules/.workflow_state.json`
+
+**This enables the core always-on rule to enforce research mode constraints.**
+
 ## When to Use
 
 **RESEARCH TASKS** - Apply this meta-rule when:

.cursor/rules/playwright-test-investigation.mdc

@@ -0,0 +1,356 @@
+---
+description: when working with playwright tests either generating them or using them to test code
+alwaysApply: false
+---
+# Playwright Test Investigation — Harbor Pilot Directive
+
+**Author**: Matthew Raymer  
+**Date**: 2025-08-21T14:22Z  
+**Status**: 🎯 **ACTIVE** - Playwright test debugging guidelines
+
+## Objective
+Provide systematic approach for investigating Playwright test failures with focus on UI element conflicts, timing issues, and selector ambiguity.
+
+## Context & Scope
+- **Audience**: Developers debugging Playwright test failures
+- **In scope**: Test failure analysis, selector conflicts, UI state investigation, timing issues
+- **Out of scope**: Test writing best practices, CI/CD configuration
+
+## Artifacts & Links
+- Test results: `test-results/` directory
+- Error context: `error-context.md` files with page snapshots
+- Trace files: `trace.zip` files for failed tests
+- HTML reports: Interactive test reports with screenshots
+
+## Environment & Preconditions
+- OS/Runtime: Linux/Windows/macOS with Node.js
+- Versions: Playwright test framework, browser drivers
+- Services: Local test server (localhost:8080), test data setup
+- Auth mode: None required for test investigation
+
+## Architecture / Process Overview
+Playwright test investigation follows a systematic diagnostic workflow that leverages built-in debugging tools and error context analysis.
+
+```mermaid
+flowchart TD
+    A[Test Failure] --> B[Check Error Context]
+    B --> C[Analyze Page Snapshot]
+    C --> D[Identify UI Conflicts]
+    D --> E[Check Trace Files]
+    E --> F[Verify Selector Uniqueness]
+    F --> G[Test Selector Fixes]
+    G --> H[Document Root Cause]
+    
+    B --> I[Check Test Results Directory]
+    I --> J[Locate Failed Test Results]
+    J --> K[Extract Error Details]
+    
+    D --> L[Multiple Alerts?]
+    L --> M[Button Text Conflicts?]
+    M --> N[Timing Issues?]
+    
+    E --> O[Use Trace Viewer]
+    O --> P[Analyze Action Sequence]
+    P --> Q[Identify Failure Point]
+```
+
+## Interfaces & Contracts
+
+### Test Results Structure
+| Component | Format | Content | Validation |
+|---|---|---|---|
+| Error Context | Markdown | Page snapshot in YAML | Verify DOM state matches test expectations |
+| Trace Files | ZIP archive | Detailed execution trace | Use `npx playwright show-trace` |
+| HTML Reports | Interactive HTML | Screenshots, traces, logs | Check browser for full report |
+| JSON Results | JSON | Machine-readable results | Parse for automated analysis |
+
+### Investigation Commands
+| Step | Command | Expected Output | Notes |
+|---|---|---|---|
+| Locate failed tests | `find test-results -name "*test-name*"` | Test result directories | Use exact test name patterns |
+| Check error context | `cat test-results/*/error-context.md` | Page snapshots | Look for UI state conflicts |
+| View traces | `npx playwright show-trace trace.zip` | Interactive trace viewer | Analyze exact failure sequence |
+
+## Repro: End-to-End Investigation Procedure
+
+### 1. Locate Failed Test Results
+```bash
+# Find all results for a specific test
+find test-results -name "*test-name*" -type d
+
+# Check for error context files
+find test-results -name "error-context.md" | head -5
+```
+
+### 2. Analyze Error Context
+```bash
+# Read error context for specific test
+cat test-results/test-name-test-description-browser/error-context.md
+
+# Look for UI conflicts in page snapshot
+grep -A 10 -B 5 "button.*Yes\|button.*No" test-results/*/error-context.md
+```
+
+### 3. Check Trace Files
+```bash
+# List available trace files
+find test-results -name "*.zip" | grep trace
+
+# View trace in browser
+npx playwright show-trace test-results/test-name/trace.zip
+```
+
+### 4. Investigate Selector Issues
+```typescript
+// Check for multiple elements with same text
+await page.locator('button:has-text("Yes")').count(); // Should be 1
+
+// Use more specific selectors
+await page.locator('div[role="alert"]:has-text("Register") button:has-text("Yes")').click();
+```
+
+## What Works (Evidence)
+- ✅ **Error context files** provide page snapshots showing exact DOM state at failure  
+  - **Time**: 2025-08-21T14:22Z  
+  - **Evidence**: `test-results/60-new-activity-New-offers-for-another-user-chromium/error-context.md` shows both alerts visible  
+  - **Verify at**: Error context files in test results directory
+
+- ✅ **Trace files** capture detailed execution sequence for failed tests  
+  - **Time**: 2025-08-21T14:22Z  
+  - **Evidence**: `trace.zip` files available for all failed tests  
+  - **Verify at**: Use `npx playwright show-trace <filename>`
+
+- ✅ **Page snapshots** reveal UI conflicts like multiple alerts with duplicate button text  
+  - **Time**: 2025-08-21T14:22Z  
+  - **Evidence**: YAML snapshots show registration + export alerts simultaneously  
+  - **Verify at**: Error context markdown files
+
+## What Doesn't (Evidence & Hypotheses)
+- ❌ **Generic selectors** fail with multiple similar elements at `test-playwright/testUtils.ts:161`  
+  - **Time**: 2025-08-21T14:22Z  
+  - **Evidence**: `button:has-text("Yes")` matches both "Yes" and "Yes, Export Data"  
+  - **Hypothesis**: Selector ambiguity due to multiple alerts with conflicting button text  
+  - **Next probe**: Use more specific selectors or dismiss alerts sequentially
+
+- ❌ **Timing-dependent tests** fail due to alert stacking at `src/views/ContactsView.vue:860,1283`  
+  - **Time**: 2025-08-21T14:22Z  
+  - **Evidence**: Both alerts use identical 1000ms delays, ensuring simultaneous display  
+  - **Hypothesis**: Race condition between alert displays creates UI conflicts  
+  - **Next probe**: Implement alert queuing or prevent overlapping alerts
+
+## Risks, Limits, Assumptions
+- **Trace file size**: Large trace files may impact storage and analysis time
+- **Browser compatibility**: Trace viewer requires specific browser support
+- **Test isolation**: Shared state between tests may affect investigation results
+- **Timing sensitivity**: Tests may pass/fail based on system performance
+
+## Next Steps
+| Owner | Task | Exit Criteria | Target Date (UTC) |
+|---|---|---|---|
+| Development Team | Fix test selectors for multiple alerts | All tests pass consistently | 2025-08-22 |
+| Development Team | Implement alert queuing system | No overlapping alerts with conflicting buttons | 2025-08-25 |
+| Development Team | Add test IDs to alert buttons | Unique selectors for all UI elements | 2025-08-28 |
+
+## References
+- [Playwright Trace Viewer Documentation](https://playwright.dev/docs/trace-viewer)
+- [Playwright Test Results](https://playwright.dev/docs/test-reporters)
+- [Test Investigation Workflow](./research_diagnostic.mdc)
+
+## Competence Hooks
+- **Why this works**: Systematic investigation leverages Playwright's built-in debugging tools to identify root causes
+- **Common pitfalls**: Generic selectors fail with multiple similar elements; timing issues create race conditions; alert stacking causes UI conflicts
+- **Next skill unlock**: Implement unique test IDs and handle alert dismissal order in test flows
+- **Teach-back**: "How would you investigate a Playwright test failure using error context, trace files, and page snapshots?"
+
+## Collaboration Hooks
+- **Reviewers**: QA team, test automation engineers
+- **Sign-off checklist**: Error context analyzed, trace files reviewed, root cause identified, fix implemented and tested
+
+## Assumptions & Limits
+- Test results directory structure follows Playwright conventions
+- Trace files are enabled in configuration (`trace: "retain-on-failure"`)
+- Error context files contain valid YAML page snapshots
+- Browser environment supports trace viewer functionality
+
+---
+
+**Status**: Active investigation directive  
+**Priority**: High  
+**Maintainer**: Development team  
+**Next Review**: 2025-09-21
+# Playwright Test Investigation — Harbor Pilot Directive
+
+**Author**: Matthew Raymer  
+**Date**: 2025-08-21T14:22Z  
+**Status**: 🎯 **ACTIVE** - Playwright test debugging guidelines
+
+## Objective
+Provide systematic approach for investigating Playwright test failures with focus on UI element conflicts, timing issues, and selector ambiguity.
+
+## Context & Scope
+- **Audience**: Developers debugging Playwright test failures
+- **In scope**: Test failure analysis, selector conflicts, UI state investigation, timing issues
+- **Out of scope**: Test writing best practices, CI/CD configuration
+
+## Artifacts & Links
+- Test results: `test-results/` directory
+- Error context: `error-context.md` files with page snapshots
+- Trace files: `trace.zip` files for failed tests
+- HTML reports: Interactive test reports with screenshots
+
+## Environment & Preconditions
+- OS/Runtime: Linux/Windows/macOS with Node.js
+- Versions: Playwright test framework, browser drivers
+- Services: Local test server (localhost:8080), test data setup
+- Auth mode: None required for test investigation
+
+## Architecture / Process Overview
+Playwright test investigation follows a systematic diagnostic workflow that leverages built-in debugging tools and error context analysis.
+
+```mermaid
+flowchart TD
+    A[Test Failure] --> B[Check Error Context]
+    B --> C[Analyze Page Snapshot]
+    C --> D[Identify UI Conflicts]
+    D --> E[Check Trace Files]
+    E --> F[Verify Selector Uniqueness]
+    F --> G[Test Selector Fixes]
+    G --> H[Document Root Cause]
+    
+    B --> I[Check Test Results Directory]
+    I --> J[Locate Failed Test Results]
+    J --> K[Extract Error Details]
+    
+    D --> L[Multiple Alerts?]
+    L --> M[Button Text Conflicts?]
+    M --> N[Timing Issues?]
+    
+    E --> O[Use Trace Viewer]
+    O --> P[Analyze Action Sequence]
+    P --> Q[Identify Failure Point]
+```
+
+## Interfaces & Contracts
+
+### Test Results Structure
+| Component | Format | Content | Validation |
+|---|---|---|---|
+| Error Context | Markdown | Page snapshot in YAML | Verify DOM state matches test expectations |
+| Trace Files | ZIP archive | Detailed execution trace | Use `npx playwright show-trace` |
+| HTML Reports | Interactive HTML | Screenshots, traces, logs | Check browser for full report |
+| JSON Results | JSON | Machine-readable results | Parse for automated analysis |
+
+### Investigation Commands
+| Step | Command | Expected Output | Notes |
+|---|---|---|---|
+| Locate failed tests | `find test-results -name "*test-name*"` | Test result directories | Use exact test name patterns |
+| Check error context | `cat test-results/*/error-context.md` | Page snapshots | Look for UI state conflicts |
+| View traces | `npx playwright show-trace trace.zip` | Interactive trace viewer | Analyze exact failure sequence |
+
+## Repro: End-to-End Investigation Procedure
+
+### 1. Locate Failed Test Results
+```bash
+# Find all results for a specific test
+find test-results -name "*test-name*" -type d
+
+# Check for error context files
+find test-results -name "error-context.md" | head -5
+```
+
+### 2. Analyze Error Context
+```bash
+# Read error context for specific test
+cat test-results/test-name-test-description-browser/error-context.md
+
+# Look for UI conflicts in page snapshot
+grep -A 10 -B 5 "button.*Yes\|button.*No" test-results/*/error-context.md
+```
+
+### 3. Check Trace Files
+```bash
+# List available trace files
+find test-results -name "*.zip" | grep trace
+
+# View trace in browser
+npx playwright show-trace test-results/test-name/trace.zip
+```
+
+### 4. Investigate Selector Issues
+```typescript
+// Check for multiple elements with same text
+await page.locator('button:has-text("Yes")').count(); // Should be 1
+
+// Use more specific selectors
+await page.locator('div[role="alert"]:has-text("Register") button:has-text("Yes")').click();
+```
+
+## What Works (Evidence)
+- ✅ **Error context files** provide page snapshots showing exact DOM state at failure  
+  - **Time**: 2025-08-21T14:22Z  
+  - **Evidence**: `test-results/60-new-activity-New-offers-for-another-user-chromium/error-context.md` shows both alerts visible  
+  - **Verify at**: Error context files in test results directory
+
+- ✅ **Trace files** capture detailed execution sequence for failed tests  
+  - **Time**: 2025-08-21T14:22Z  
+  - **Evidence**: `trace.zip` files available for all failed tests  
+  - **Verify at**: Use `npx playwright show-trace <filename>`
+
+- ✅ **Page snapshots** reveal UI conflicts like multiple alerts with duplicate button text  
+  - **Time**: 2025-08-21T14:22Z  
+  - **Evidence**: YAML snapshots show registration + export alerts simultaneously  
+  - **Verify at**: Error context markdown files
+
+## What Doesn't (Evidence & Hypotheses)
+- ❌ **Generic selectors** fail with multiple similar elements at `test-playwright/testUtils.ts:161`  
+  - **Time**: 2025-08-21T14:22Z  
+  - **Evidence**: `button:has-text("Yes")` matches both "Yes" and "Yes, Export Data"  
+  - **Hypothesis**: Selector ambiguity due to multiple alerts with conflicting button text  
+  - **Next probe**: Use more specific selectors or dismiss alerts sequentially
+
+- ❌ **Timing-dependent tests** fail due to alert stacking at `src/views/ContactsView.vue:860,1283`  
+  - **Time**: 2025-08-21T14:22Z  
+  - **Evidence**: Both alerts use identical 1000ms delays, ensuring simultaneous display  
+  - **Hypothesis**: Race condition between alert displays creates UI conflicts  
+  - **Next probe**: Implement alert queuing or prevent overlapping alerts
+
+## Risks, Limits, Assumptions
+- **Trace file size**: Large trace files may impact storage and analysis time
+- **Browser compatibility**: Trace viewer requires specific browser support
+- **Test isolation**: Shared state between tests may affect investigation results
+- **Timing sensitivity**: Tests may pass/fail based on system performance
+
+## Next Steps
+| Owner | Task | Exit Criteria | Target Date (UTC) |
+|---|---|---|---|
+| Development Team | Fix test selectors for multiple alerts | All tests pass consistently | 2025-08-22 |
+| Development Team | Implement alert queuing system | No overlapping alerts with conflicting buttons | 2025-08-25 |
+| Development Team | Add test IDs to alert buttons | Unique selectors for all UI elements | 2025-08-28 |
+
+## References
+- [Playwright Trace Viewer Documentation](https://playwright.dev/docs/trace-viewer)
+- [Playwright Test Results](https://playwright.dev/docs/test-reporters)
+- [Test Investigation Workflow](./research_diagnostic.mdc)
+
+## Competence Hooks
+- **Why this works**: Systematic investigation leverages Playwright's built-in debugging tools to identify root causes
+- **Common pitfalls**: Generic selectors fail with multiple similar elements; timing issues create race conditions; alert stacking causes UI conflicts
+- **Next skill unlock**: Implement unique test IDs and handle alert dismissal order in test flows
+- **Teach-back**: "How would you investigate a Playwright test failure using error context, trace files, and page snapshots?"
+
+## Collaboration Hooks
+- **Reviewers**: QA team, test automation engineers
+- **Sign-off checklist**: Error context analyzed, trace files reviewed, root cause identified, fix implemented and tested
+
+## Assumptions & Limits
+- Test results directory structure follows Playwright conventions
+- Trace files are enabled in configuration (`trace: "retain-on-failure"`)
+- Error context files contain valid YAML page snapshots
+- Browser environment supports trace viewer functionality
+
+---
+
+**Status**: Active investigation directive  
+**Priority**: High  
+**Maintainer**: Development team  
+**Next Review**: 2025-09-21

.gitignore

@@ -54,6 +54,9 @@ build_logs/
 # Guard feedback logs (for continuous improvement analysis)
 .guard-feedback.log
 
+# Workflow state file (contains dynamic state, not version controlled)
+.cursor/rules/.workflow_state.json
+
 # PWA icon files generated by capacitor-assets
 icons
 

BUILDING.md

@@ -251,7 +251,7 @@ npm run build:web:dev               # Start development server with hot reload
 npm run build:web                   # Development build (starts dev server with hot reload)
 npm run build:web:test              # Test environment build (optimized for testing)
 npm run build:web:prod              # Production build (optimized for production)
-npm run build:web:serve             # Build and serve locally (builds then serves)
+npm run build:web:serve             # Build and serve locally for production testing
 
 # Docker builds
 npm run build:web:docker            # Development build with Docker containerization
@@ -269,6 +269,12 @@ Start the development server using `npm run build:web:dev` or `npm run build:web
 2. The built files will be in the `dist` directory
 3. To test the production build locally, use `npm run build:web:serve` (builds then serves)
 
+**Why Use `serve`?**
+- **Production Testing**: Test your optimized production build locally before deployment
+- **SPA Routing Validation**: Verify deep linking and navigation work correctly (handles routes like `/discover`, `/account`)
+- **Performance Testing**: Test the minified and optimized build locally
+- **Deployment Validation**: Ensure built files work correctly when served by a real HTTP server
+
 You'll likely want to use test locations for the Endorser & image & partner servers; see "DEFAULT_ENDORSER_API_SERVER" & "DEFAULT_IMAGE_API_SERVER" & "DEFAULT_PARTNER_API_SERVER" below.
 
 ### Web Build Script Details
@@ -288,7 +294,7 @@ All web build commands use the `./scripts/build-web.sh` script, which provides:
 - **Clean Build**: Removes previous `dist/` directory
 - **Vite Build**: Executes `npx vite build --config vite.config.web.mts`
 - **Docker Support**: Optional Docker containerization
-- **Local Serving**: Built-in HTTP server for testing builds
+- **Local Serving**: Built-in HTTP server for testing builds with SPA routing support
 
 **Direct Script Usage:**
 
@@ -324,6 +330,25 @@ All web build commands use the `./scripts/build-web.sh` script, which provides:
 - `5` - Serve command failed
 - `6` - Invalid build mode
 
+### Local Serving with `serve`
+
+The `serve` functionality provides a local HTTP server for testing production builds:
+
+**What It Does:**
+1. **Builds** the application using Vite
+2. **Serves** the built files from the `dist/` directory
+3. **Handles SPA Routing** - serves `index.html` for all routes (fixes 404s on `/discover`, `/account`, etc.)
+
+**Server Options:**
+- **Primary**: `npx serve -s dist -l 8080` (recommended - full SPA support)
+- **Fallback**: Python HTTP server (limited SPA routing support)
+
+**Use Cases:**
+- Testing production builds before deployment
+- Validating SPA routing behavior
+- Performance testing of optimized builds
+- Debugging production build issues locally
+
 ### Compile and minify for test & production
 
 - If there are DB changes: before updating the test server, open browser(s) with
@@ -592,7 +617,8 @@ The Electron build process follows a multi-stage approach:
 #### **Stage 2: Capacitor Sync**
 
 - Copies web assets to Electron app directory
-- Syncs Capacitor configuration and plugins
+- Uses Electron-specific Capacitor configuration (not copied from main config)
+- Syncs Capacitor plugins for Electron platform
 - Prepares native module bindings
 
 #### **Stage 3: TypeScript Compile**
@@ -2743,6 +2769,45 @@ configuration files in the repository.
 
 ---
 
+### 2025-08-26 - Capacitor Plugin Additions
+
+#### New Capacitor Plugins Added
+- **Added**: `@capacitor/clipboard` v6.0.2 - Clipboard functionality for mobile platforms
+  - **Purpose**: Enable copy/paste operations on mobile devices
+  - **Platforms**: iOS and Android
+  - **Features**: Read/write clipboard content, text handling
+  - **Integration**: Automatically included in mobile builds
+
+- **Added**: `@capacitor/status-bar` v6.0.2 - Status bar management for mobile platforms
+  - **Purpose**: Control mobile device status bar appearance and behavior
+  - **Platforms**: iOS and Android
+  - **Features**: Status bar styling, visibility control, color management
+  - **Integration**: Automatically included in mobile builds
+
+#### Android Build System Updates
+- **Modified**: `android/capacitor.settings.gradle` - Added new plugin project includes
+  - **Added**: `:capacitor-clipboard` project directory mapping
+  - **Added**: `:capacitor-status-bar` project directory mapping
+  - **Impact**: New plugins now properly integrated into Android build process
+
+#### Package Dependencies
+- **Updated**: `package.json` - Added new Capacitor plugin dependencies
+- **Updated**: `package-lock.json` - Locked dependency versions for consistency
+- **Version**: All new plugins use Capacitor 6.x compatible versions
+
+#### Build Process Impact
+- **No Breaking Changes**: Existing build commands continue to work unchanged
+- **Enhanced Mobile Features**: New clipboard and status bar capabilities available
+- **Automatic Integration**: Plugins automatically included in mobile builds
+- **Platform Support**: Both iOS and Android builds now include new functionality
+
+#### Testing Requirements
+- **Mobile Builds**: Verify new plugins integrate correctly in iOS and Android builds
+- **Functionality**: Test clipboard operations and status bar management on devices
+- **Fallback**: Ensure graceful degradation when plugins are unavailable
+
+---
+
 **Note**: This documentation is maintained alongside the build system. For the
 most up-to-date information, refer to the actual script files and Vite
 configuration files in the repository.

README.md

@@ -18,7 +18,7 @@ npm install
 npm run build:web:serve -- --test
 ```
 
-To be able to make submissions: go to "profile" (bottom left), go to the bottom and expand "Show Advanced Settings", go to the bottom and to the "Test Page", and finally "Become User 0" to see all the functionality.
+To be able to take action on the platform: go to [the test page](http://localhost:8080/test) and click "Become User 0".
 
 See [BUILDING.md](BUILDING.md) for comprehensive build instructions for all platforms (Web, Electron, iOS, Android, Docker).
 

android/app/capacitor.build.gradle

@@ -16,6 +16,7 @@ dependencies {
     implementation project(':capacitor-clipboard')
     implementation project(':capacitor-filesystem')
     implementation project(':capacitor-share')
+    implementation project(':capacitor-status-bar')
     implementation project(':capawesome-capacitor-file-picker')
 
 }

android/app/src/main/AndroidManifest.xml

@@ -14,6 +14,7 @@
             android:label="@string/title_activity_main"
             android:launchMode="singleTask"
             android:screenOrientation="portrait"
+            android:windowSoftInputMode="adjustResize"
             android:theme="@style/AppTheme.NoActionBarLaunch">
             <intent-filter>
                 <action android:name="android.intent.action.MAIN" />

android/app/src/main/assets/capacitor.plugins.json

@@ -27,6 +27,10 @@
 		"pkg": "@capacitor/share",
 		"classpath": "com.capacitorjs.plugins.share.SharePlugin"
 	},
+	{
+		"pkg": "@capacitor/status-bar",
+		"classpath": "com.capacitorjs.plugins.statusbar.StatusBarPlugin"
+	},
 	{
 		"pkg": "@capawesome/capacitor-file-picker",
 		"classpath": "io.capawesome.capacitorjs.plugins.filepicker.FilePickerPlugin"

android/app/src/main/java/app/timesafari/MainActivity.java

@@ -1,7 +1,16 @@
 package app.timesafari;
 
 import android.os.Bundle;
+import android.view.View;
+import android.view.WindowManager;
+import android.view.WindowInsetsController;
+import android.view.WindowInsets;
+import android.os.Build;
+import android.webkit.WebView;
+import android.webkit.WebSettings;
+import android.webkit.WebViewClient;
 import com.getcapacitor.BridgeActivity;
+import app.timesafari.safearea.SafeAreaPlugin;
 //import com.getcapacitor.community.sqlite.SQLite;
 
 public class MainActivity extends BridgeActivity {
@@ -9,7 +18,39 @@ public class MainActivity extends BridgeActivity {
     public void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         
+        // Enable edge-to-edge display for modern Android
+        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.R) {
+            // Android 11+ (API 30+)
+            getWindow().setDecorFitsSystemWindows(false);
+            
+            // Set up system UI visibility for edge-to-edge
+            WindowInsetsController controller = getWindow().getInsetsController();
+            if (controller != null) {
+                controller.setSystemBarsAppearance(
+                    WindowInsetsController.APPEARANCE_LIGHT_STATUS_BARS | 
+                    WindowInsetsController.APPEARANCE_LIGHT_NAVIGATION_BARS,
+                    WindowInsetsController.APPEARANCE_LIGHT_STATUS_BARS | 
+                    WindowInsetsController.APPEARANCE_LIGHT_NAVIGATION_BARS
+                );
+                controller.setSystemBarsBehavior(WindowInsetsController.BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE);
+            }
+        } else {
+            // Legacy Android (API 21-29)
+            getWindow().getDecorView().setSystemUiVisibility(
+                View.SYSTEM_UI_FLAG_LAYOUT_STABLE |
+                View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION |
+                View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN |
+                View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR |
+                View.SYSTEM_UI_FLAG_LIGHT_NAVIGATION_BAR
+            );
+        }
+        
+        // Register SafeArea plugin
+        registerPlugin(SafeAreaPlugin.class);
+        
         // Initialize SQLite
         //registerPlugin(SQLite.class);
     }
+    
+
 } 

android/app/src/main/java/app/timesafari/safearea/SafeAreaPlugin.java

@@ -0,0 +1,44 @@
+package app.timesafari.safearea;
+
+import android.os.Build;
+import android.view.WindowInsets;
+import com.getcapacitor.JSObject;
+import com.getcapacitor.Plugin;
+import com.getcapacitor.PluginCall;
+import com.getcapacitor.PluginMethod;
+import com.getcapacitor.annotation.CapacitorPlugin;
+
+@CapacitorPlugin(name = "SafeArea")
+public class SafeAreaPlugin extends Plugin {
+
+    @PluginMethod
+    public void getSafeAreaInsets(PluginCall call) {
+        JSObject result = new JSObject();
+        
+        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.R) {
+            WindowInsets insets = getActivity().getWindow().getDecorView().getRootWindowInsets();
+            if (insets != null) {
+                int top = insets.getInsets(WindowInsets.Type.statusBars()).top;
+                int bottom = insets.getInsets(WindowInsets.Type.navigationBars()).bottom;
+                int left = insets.getInsets(WindowInsets.Type.systemBars()).left;
+                int right = insets.getInsets(WindowInsets.Type.systemBars()).right;
+                
+                result.put("top", top);
+                result.put("bottom", bottom);
+                result.put("left", left);
+                result.put("right", right);
+                
+                call.resolve(result);
+                return;
+            }
+        }
+        
+        // Fallback values
+        result.put("top", 0);
+        result.put("bottom", 0);
+        result.put("left", 0);
+        result.put("right", 0);
+        
+        call.resolve(result);
+    }
+}

android/app/src/main/res/values/styles.xml

@@ -18,5 +18,14 @@
 
     <style name="AppTheme.NoActionBarLaunch" parent="Theme.SplashScreen">
         <item name="android:background">@drawable/splash</item>
+        <item name="android:windowTranslucentStatus">false</item>
+        <item name="android:windowTranslucentNavigation">false</item>
+        <item name="android:windowDrawsSystemBarBackgrounds">true</item>
+        <item name="android:statusBarColor">@android:color/transparent</item>
+        <item name="android:navigationBarColor">@android:color/transparent</item>
+        <item name="android:windowLightStatusBar">true</item>
+        <item name="android:windowLightNavigationBar">true</item>
+        <item name="android:enforceStatusBarContrast">false</item>
+        <item name="android:enforceNavigationBarContrast">false</item>
     </style>
 </resources>

android/capacitor.settings.gradle

@@ -23,5 +23,8 @@ project(':capacitor-filesystem').projectDir = new File('../node_modules/@capacit
 include ':capacitor-share'
 project(':capacitor-share').projectDir = new File('../node_modules/@capacitor/share/android')
 
+include ':capacitor-status-bar'
+project(':capacitor-status-bar').projectDir = new File('../node_modules/@capacitor/status-bar/android')
+
 include ':capawesome-capacitor-file-picker'
 project(':capawesome-capacitor-file-picker').projectDir = new File('../node_modules/@capawesome/capacitor-file-picker/android')

doc/meta_rule_usage_guide.md

@@ -60,13 +60,49 @@ For complex tasks, you might combine multiple meta-rules:
 meta_core_always_on + meta_research + meta_bug_diagnosis
 ```
 
+## Workflow Flexibility: Phase-Based, Not Waterfall
+
+**Important**: Meta-rules represent **workflow phases**, not a rigid sequence. You can:
+
+### **Jump Between Phases Freely**
+- **Start with diagnosis** if you already know the problem
+- **Go back to research** if your fix reveals new issues  
+- **Switch to planning** mid-implementation if scope changes
+- **Document at any phase** - not just at the end
+
+### **Mode Switching by Invoking Meta-Rules**
+Each meta-rule invocation **automatically switches your workflow mode**:
+
+```
+Research Mode → Invoke @meta_bug_diagnosis → Diagnosis Mode
+Diagnosis Mode → Invoke @meta_bug_fixing → Fixing Mode
+Planning Mode → Invoke @meta_feature_implementation → Implementation Mode
+```
+
+### **Phase Constraints, Not Sequence Constraints**
+- **Within each phase**: Clear constraints on what you can/cannot do
+- **Between phases**: Complete freedom to move as needed
+- **No forced order**: Choose the phase that matches your current need
+
+### **Example of Flexible Workflow**
+```
+1. Start with @meta_research (investigation mode)
+2. Jump to @meta_bug_diagnosis (diagnosis mode) 
+3. Realize you need more research → back to @meta_research
+4. Complete diagnosis → @meta_bug_fixing (implementation mode)
+5. Find new issues → back to @meta_bug_diagnosis
+6. Complete fix → @meta_documentation (documentation mode)
+```
+
+**The "sticky" part means**: Each phase has clear boundaries, but you control when to enter/exit phases.
+
 ## Practical Usage Examples
 
-### **Example 1: Bug Investigation**
+### **Example 1: Bug Investigation (Flexible Flow)**
 
 **Scenario**: User reports that the contact list isn't loading properly
 
-**Meta-Rule Selection**:
+**Initial Meta-Rule Selection**:
 ```
 meta_core_always_on + meta_research + meta_bug_diagnosis
 ```
@@ -76,13 +112,15 @@ meta_core_always_on + meta_research + meta_bug_diagnosis
 - **Research**: Systematic investigation methodology, evidence collection
 - **Bug Diagnosis**: Defect analysis framework, root cause identification
 
-**Workflow**:
+**Flexible Workflow**:
 1. Apply core always-on for foundation
 2. Use research meta-rule for systematic investigation
-3. Apply bug diagnosis for defect analysis
+3. Switch to bug diagnosis when you have enough evidence
-4. Follow the bundled workflow automatically
+4. **Can go back to research** if diagnosis reveals new questions
+5. **Can jump to bug fixing** if root cause is obvious
+6. **Can document findings** at any phase
 
-### **Example 2: Feature Development**
+### **Example 2: Feature Development (Iterative Flow)**
 
 **Scenario**: Building a new contact search feature
 
@@ -96,12 +134,15 @@ meta_core_always_on + meta_feature_planning + meta_feature_implementation
 - **Feature Planning**: Requirements analysis, architecture planning
 - **Feature Implementation**: Development workflow, testing strategy
 
-**Workflow**:
+**Iterative Workflow**:
 1. Start with core always-on
 2. Use feature planning for design and requirements
 3. Switch to feature implementation for coding and testing
+4. **Can return to planning** if implementation reveals design issues
+5. **Can go back to research** if you need to investigate alternatives
+6. **Can document progress** throughout the process
 
-### **Example 3: Documentation Creation**
+### **Example 3: Documentation Creation (Parallel Flow)**
 
 **Scenario**: Writing a migration guide for the new database system
 
@@ -114,10 +155,13 @@ meta_core_always_on + meta_documentation
 - **Core Always-On**: Foundation and context
 - **Documentation**: Educational focus, templates, quality standards
 
-**Workflow**:
+**Parallel Workflow**:
 1. Apply core always-on for foundation
 2. Use documentation meta-rule for educational content creation
-3. Follow educational templates and quality standards
+3. **Can research** while documenting if you need more information
+4. **Can plan** documentation structure as you write
+5. **Can implement** examples or code snippets as needed
+6. Follow educational templates and quality standards
 
 ## Meta-Rule Application Process
 

doc/seed-phrase-reminder-implementation.md

@@ -0,0 +1,181 @@
+# Seed Phrase Backup Reminder Implementation
+
+## Overview
+
+This implementation adds a modal dialog that reminds users to back up their seed phrase if they haven't done so yet. The reminder appears after specific user actions and includes a 24-hour cooldown to avoid being too intrusive.
+
+## Features
+
+- **Modal Dialog**: Uses the existing notification group modal system from `App.vue`
+- **Smart Timing**: Only shows when `hasBackedUpSeed = false`
+- **24-Hour Cooldown**: Uses localStorage to prevent showing more than once per day
+- **Action-Based Triggers**: Shows after specific user actions
+- **User Choice**: "Backup Identifier Seed" or "Remind me Later" options
+
+## Implementation Details
+
+### Core Utility (`src/utils/seedPhraseReminder.ts`)
+
+The main utility provides:
+
+- `shouldShowSeedReminder(hasBackedUpSeed)`: Checks if reminder should be shown
+- `markSeedReminderShown()`: Updates localStorage timestamp
+- `createSeedReminderNotification()`: Creates the modal configuration
+- `showSeedPhraseReminder(hasBackedUpSeed, notifyFunction)`: Main function to show reminder
+
+### Trigger Points
+
+The reminder is shown after these user actions:
+
+**Note**: The reminder is triggered by **claim creation** actions, not claim confirmations. This focuses on when users are actively creating new content rather than just confirming existing claims.
+
+1. **Profile Saving** (`AccountViewView.vue`)
+   - After clicking "Save Profile" button
+   - Only when profile save is successful
+
+2. **Claim Creation** (Multiple views)
+   - `ClaimAddRawView.vue`: After submitting raw claims
+   - `GiftedDialog.vue`: After creating gifts/claims
+   - `GiftedDetailsView.vue`: After recording gifts/claims
+   - `OfferDialog.vue`: After creating offers
+
+3. **QR Code Views Exit**
+   - `ContactQRScanFullView.vue`: When exiting via back button
+   - `ContactQRScanShowView.vue`: When exiting via back button
+
+### Modal Configuration
+
+```typescript
+{
+  group: "modal",
+  type: "confirm",
+  title: "Backup Your Identifier Seed?",
+  text: "It looks like you haven't backed up your identifier seed yet. It's important to back it up as soon as possible to secure your identity.",
+  yesText: "Backup Identifier Seed",
+  noText: "Remind me Later",
+  onYes: () => navigate to /seed-backup,
+  onNo: () => mark as shown for 24 hours,
+  onCancel: () => mark as shown for 24 hours
+}
+```
+
+**Important**: The modal is configured with `timeout: -1` to ensure it stays open until the user explicitly interacts with one of the buttons. This prevents the dialog from closing automatically.
+
+### Cooldown Mechanism
+
+- **Storage Key**: `seedPhraseReminderLastShown`
+- **Cooldown Period**: 24 hours (24 * 60 * 60 * 1000 milliseconds)
+- **Implementation**: localStorage with timestamp comparison
+- **Fallback**: Shows reminder if timestamp is invalid or missing
+
+## User Experience
+
+### When Reminder Appears
+
+- User has not backed up their seed phrase (`hasBackedUpSeed = false`)
+- At least 24 hours have passed since last reminder
+- User performs one of the trigger actions
+- **1-second delay** after the success message to allow users to see the confirmation
+
+### User Options
+
+1. **"Backup Identifier Seed"**: Navigates to `/seed-backup` page
+2. **"Remind me Later"**: Dismisses and won't show again for 24 hours
+3. **Cancel/Close**: Same behavior as "Remind me Later"
+
+### Frequency Control
+
+- **First Time**: Always shows if user hasn't backed up
+- **Subsequent**: Only shows after 24-hour cooldown
+- **Automatic Reset**: When user completes seed backup (`hasBackedUpSeed = true`)
+
+## Technical Implementation
+
+### Error Handling
+
+- Graceful fallback if localStorage operations fail
+- Logging of errors for debugging
+- Non-blocking implementation (doesn't affect main functionality)
+
+### Integration Points
+
+- **Platform Service**: Uses `$accountSettings()` to check backup status
+- **Notification System**: Integrates with existing `$notify` system
+- **Router**: Uses `window.location.href` for navigation
+
+### Performance Considerations
+
+- Minimal localStorage operations
+- No blocking operations
+- Efficient timestamp comparisons
+- **Timing Behavior**: 1-second delay before showing reminder to improve user experience flow
+
+## Testing
+
+### Manual Testing Scenarios
+
+1. **First Time User**
+   - Create new account
+   - Perform trigger action (save profile, create claim, exit QR view)
+   - Verify reminder appears
+
+2. **Repeat User (Within 24h)**
+   - Perform trigger action
+   - Verify reminder does NOT appear
+
+3. **Repeat User (After 24h)**
+   - Wait 24+ hours
+   - Perform trigger action
+   - Verify reminder appears again
+
+4. **User Who Has Backed Up**
+   - Complete seed backup
+   - Perform trigger action
+   - Verify reminder does NOT appear
+
+5. **QR Code View Exit**
+   - Navigate to QR code view (full or show)
+   - Exit via back button
+   - Verify reminder appears (if conditions are met)
+
+### Browser Testing
+
+- Test localStorage functionality
+- Verify timestamp handling
+- Check navigation to seed backup page
+
+## Future Enhancements
+
+### Potential Improvements
+
+1. **Customizable Cooldown**: Allow users to set reminder frequency
+2. **Progressive Urgency**: Increase reminder frequency over time
+3. **Analytics**: Track reminder effectiveness and user response
+4. **A/B Testing**: Test different reminder messages and timing
+
+### Configuration Options
+
+- Reminder frequency settings
+- Custom reminder messages
+- Different trigger conditions
+- Integration with other notification systems
+
+## Maintenance
+
+### Monitoring
+
+- Check localStorage usage in browser dev tools
+- Monitor user feedback about reminder frequency
+- Track navigation success to seed backup page
+
+### Updates
+
+- Modify reminder text in `createSeedReminderNotification()`
+- Adjust cooldown period in `REMINDER_COOLDOWN_MS` constant
+- Add new trigger points as needed
+
+## Conclusion
+
+This implementation provides a non-intrusive way to remind users about seed phrase backup while respecting their preferences and avoiding notification fatigue. The 24-hour cooldown ensures users aren't overwhelmed while maintaining the importance of the security reminder.
+
+The feature is fully integrated with the existing codebase architecture and follows established patterns for notifications, error handling, and user interaction.

electron/capacitor.config.ts

@@ -0,0 +1,116 @@
+import { CapacitorConfig } from '@capacitor/cli';
+
+const config: CapacitorConfig = {
+  appId: 'app.timesafari',
+  appName: 'TimeSafari',
+  webDir: 'dist',
+  server: {
+    cleartext: true
+  },
+  plugins: {
+    App: {
+      appUrlOpen: {
+        handlers: [
+          {
+            url: 'timesafari://*',
+            autoVerify: true
+          }
+        ]
+      }
+    },
+    SplashScreen: {
+      launchShowDuration: 3000,
+      launchAutoHide: true,
+      backgroundColor: '#ffffff',
+      androidSplashResourceName: 'splash',
+      androidScaleType: 'CENTER_CROP',
+      showSpinner: false,
+      androidSpinnerStyle: 'large',
+      iosSpinnerStyle: 'small',
+      spinnerColor: '#999999',
+      splashFullScreen: true,
+      splashImmersive: true
+    },
+    CapSQLite: {
+      iosDatabaseLocation: 'Library/CapacitorDatabase',
+      iosIsEncryption: false,
+      iosBiometric: {
+        biometricAuth: false,
+        biometricTitle: 'Biometric login for TimeSafari'
+      },
+      androidIsEncryption: false,
+      androidBiometric: {
+        biometricAuth: false,
+        biometricTitle: 'Biometric login for TimeSafari'
+      },
+      electronIsEncryption: false
+    }
+  },
+  ios: {
+    contentInset: 'never',
+    allowsLinkPreview: true,
+    scrollEnabled: true,
+    limitsNavigationsToAppBoundDomains: true,
+    backgroundColor: '#ffffff',
+    allowNavigation: [
+      '*.timesafari.app',
+      '*.jsdelivr.net',
+      'api.endorser.ch'
+    ]
+  },
+  android: {
+    allowMixedContent: true,
+    captureInput: true,
+    webContentsDebuggingEnabled: false,
+    allowNavigation: [
+      '*.timesafari.app',
+      '*.jsdelivr.net',
+      'api.endorser.ch',
+      '10.0.2.2:3000'
+    ]
+  },
+  electron: {
+    deepLinking: {
+      schemes: ['timesafari']
+    },
+    buildOptions: {
+      appId: 'app.timesafari',
+      productName: 'TimeSafari',
+      directories: {
+        output: 'dist-electron-packages'
+      },
+      files: [
+        'dist/**/*',
+        'electron/**/*'
+      ],
+      mac: {
+        category: 'public.app-category.productivity',
+        target: [
+          {
+            target: 'dmg',
+            arch: ['x64', 'arm64']
+          }
+        ]
+      },
+      win: {
+        target: [
+          {
+            target: 'nsis',
+            arch: ['x64']
+          }
+        ]
+      },
+      linux: {
+        target: [
+          {
+            target: 'AppImage',
+            arch: ['x64']
+          }
+        ],
+        category: 'Utility'
+      }
+    }
+  }
+};
+
+export default config;

electron/package-lock.json

@@ -56,7 +56,6 @@
       "version": "6.0.2",
       "resolved": "https://registry.npmjs.org/@capacitor-community/sqlite/-/sqlite-6.0.2.tgz",
       "integrity": "sha512-sj+2SPLu7E/3dM3xxcWwfNomG+aQHuN96/EFGrOtp4Dv30/2y5oIPyi6hZGjQGjPc5GDNoTQwW7vxWNzybjuMg==",
-      "license": "MIT",
       "dependencies": {
         "jeep-sqlite": "^2.7.2"
       },

electron/src/index.ts

@@ -50,6 +50,7 @@ process.stderr.on('error', (err) => {
 const trayMenuTemplate: (MenuItemConstructorOptions | MenuItem)[] = [new MenuItem({ label: 'Quit App', role: 'quit' })];
 const appMenuBarMenuTemplate: (MenuItemConstructorOptions | MenuItem)[] = [
   { role: process.platform === 'darwin' ? 'appMenu' : 'fileMenu' },
+  { role: 'editMenu' },
   { role: 'viewMenu' },
 ];
 

electron/src/setup.ts

@@ -53,6 +53,7 @@ export class ElectronCapacitorApp {
   ];
   private AppMenuBarMenuTemplate: (MenuItem | MenuItemConstructorOptions)[] = [
     { role: process.platform === 'darwin' ? 'appMenu' : 'fileMenu' },
+    { role: 'editMenu' },
     { role: 'viewMenu' },
   ];
   private mainWindowState;

electron/tsconfig.json

@@ -1,6 +1,6 @@
 {
   "compileOnSave": true,
-  "include": ["./src/**/*", "./capacitor.config.ts", "./capacitor.config.js"],
+  "include": ["./src/**/*"],
   "compilerOptions": {
     "outDir": "./build",
     "importHelpers": true,

ios/App/Podfile

@@ -18,6 +18,7 @@ def capacitor_pods
   pod 'CapacitorClipboard', :path => '../../node_modules/@capacitor/clipboard'
   pod 'CapacitorFilesystem', :path => '../../node_modules/@capacitor/filesystem'
   pod 'CapacitorShare', :path => '../../node_modules/@capacitor/share'
+  pod 'CapacitorStatusBar', :path => '../../node_modules/@capacitor/status-bar'
   pod 'CapawesomeCapacitorFilePicker', :path => '../../node_modules/@capawesome/capacitor-file-picker'
 end
 

ios/App/Podfile.lock

@@ -19,6 +19,8 @@ PODS:
     - GoogleMLKit/BarcodeScanning (= 5.0.0)
   - CapacitorShare (6.0.3):
     - Capacitor
+  - CapacitorStatusBar (6.0.2):
+    - Capacitor
   - CapawesomeCapacitorFilePicker (6.2.0):
     - Capacitor
   - GoogleDataTransport (9.4.1):
@@ -96,6 +98,7 @@ DEPENDENCIES:
   - "CapacitorFilesystem (from `../../node_modules/@capacitor/filesystem`)"
   - "CapacitorMlkitBarcodeScanning (from `../../node_modules/@capacitor-mlkit/barcode-scanning`)"
   - "CapacitorShare (from `../../node_modules/@capacitor/share`)"
+  - "CapacitorStatusBar (from `../../node_modules/@capacitor/status-bar`)"
   - "CapawesomeCapacitorFilePicker (from `../../node_modules/@capawesome/capacitor-file-picker`)"
 
 SPEC REPOS:
@@ -134,6 +137,8 @@ EXTERNAL SOURCES:
     :path: "../../node_modules/@capacitor-mlkit/barcode-scanning"
   CapacitorShare:
     :path: "../../node_modules/@capacitor/share"
+  CapacitorStatusBar:
+    :path: "../../node_modules/@capacitor/status-bar"
   CapawesomeCapacitorFilePicker:
     :path: "../../node_modules/@capawesome/capacitor-file-picker"
 
@@ -147,6 +152,7 @@ SPEC CHECKSUMS:
   CapacitorFilesystem: 59270a63c60836248812671aa3b15df673fbaf74
   CapacitorMlkitBarcodeScanning: 7652be9c7922f39203a361de735d340ae37e134e
   CapacitorShare: d2a742baec21c8f3b92b361a2fbd2401cdd8288e
+  CapacitorStatusBar: b16799a26320ffa52f6c8b01737d5a95bbb8f3eb
   CapawesomeCapacitorFilePicker: c40822f0a39f86855321943c7829d52bca7f01bd
   GoogleDataTransport: 6c09b596d841063d76d4288cc2d2f42cc36e1e2a
   GoogleMLKit: 90ba06e028795a50261f29500d238d6061538711
@@ -163,6 +169,6 @@ SPEC CHECKSUMS:
   SQLCipher: 31878d8ebd27e5c96db0b7cb695c96e9f8ad77da
   ZIPFoundation: b8c29ea7ae353b309bc810586181fd073cb3312c
 
-PODFILE CHECKSUM: 60f54b19c5a7a07343ab5ba9e5db49019fd86aa0
+PODFILE CHECKSUM: 5fa870b031c7c4e0733e2f96deaf81866c75ff7d
 
 COCOAPODS: 1.16.2

package-lock.json

@@ -20,6 +20,7 @@
         "@capacitor/filesystem": "^6.0.0",
         "@capacitor/ios": "^6.2.0",
         "@capacitor/share": "^6.0.3",
+        "@capacitor/status-bar": "^6.0.2",
         "@capawesome/capacitor-file-picker": "^6.2.0",
         "@dicebear/collection": "^5.4.1",
         "@dicebear/core": "^5.4.1",
@@ -137,6 +138,7 @@
         "postcss": "^8.4.38",
         "prettier": "^3.2.5",
         "rimraf": "^6.0.1",
+        "serve": "^14.2.4",
         "tailwindcss": "^3.4.1",
         "ts-jest": "^29.4.0",
         "tsx": "^4.20.4",
@@ -2346,6 +2348,14 @@
         "@capacitor/core": "^6.0.0"
       }
     },
+    "node_modules/@capacitor/status-bar": {
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/@capacitor/status-bar/-/status-bar-6.0.2.tgz",
+      "integrity": "sha512-AmRIX6QvFemItlY7/69ARkIAqitRQqJ2qwgZmD1KqgFb78pH+XFXm1guvS/a8CuOOm/IqZ4ddDbl20yxtBqzGA==",
+      "peerDependencies": {
+        "@capacitor/core": "^6.0.0"
+      }
+    },
     "node_modules/@capawesome/capacitor-file-picker": {
       "version": "6.2.0",
       "resolved": "https://registry.npmjs.org/@capawesome/capacitor-file-picker/-/capacitor-file-picker-6.2.0.tgz",
@@ -11751,6 +11761,13 @@
         "node": ">=10.0.0"
       }
     },
+    "node_modules/@zeit/schemas": {
+      "version": "2.36.0",
+      "resolved": "https://registry.npmjs.org/@zeit/schemas/-/schemas-2.36.0.tgz",
+      "integrity": "sha512-7kjMwcChYEzMKjeex9ZFXkt1AyNov9R5HZtjBKVsmVpw7pa7ZtlCGvCBC2vnnXctaYN+aRI61HjIqeetZW5ROg==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@zxing/text-encoding": {
       "version": "0.9.0",
       "resolved": "https://registry.npmjs.org/@zxing/text-encoding/-/text-encoding-0.9.0.tgz",
@@ -11813,9 +11830,8 @@
       "version": "1.3.8",
       "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.8.tgz",
       "integrity": "sha512-PYAthTa2m2VKxuvSD3DPC/Gy+U+sOA1LAuT8mkmRuvw+NACSaeXEQ+NHcVF7rONl6qcaxV3Uuemwawk+7+SJLw==",
+      "devOptional": true,
       "license": "MIT",
-      "optional": true,
-      "peer": true,
       "dependencies": {
         "mime-types": "~2.1.34",
         "negotiator": "0.6.3"
@@ -11940,6 +11956,16 @@
       "optional": true,
       "peer": true
     },
+    "node_modules/ansi-align": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-3.0.1.tgz",
+      "integrity": "sha512-IOfwwBF5iczOjp/WeY4YxyjqAFMQoZufdQWDd19SEExbVLNXqvpzSJ/M7Za4/sCPmQ0+GRquoA7bGcINcxew6w==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "string-width": "^4.1.0"
+      }
+    },
     "node_modules/ansi-escapes": {
       "version": "4.3.2",
       "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-4.3.2.tgz",
@@ -12144,6 +12170,27 @@
       "license": "ISC",
       "optional": true
     },
+    "node_modules/arch": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/arch/-/arch-2.2.0.tgz",
+      "integrity": "sha512-Of/R0wqp83cgHozfIYLbBMnej79U/SVGOOyuB3VVFv1NRM/PSFMK12x9KVtiYzJqmnU5WR2qp0Z5rHb7sWGnFQ==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT"
+    },
     "node_modules/are-we-there-yet": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-3.0.1.tgz",
@@ -12940,6 +12987,153 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/boxen": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/boxen/-/boxen-7.0.0.tgz",
+      "integrity": "sha512-j//dBVuyacJbvW+tvZ9HuH03fZ46QcaKvvhZickZqtB271DxJ7SNRSNxrV/dZX0085m7hISRZWbzWlJvx/rHSg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-align": "^3.0.1",
+        "camelcase": "^7.0.0",
+        "chalk": "^5.0.1",
+        "cli-boxes": "^3.0.0",
+        "string-width": "^5.1.2",
+        "type-fest": "^2.13.0",
+        "widest-line": "^4.0.1",
+        "wrap-ansi": "^8.0.1"
+      },
+      "engines": {
+        "node": ">=14.16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/boxen/node_modules/ansi-regex": {
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.2.0.tgz",
+      "integrity": "sha512-TKY5pyBkHyADOPYlRT9Lx6F544mPl0vS5Ew7BJ45hA08Q+t3GjbueLliBWN3sMICk6+y7HdyxSzC4bWS8baBdg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-regex?sponsor=1"
+      }
+    },
+    "node_modules/boxen/node_modules/ansi-styles": {
+      "version": "6.2.1",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.1.tgz",
+      "integrity": "sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/boxen/node_modules/camelcase": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-7.0.1.tgz",
+      "integrity": "sha512-xlx1yCK2Oc1APsPXDL2LdlNP6+uu8OCDdhOBSVT279M/S+y75O30C2VuD8T2ogdePBBl7PfPF4504tnLgX3zfw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=14.16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/boxen/node_modules/chalk": {
+      "version": "5.6.0",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.6.0.tgz",
+      "integrity": "sha512-46QrSQFyVSEyYAgQ22hQ+zDa60YHA4fBstHmtSApj1Y5vKtG27fWowW03jCk5KcbXEWPZUIR894aARCA/G1kfQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^12.17.0 || ^14.13 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/boxen/node_modules/emoji-regex": {
+      "version": "9.2.2",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz",
+      "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/boxen/node_modules/string-width": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
+      "integrity": "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "eastasianwidth": "^0.2.0",
+        "emoji-regex": "^9.2.2",
+        "strip-ansi": "^7.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/boxen/node_modules/strip-ansi": {
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz",
+      "integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/strip-ansi?sponsor=1"
+      }
+    },
+    "node_modules/boxen/node_modules/type-fest": {
+      "version": "2.19.0",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-2.19.0.tgz",
+      "integrity": "sha512-RAH822pAdBgcNMAfWnCBU3CFZcfZ/i1eZjwFU/dsLKumyuuP3niueg2UAukXYF0E2AAoc82ZSSf9J0WQBinzHA==",
+      "dev": true,
+      "license": "(MIT OR CC0-1.0)",
+      "engines": {
+        "node": ">=12.20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/boxen/node_modules/wrap-ansi": {
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz",
+      "integrity": "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^6.1.0",
+        "string-width": "^5.0.1",
+        "strip-ansi": "^7.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
     "node_modules/bplist-creator": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/bplist-creator/-/bplist-creator-0.1.0.tgz",
@@ -13726,6 +13920,22 @@
         "url": "https://github.com/chalk/chalk?sponsor=1"
       }
     },
+    "node_modules/chalk-template": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/chalk-template/-/chalk-template-0.4.0.tgz",
+      "integrity": "sha512-/ghrgmhfY8RaSdeo43hNXxpoHAtxdbskUHjPpfqUWGttFgycUhYPGx3YZBCnUCvOa7Doivn1IZec3DEGFoMgLg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "chalk": "^4.1.2"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk-template?sponsor=1"
+      }
+    },
     "node_modules/char-regex": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/char-regex/-/char-regex-1.0.2.tgz",
@@ -13950,6 +14160,19 @@
         "node": ">=6"
       }
     },
+    "node_modules/cli-boxes": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/cli-boxes/-/cli-boxes-3.0.0.tgz",
+      "integrity": "sha512-/lzGpEWL/8PfI0BmBOPRwp0c/wFNX1RdUML3jK/RcSBA9T8mZDdQpqYBKtCFTOfQbwPqWEOpjqW+Fnayc0969g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/cli-cursor": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-3.1.0.tgz",
@@ -14006,6 +14229,24 @@
         "node": ">=8"
       }
     },
+    "node_modules/clipboardy": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/clipboardy/-/clipboardy-3.0.0.tgz",
+      "integrity": "sha512-Su+uU5sr1jkUy1sGRpLKjKrvEOVXgSgiSInwa/qeID6aJ07yh+5NWc3h2QfjHjBnfX4LhtFcuAWKUsJ3r+fjbg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "arch": "^2.2.0",
+        "execa": "^5.1.1",
+        "is-wsl": "^2.2.0"
+      },
+      "engines": {
+        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/cliui": {
       "version": "8.0.1",
       "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz",
@@ -14172,9 +14413,8 @@
       "version": "2.0.18",
       "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.18.tgz",
       "integrity": "sha512-AF3r7P5dWxL8MxyITRMlORQNaOA2IkAFaTr4k7BUumjPtRpGDTZpl0Pb1XCO6JeDCBdp126Cgs9sMxqSjgYyRg==",
+      "devOptional": true,
       "license": "MIT",
-      "optional": true,
-      "peer": true,
       "dependencies": {
         "mime-db": ">= 1.43.0 < 2"
       },
@@ -14448,6 +14688,16 @@
       "license": "ISC",
       "optional": true
     },
+    "node_modules/content-disposition": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz",
+      "integrity": "sha512-kRGRZw3bLlFISDBgwTSA1TMBFN6J6GWDeubmDE3AF+3+yXL8hTWv8r5rkLbqYXY4RjPk/EzHnClI3zQf1cFmHA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/conventional-changelog": {
       "version": "3.1.25",
       "resolved": "https://registry.npmjs.org/conventional-changelog/-/conventional-changelog-3.1.25.tgz",
@@ -19240,6 +19490,19 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/is-port-reachable": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/is-port-reachable/-/is-port-reachable-4.0.0.tgz",
+      "integrity": "sha512-9UoipoxYmSk6Xy7QFgRv2HDyaysmgSG75TFQs6S+3pDM7ZhKTF/bskZV+0UlABHzKjNVhPjYCLfeZUEg1wXxig==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/is-stream": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-2.0.1.tgz",
@@ -24431,9 +24694,8 @@
       "version": "1.54.0",
       "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.54.0.tgz",
       "integrity": "sha512-aU5EJuIN2WDemCcAp2vFBfp/m4EAhWJnUNSSw0ixs7/kXbd6Pg64EmwJkNdFhB8aWt1sH2CTXrLxo/iAGV3oPQ==",
+      "devOptional": true,
       "license": "MIT",
-      "optional": true,
-      "peer": true,
       "engines": {
         "node": ">= 0.6"
       }
@@ -25897,6 +26159,13 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/path-is-inside": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/path-is-inside/-/path-is-inside-1.0.2.tgz",
+      "integrity": "sha512-DUWJr3+ULp4zXmol/SZkFf3JGsS9/SIv+Y3Rt93/UjPpDpklB5f1er4O3POIbUuUJ3FXgqte2Q7SrU6zAqwk8w==",
+      "dev": true,
+      "license": "(WTFPL OR MIT)"
+    },
     "node_modules/path-key": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
@@ -25938,6 +26207,13 @@
         "node": ">=16 || 14 >=14.17"
       }
     },
+    "node_modules/path-to-regexp": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-3.3.0.tgz",
+      "integrity": "sha512-qyCH421YQPS2WFDxDjftfc1ZR5WKQzVzqsp4n9M2kQhVOo/ByahFoUNJfl58kOcEGfQ//7weFTDhm+ss8Ecxgw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/path-type": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz",
@@ -28103,6 +28379,30 @@
       "integrity": "sha512-CiD3ZSanZqcMPRhtfct5K9f7i3OLCcBBWsJjLh1gW9RO/nS94sVzY59iS+fgYBOBqaBpf4EzfqUF3j9IG+xo8A==",
       "license": "MIT"
     },
+    "node_modules/registry-auth-token": {
+      "version": "3.3.2",
+      "resolved": "https://registry.npmjs.org/registry-auth-token/-/registry-auth-token-3.3.2.tgz",
+      "integrity": "sha512-JL39c60XlzCVgNrO+qq68FoNb56w/m7JYvGR2jT5iR1xBrUA3Mfx5Twk5rqTThPmQKMWydGmq8oFtDlxfrmxnQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "rc": "^1.1.6",
+        "safe-buffer": "^5.0.1"
+      }
+    },
+    "node_modules/registry-url": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/registry-url/-/registry-url-3.1.0.tgz",
+      "integrity": "sha512-ZbgR5aZEdf4UKZVBPYIgaglBmSF2Hi94s2PcIHhRGFjKYu+chjJdYfHn4rt3hB6eCKLJ8giVIIfgMa1ehDfZKA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "rc": "^1.0.1"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/regjsgen": {
       "version": "0.8.0",
       "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.8.0.tgz",
@@ -29211,6 +29511,115 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/serve": {
+      "version": "14.2.4",
+      "resolved": "https://registry.npmjs.org/serve/-/serve-14.2.4.tgz",
+      "integrity": "sha512-qy1S34PJ/fcY8gjVGszDB3EXiPSk5FKhUa7tQe0UPRddxRidc2V6cNHPNewbE1D7MAkgLuWEt3Vw56vYy73tzQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@zeit/schemas": "2.36.0",
+        "ajv": "8.12.0",
+        "arg": "5.0.2",
+        "boxen": "7.0.0",
+        "chalk": "5.0.1",
+        "chalk-template": "0.4.0",
+        "clipboardy": "3.0.0",
+        "compression": "1.7.4",
+        "is-port-reachable": "4.0.0",
+        "serve-handler": "6.1.6",
+        "update-check": "1.5.4"
+      },
+      "bin": {
+        "serve": "build/main.js"
+      },
+      "engines": {
+        "node": ">= 14"
+      }
+    },
+    "node_modules/serve-handler": {
+      "version": "6.1.6",
+      "resolved": "https://registry.npmjs.org/serve-handler/-/serve-handler-6.1.6.tgz",
+      "integrity": "sha512-x5RL9Y2p5+Sh3D38Fh9i/iQ5ZK+e4xuXRd/pGbM4D13tgo/MGwbttUk8emytcr1YYzBYs+apnUngBDFYfpjPuQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "bytes": "3.0.0",
+        "content-disposition": "0.5.2",
+        "mime-types": "2.1.18",
+        "minimatch": "3.1.2",
+        "path-is-inside": "1.0.2",
+        "path-to-regexp": "3.3.0",
+        "range-parser": "1.2.0"
+      }
+    },
+    "node_modules/serve-handler/node_modules/brace-expansion": {
+      "version": "1.1.12",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz",
+      "integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0",
+        "concat-map": "0.0.1"
+      }
+    },
+    "node_modules/serve-handler/node_modules/bytes": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz",
+      "integrity": "sha512-pMhOfFDPiv9t5jjIXkHosWmkSyQbvsgEVNkz0ERHbuLh2T/7j4Mqqpz523Fe8MVY89KC6Sh/QfS2sM+SjgFDcw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/serve-handler/node_modules/mime-db": {
+      "version": "1.33.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.33.0.tgz",
+      "integrity": "sha512-BHJ/EKruNIqJf/QahvxwQZXKygOQ256myeN/Ew+THcAa5q+PjyTTMMeNQC4DZw5AwfvelsUrA6B67NKMqXDbzQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/serve-handler/node_modules/mime-types": {
+      "version": "2.1.18",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.18.tgz",
+      "integrity": "sha512-lc/aahn+t4/SWV/qcmumYjymLsWfN3ELhpmVuUFjgsORruuZPVSwAQryq+HHGvO/SI2KVX26bx+En+zhM8g8hQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "mime-db": "~1.33.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/serve-handler/node_modules/minimatch": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
+      "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^1.1.7"
+      },
+      "engines": {
+        "node": "*"
+      }
+    },
+    "node_modules/serve-handler/node_modules/range-parser": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.0.tgz",
+      "integrity": "sha512-kA5WQoNVo4t9lNx2kQNFCxKeBl5IbbSNBl1M/tLkw9WCn+hxNBAW5Qh8gdhs63CJnhjJ2zQWFoqPJP2sK1AV5A==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/serve-static": {
       "version": "1.16.2",
       "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.16.2.tgz",
@@ -29342,6 +29751,106 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/serve/node_modules/ajv": {
+      "version": "8.12.0",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.12.0.tgz",
+      "integrity": "sha512-sRu1kpcO9yLtYxBKvqfTeh9KzZEwO3STyX1HT+4CaDzC6HpTGYhIhPIzj9XuKU7KYDwnaeh5hcOwjy1QuJzBPA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fast-deep-equal": "^3.1.1",
+        "json-schema-traverse": "^1.0.0",
+        "require-from-string": "^2.0.2",
+        "uri-js": "^4.2.2"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/epoberezkin"
+      }
+    },
+    "node_modules/serve/node_modules/bytes": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz",
+      "integrity": "sha512-pMhOfFDPiv9t5jjIXkHosWmkSyQbvsgEVNkz0ERHbuLh2T/7j4Mqqpz523Fe8MVY89KC6Sh/QfS2sM+SjgFDcw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/serve/node_modules/chalk": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.0.1.tgz",
+      "integrity": "sha512-Fo07WOYGqMfCWHOzSXOt2CxDbC6skS/jO9ynEcmpANMoPrD+W1r1K6Vx7iNm+AQmETU1Xr2t+n8nzkV9t6xh3w==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^12.17.0 || ^14.13 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/serve/node_modules/compression": {
+      "version": "1.7.4",
+      "resolved": "https://registry.npmjs.org/compression/-/compression-1.7.4.tgz",
+      "integrity": "sha512-jaSIDzP9pZVS4ZfQ+TzvtiWhdpFhE2RDHz8QJkpX9SIpLq88VueF5jJw6t+6CUQcAoA6t+x89MLrWAqpfDE8iQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "accepts": "~1.3.5",
+        "bytes": "3.0.0",
+        "compressible": "~2.0.16",
+        "debug": "2.6.9",
+        "on-headers": "~1.0.2",
+        "safe-buffer": "5.1.2",
+        "vary": "~1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
+    "node_modules/serve/node_modules/debug": {
+      "version": "2.6.9",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ms": "2.0.0"
+      }
+    },
+    "node_modules/serve/node_modules/json-schema-traverse": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
+      "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/serve/node_modules/ms": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+      "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/serve/node_modules/on-headers": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/on-headers/-/on-headers-1.0.2.tgz",
+      "integrity": "sha512-pZAE+FJLoyITytdqK0U5s+FIpjN0JP3OzFi/u8Rx+EV5/W+JTWGXG8xFzevE7AjBfDqHv/8vL8qQsIhHnqRkrA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/serve/node_modules/safe-buffer": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
+      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/set-blocking": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
@@ -31671,6 +32180,17 @@
         "browserslist": ">= 4.21.0"
       }
     },
+    "node_modules/update-check": {
+      "version": "1.5.4",
+      "resolved": "https://registry.npmjs.org/update-check/-/update-check-1.5.4.tgz",
+      "integrity": "sha512-5YHsflzHP4t1G+8WGPlvKbJEbAJGCgw+Em+dGR1KmBUbr1J36SJBqlHLjR7oob7sco5hWHGQVcr9B2poIVDDTQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "registry-auth-token": "3.3.2",
+        "registry-url": "3.1.0"
+      }
+    },
     "node_modules/uri-js": {
       "version": "4.4.1",
       "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz",
@@ -31779,9 +32299,8 @@
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
       "integrity": "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==",
+      "devOptional": true,
       "license": "MIT",
-      "optional": true,
-      "peer": true,
       "engines": {
         "node": ">= 0.8"
       }
@@ -32633,6 +33152,76 @@
         "string-width": "^1.0.2 || 2 || 3 || 4"
       }
     },
+    "node_modules/widest-line": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/widest-line/-/widest-line-4.0.1.tgz",
+      "integrity": "sha512-o0cyEG0e8GPzT4iGHphIOh0cJOV8fivsXxddQasHPHfoZf1ZexrfeA21w2NaEN1RHE+fXlfISmOE8R9N3u3Qig==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "string-width": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/widest-line/node_modules/ansi-regex": {
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.2.0.tgz",
+      "integrity": "sha512-TKY5pyBkHyADOPYlRT9Lx6F544mPl0vS5Ew7BJ45hA08Q+t3GjbueLliBWN3sMICk6+y7HdyxSzC4bWS8baBdg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-regex?sponsor=1"
+      }
+    },
+    "node_modules/widest-line/node_modules/emoji-regex": {
+      "version": "9.2.2",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz",
+      "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/widest-line/node_modules/string-width": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
+      "integrity": "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "eastasianwidth": "^0.2.0",
+        "emoji-regex": "^9.2.2",
+        "strip-ansi": "^7.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/widest-line/node_modules/strip-ansi": {
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz",
+      "integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/strip-ansi?sponsor=1"
+      }
+    },
     "node_modules/wonka": {
       "version": "6.3.5",
       "resolved": "https://registry.npmjs.org/wonka/-/wonka-6.3.5.tgz",

package.json

@@ -150,6 +150,7 @@
     "@capacitor/filesystem": "^6.0.0",
     "@capacitor/ios": "^6.2.0",
     "@capacitor/share": "^6.0.3",
+    "@capacitor/status-bar": "^6.0.2",
     "@capawesome/capacitor-file-picker": "^6.2.0",
     "@dicebear/collection": "^5.4.1",
     "@dicebear/core": "^5.4.1",
@@ -267,6 +268,7 @@
     "postcss": "^8.4.38",
     "prettier": "^3.2.5",
     "rimraf": "^6.0.1",
+    "serve": "^14.2.4",
     "tailwindcss": "^3.4.1",
     "ts-jest": "^29.4.0",
     "tsx": "^4.20.4",

scripts/build-electron.sh

@@ -181,7 +181,7 @@ sync_capacitor() {
 copy_web_assets() {
     log_info "Copying web assets to Electron"
     safe_execute "Copying assets" "cp -r dist/* electron/app/"
-    safe_execute "Copying config" "cp capacitor.config.json electron/capacitor.config.json"
+    # Note: Electron has its own capacitor.config.ts file, so we don't copy the main config
 }
 
 # Compile TypeScript

src/App.vue

@@ -4,7 +4,7 @@
   <!-- Messages in the upper-right - https://github.com/emmanuelsw/notiwind -->
   <NotificationGroup group="alert">
     <div
-      class="fixed z-[120] top-[max(1rem,env(safe-area-inset-top))] right-4 left-4 sm:left-auto sm:w-full sm:max-w-sm flex flex-col items-start justify-end"
+      class="fixed z-[120] top-[max(1rem,env(safe-area-inset-top),var(--safe-area-inset-top,0px))] right-4 left-4 sm:left-auto sm:w-full sm:max-w-sm flex flex-col items-start justify-end"
     >
       <Notification
         v-slot="{ notifications, close }"
@@ -175,7 +175,9 @@
       "-permission", "-mute", "-off"
   -->
   <NotificationGroup group="modal">
-    <div class="fixed z-[100] top-[env(safe-area-inset-top)] inset-x-0 w-full">
+    <div
+      class="fixed z-[100] top-[max(env(safe-area-inset-top),var(--safe-area-inset-top,0px))] inset-x-0 w-full"
+    >
       <Notification
         v-slot="{ notifications, close }"
         enter="transform ease-out duration-300 transition"
@@ -506,13 +508,32 @@ export default class App extends Vue {
 
 <style>
 #Content {
-  padding-left: max(1.5rem, env(safe-area-inset-left));
+  padding-left: max(
-  padding-right: max(1.5rem, env(safe-area-inset-right));
+    1.5rem,
-  padding-top: max(1.5rem, env(safe-area-inset-top));
+    env(safe-area-inset-left),
-  padding-bottom: max(1.5rem, env(safe-area-inset-bottom));
+    var(--safe-area-inset-left, 0px)
+  );
+  padding-right: max(
+    1.5rem,
+    env(safe-area-inset-right),
+    var(--safe-area-inset-right, 0px)
+  );
+  padding-top: max(
+    1.5rem,
+    env(safe-area-inset-top),
+    var(--safe-area-inset-top, 0px)
+  );
+  padding-bottom: max(
+    1.5rem,
+    env(safe-area-inset-bottom),
+    var(--safe-area-inset-bottom, 0px)
+  );
 }
 
 #QuickNav ~ #Content {
-  padding-bottom: calc(env(safe-area-inset-bottom) + 6.333rem);
+  padding-bottom: calc(
+    max(env(safe-area-inset-bottom), var(--safe-area-inset-bottom, 0px)) +
+      6.333rem
+  );
 }
 </style>

src/components/DataExportSection.vue

@@ -16,6 +16,12 @@ messages * - Conditional UI based on platform capabilities * * @component *
       :to="{ name: 'seed-backup' }"
       :class="backupButtonClasses"
     >
+      <!-- Notification dot - show while the user has not yet backed up their seed phrase -->
+      <font-awesome
+        v-if="!hasBackedUpSeed"
+        icon="circle"
+        class="absolute -right-[8px] -top-[8px] text-rose-500 text-[14px] border border-white rounded-full"
+      ></font-awesome>
       Backup Identifier Seed
     </router-link>
 
@@ -98,6 +104,12 @@ export default class DataExportSection extends Vue {
    */
   isExporting = false;
 
+  /**
+   * Flag indicating if the user has backed up their seed phrase
+   * Used to control the visibility of the notification dot
+   */
+  hasBackedUpSeed = false;
+
   /**
    * Notification helper for consistent notification patterns
    * Created as a getter to ensure $notify is available when called
@@ -129,7 +141,7 @@ export default class DataExportSection extends Vue {
    * CSS classes for the backup button (router link)
    */
   get backupButtonClasses(): string {
-    return "block w-full text-center text-md bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1.5 py-2 rounded-md mb-2 mt-2";
+    return "block relative w-full text-center text-md bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1.5 py-2 rounded-md mb-2 mt-2";
   }
 
   /**
@@ -218,6 +230,22 @@ export default class DataExportSection extends Vue {
 
   created() {
     this.notify = createNotifyHelpers(this.$notify);
+    this.loadSeedBackupStatus();
+  }
+
+  /**
+   * Loads the seed backup status from account settings
+   * Updates the hasBackedUpSeed flag to control notification dot visibility
+   */
+  private async loadSeedBackupStatus(): Promise<void> {
+    try {
+      const settings = await this.$accountSettings();
+      this.hasBackedUpSeed = !!settings.hasBackedUpSeed;
+    } catch (err: unknown) {
+      logger.error("Failed to load seed backup status:", err);
+      // Default to false (show notification dot) if we can't load the setting
+      this.hasBackedUpSeed = false;
+    }
   }
 }
 </script>

src/components/EntityGrid.vue

@@ -22,7 +22,7 @@ projects, and special entities with selection. * * @author Matthew Raymer */
       <!-- "Unnamed" entity -->
       <SpecialEntityCard
         entity-type="unnamed"
-        label="Unnamed"
+        :label="unnamedEntityName"
         icon="circle-question"
         :entity-data="unnamedEntityData"
         :notify="notify"
@@ -83,6 +83,7 @@ import ShowAllCard from "./ShowAllCard.vue";
 import { Contact } from "../db/tables/contacts";
 import { PlanData } from "../interfaces/records";
 import { NotificationIface } from "../constants/app";
+import { UNNAMED_ENTITY_NAME } from "@/constants/entities";
 
 /**
  * EntityGrid - Unified grid layout for displaying people or projects
@@ -159,6 +160,10 @@ export default class EntityGrid extends Vue {
   @Prop({ default: "other party" })
   conflictContext!: string;
 
+  /** Whether to hide the "Show All" navigation */
+  @Prop({ default: false })
+  hideShowAll!: boolean;
+
   /**
    * Function to determine which entities to display (allows parent control)
    *
@@ -245,7 +250,9 @@ export default class EntityGrid extends Vue {
    * Whether to show the "Show All" navigation
    */
   get shouldShowAll(): boolean {
-    return this.entities.length > 0 && this.showAllRoute !== "";
+    return (
+      !this.hideShowAll && this.entities.length > 0 && this.showAllRoute !== ""
+    );
   }
 
   /**
@@ -271,10 +278,17 @@ export default class EntityGrid extends Vue {
   get unnamedEntityData(): { did: string; name: string } {
     return {
       did: "",
-      name: "Unnamed",
+      name: UNNAMED_ENTITY_NAME,
     };
   }
 
+  /**
+   * Get the unnamed entity name constant
+   */
+  get unnamedEntityName(): string {
+    return UNNAMED_ENTITY_NAME;
+  }
+
   /**
    * Check if a person DID is conflicted
    */
@@ -304,16 +318,13 @@ export default class EntityGrid extends Vue {
 
   /**
    * Handle special entity selection from SpecialEntityCard
+   * Treat "You" and "Unnamed" as person entities
    */
-  handleEntitySelected(event: {
+  handleEntitySelected(event: { data: { did?: string; name: string } }): void {
-    type: string;
+    // Convert special entities to person entities since they represent people
-    entityType: string;
-    data: { did?: string; name: string };
-  }): void {
     this.emitEntitySelected({
-      type: "special",
+      type: "person",
-      entityType: event.entityType,
+      data: event.data as Contact,
-      data: event.data,
     });
   }
 
@@ -321,13 +332,11 @@ export default class EntityGrid extends Vue {
 
   @Emit("entity-selected")
   emitEntitySelected(data: {
-    type: "person" | "project" | "special";
+    type: "person" | "project";
-    entityType?: string;
+    data: Contact | PlanData;
-    data: Contact | PlanData | { did?: string; name: string };
   }): {
-    type: "person" | "project" | "special";
+    type: "person" | "project";
-    entityType?: string;
+    data: Contact | PlanData;
-    data: Contact | PlanData | { did?: string; name: string };
   } {
     return data;
   }

src/components/EntitySelectionStep.vue

@@ -27,6 +27,7 @@ Matthew Raymer */
       :show-all-query-params="showAllQueryParams"
       :notify="notify"
       :conflict-context="conflictContext"
+      :hide-show-all="hideShowAll"
       @entity-selected="handleEntitySelected"
     />
 
@@ -55,9 +56,8 @@ interface EntityData {
  * Entity selection event data structure
  */
 interface EntitySelectionEvent {
-  type: "person" | "project" | "special";
+  type: "person" | "project";
-  entityType?: string;
+  data: Contact | PlanData;
-  data: Contact | PlanData | EntityData;
 }
 
 /**
@@ -154,6 +154,10 @@ export default class EntitySelectionStep extends Vue {
   @Prop()
   notify?: (notification: NotificationIface, timeout?: number) => void;
 
+  /** Whether to hide the "Show All" navigation */
+  @Prop({ default: false })
+  hideShowAll!: boolean;
+
   /**
    * CSS classes for the cancel button
    */

src/components/EntitySummaryButton.vue

@@ -42,8 +42,8 @@ computed CSS properties * * @author Matthew Raymer */
       <p class="text-xs text-slate-500 leading-1 -mb-1 uppercase">
         {{ label }}
       </p>
-      <h3 class="font-semibold truncate">
+      <h3 :class="nameClasses">
-        {{ entity?.name || "Unnamed" }}
+        {{ displayName }}
       </h3>
     </div>
 
@@ -62,6 +62,7 @@ import { Component, Prop, Vue } from "vue-facing-decorator";
 import EntityIcon from "./EntityIcon.vue";
 import ProjectIcon from "./ProjectIcon.vue";
 import { Contact } from "../db/tables/contacts";
+import { UNNAMED_ENTITY_NAME } from "@/constants/entities";
 
 /**
  * Entity interface for both person and project entities
@@ -138,6 +139,38 @@ export default class EntitySummaryButton extends Vue {
     return this.editable ? "text-blue-500" : "text-slate-400";
   }
 
+  /**
+   * Computed CSS classes for the entity name
+   */
+  get nameClasses(): string {
+    const baseClasses = "font-semibold truncate";
+
+    // Add italic styling for special "Unnamed" or entities without set names
+    if (!this.entity?.name || this.entity?.did === "") {
+      return `${baseClasses} italic text-slate-500`;
+    }
+
+    return baseClasses;
+  }
+
+  /**
+   * Computed display name for the entity
+   */
+  get displayName(): string {
+    // If the entity has a set name, use that name
+    if (this.entity?.name) {
+      return this.entity.name;
+    }
+
+    // If the entity is the special "Unnamed", use "Unnamed"
+    if (this.entity?.did === "") {
+      return UNNAMED_ENTITY_NAME;
+    }
+
+    // If the entity does not have a set name, but is not the special "Unnamed", use their DID
+    return this.entity?.did;
+  }
+
   /**
    * Handle click event - only call function prop if editable
    * Allows parent to control edit behavior and validation

src/components/GiftedDialog.vue

@@ -29,6 +29,7 @@
         :unit-code="unitCode"
         :offer-id="offerId"
         :notify="$notify"
+        :hide-show-all="hideShowAll"
         @entity-selected="handleEntitySelected"
         @cancel="cancel"
       />
@@ -81,12 +82,14 @@ import GiftDetailsStep from "../components/GiftDetailsStep.vue";
 import { PlanData } from "../interfaces/records";
 import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
 import { createNotifyHelpers, TIMEOUTS, NotifyFunction } from "@/utils/notify";
+import { showSeedPhraseReminder } from "@/utils/seedPhraseReminder";
 import {
   NOTIFY_GIFT_ERROR_NEGATIVE_AMOUNT,
   NOTIFY_GIFT_ERROR_NO_DESCRIPTION,
   NOTIFY_GIFTED_DETAILS_NO_IDENTIFIER,
   NOTIFY_GIFTED_DETAILS_RECORDING_GIVE,
 } from "@/constants/notifications";
+import { UNNAMED_ENTITY_NAME } from "@/constants/entities";
 
 @Component({
   components: {
@@ -114,6 +117,7 @@ export default class GiftedDialog extends Vue {
   @Prop() fromProjectId = "";
   @Prop() toProjectId = "";
   @Prop() isFromProjectView = false;
+  @Prop() hideShowAll = false;
   @Prop({ default: "person" }) giverEntityType = "person" as
     | "person"
     | "project";
@@ -224,15 +228,6 @@ export default class GiftedDialog extends Vue {
 
       this.allMyDids = await retrieveAccountDids();
 
-      if (this.giver && !this.giver.name) {
-        this.giver.name = didInfo(
-          this.giver.did,
-          this.activeDid,
-          this.allMyDids,
-          this.allContacts,
-        );
-      }
-
       if (
         this.giverEntityType === "project" ||
         this.recipientEntityType === "project"
@@ -417,6 +412,15 @@ export default class GiftedDialog extends Vue {
         );
       } else {
         this.safeNotify.success("That gift was recorded.", TIMEOUTS.VERY_LONG);
+
+        // Show seed phrase backup reminder if needed
+        try {
+          const settings = await this.$accountSettings();
+          showSeedPhraseReminder(!!settings.hasBackedUpSeed, this.$notify);
+        } catch (error) {
+          logger.error("Error checking seed backup status:", error);
+        }
+
         if (this.callbackOnSuccess) {
           this.callbackOnSuccess(amount);
         }
@@ -455,14 +459,14 @@ export default class GiftedDialog extends Vue {
     if (contact) {
       this.giver = {
         did: contact.did,
-        name: contact.name || contact.did,
+        name: contact.name,
       };
     } else {
       // Only set to "Unnamed" if no giver is currently set
       if (!this.giver || !this.giver.did) {
         this.giver = {
           did: "",
-          name: "Unnamed",
+          name: UNNAMED_ENTITY_NAME,
         };
       }
     }
@@ -517,14 +521,14 @@ export default class GiftedDialog extends Vue {
     if (contact) {
       this.receiver = {
         did: contact.did,
-        name: contact.name || contact.did,
+        name: contact.name,
       };
     } else {
       // Only set to "Unnamed" if no receiver is currently set
       if (!this.receiver || !this.receiver.did) {
         this.receiver = {
           did: "",
-          name: "Unnamed",
+          name: UNNAMED_ENTITY_NAME,
         };
       }
     }
@@ -566,20 +570,21 @@ export default class GiftedDialog extends Vue {
 
   /**
    * Handle entity selection from EntitySelectionStep
-   * @param entity - The selected entity (person, project, or special) with stepType
+   * @param entity - The selected entity (person or project) with stepType
    */
   handleEntitySelected(entity: {
-    type: "person" | "project" | "special";
+    type: "person" | "project";
-    entityType?: string;
+    data: Contact | PlanData;
-    data: Contact | PlanData | { did?: string; name: string };
     stepType: string;
   }) {
     if (entity.type === "person") {
       const contact = entity.data as Contact;
+      // Apply DID-based logic for person entities
+      const processedContact = this.processPersonEntity(contact);
       if (entity.stepType === "giver") {
-        this.selectGiver(contact);
+        this.selectGiver(processedContact);
       } else {
-        this.selectRecipient(contact);
+        this.selectRecipient(processedContact);
       }
     } else if (entity.type === "project") {
       const project = entity.data as PlanData;
@@ -588,33 +593,22 @@ export default class GiftedDialog extends Vue {
       } else {
         this.selectRecipientProject(project);
       }
-    } else if (entity.type === "special") {
+    }
-      // Handle special entities like "You" and "Unnamed"
+  }
-      if (entity.entityType === "you") {
+
-        // "You" entity selected
+  /**
-        const youEntity = {
+   * Processes person entities using DID-based logic for "You" and "Unnamed"
-          did: this.activeDid,
+   */
-          name: "You",
+  private processPersonEntity(contact: Contact): Contact {
-        };
+    if (contact.did === this.activeDid) {
-        if (entity.stepType === "giver") {
+      // If DID matches active DID, create "You" entity
-          this.giver = youEntity;
+      return { ...contact, name: "You" };
-        } else {
+    } else if (!contact.did || contact.did === "") {
-          this.receiver = youEntity;
+      // If DID is empty/null, create "Unnamed" entity
-        }
+      return { ...contact, name: UNNAMED_ENTITY_NAME };
-        this.firstStep = false;
+    } else {
-      } else if (entity.entityType === "unnamed") {
+      // Return the contact as-is
-        // "Unnamed" entity selected
+      return contact;
-        const unnamedEntity = {
-          did: "",
-          name: "Unnamed",
-        };
-        if (entity.stepType === "giver") {
-          this.giver = unnamedEntity;
-        } else {
-          this.receiver = unnamedEntity;
-        }
-        this.firstStep = false;
-      }
     }
   }
 

src/components/HiddenDidDialog.vue

@@ -74,7 +74,7 @@
             If you'd like an introduction,
             <a
               class="text-blue-500"
-              @click="copyToClipboard('A link to this page', deepLinkUrl)"
+              @click="copyTextToClipboard('A link to this page', deepLinkUrl)"
               >click here to copy this page, paste it into a message, and ask if
               they'll tell you more about the {{ roleName }}.</a
             >
@@ -110,7 +110,7 @@
  * @since 2024-12-19
  */
 import { Component, Vue } from "vue-facing-decorator";
-import { useClipboard } from "@vueuse/core";
+import { copyToClipboard } from "../services/ClipboardService";
 import * as R from "ramda";
 import * as serverUtil from "../libs/endorserServer";
 import { Contact } from "../db/tables/contacts";
@@ -197,19 +197,24 @@ export default class HiddenDidDialog extends Vue {
     );
   }
 
-  copyToClipboard(name: string, text: string) {
+  async copyTextToClipboard(name: string, text: string) {
-    useClipboard()
+    try {
-      .copy(text)
+      await copyToClipboard(text);
-      .then(() => {
+      this.notify.success(
-        this.notify.success(
+        NOTIFY_COPIED_TO_CLIPBOARD.message(name || "That"),
-          NOTIFY_COPIED_TO_CLIPBOARD.message(name || "That"),
+        TIMEOUTS.SHORT,
-          TIMEOUTS.SHORT,
+      );
-        );
+    } catch (error) {
-      });
+      this.$logAndConsole(
+        `Error copying ${name || "content"} to clipboard: ${error}`,
+        true,
+      );
+      this.notify.error(`Failed to copy ${name || "content"} to clipboard.`);
+    }
   }
 
   onClickShareClaim() {
-    this.copyToClipboard("A link to this page", this.deepLinkUrl);
+    this.copyTextToClipboard("A link to this page", this.deepLinkUrl);
     window.navigator.share({
       title: "Help Connect Me",
       text: "I'm trying to find the people who recorded this. Can you help me?",

src/components/LocationSearchSection.vue

@@ -26,7 +26,7 @@
           :weight="2"
           color="#3b82f6"
           fill-color="#3b82f6"
-          fill-opacity="0.2"
+          :fill-opacity="0.2"
         />
       </l-map>
     </div>

src/components/MembersList.vue

@@ -81,7 +81,7 @@
         <div class="flex items-center justify-between">
           <div class="flex items-center">
             <h3 class="text-lg font-medium">
-              {{ member.name || "Unnamed Member" }}
+              {{ member.name || unnamedMember }}
             </h3>
             <div
               v-if="!getContactFor(member.did) && member.did !== activeDid"
@@ -177,6 +177,7 @@ import {
   NOTIFY_ADD_CONTACT_FIRST,
   NOTIFY_CONTINUE_WITHOUT_ADDING,
 } from "@/constants/notifications";
+import { SOMEONE_UNNAMED } from "@/constants/entities";
 
 interface Member {
   admitted: boolean;
@@ -220,6 +221,13 @@ export default class MembersList extends Vue {
   apiServer = "";
   contacts: Array<Contact> = [];
 
+  /**
+   * Get the unnamed member constant
+   */
+  get unnamedMember(): string {
+    return SOMEONE_UNNAMED;
+  }
+
   async created() {
     this.notify = createNotifyHelpers(this.$notify);
 

src/components/OfferDialog.vue

@@ -64,6 +64,7 @@ import * as libsUtil from "../libs/util";
 import { logger } from "../utils/logger";
 import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
 import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
+import { showSeedPhraseReminder } from "@/utils/seedPhraseReminder";
 import {
   NOTIFY_OFFER_SETTINGS_ERROR,
   NOTIFY_OFFER_RECORDING,
@@ -299,6 +300,14 @@ export default class OfferDialog extends Vue {
         );
       } else {
         this.notify.success(NOTIFY_OFFER_SUCCESS.message, TIMEOUTS.VERY_LONG);
+
+        // Show seed phrase backup reminder if needed
+        try {
+          const settings = await this.$accountSettings();
+          showSeedPhraseReminder(!!settings.hasBackedUpSeed, this.$notify);
+        } catch (error) {
+          logger.error("Error checking seed backup status:", error);
+        }
       }
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
     } catch (error: any) {

src/components/PersonCard.vue

@@ -25,7 +25,7 @@ conflict detection. * * @author Matthew Raymer */
     </div>
 
     <h3 :class="nameClasses">
-      {{ person.name || person.did || "Unnamed" }}
+      {{ displayName }}
     </h3>
   </li>
 </template>
@@ -98,9 +98,27 @@ export default class PersonCard extends Vue {
       return `${baseClasses} text-slate-400`;
     }
 
+    // Add italic styling for entities without set names
+    if (!this.person.name) {
+      return `${baseClasses} italic text-slate-500`;
+    }
+
     return baseClasses;
   }
 
+  /**
+   * Computed display name for the person
+   */
+  get displayName(): string {
+    // If the entity has a set name, use that name
+    if (this.person.name) {
+      return this.person.name;
+    }
+
+    // If the entity does not have a set name
+    return this.person.did;
+  }
+
   /**
    * Handle card click - emit if selectable and not conflicted, show warning if conflicted
    */
@@ -114,7 +132,7 @@ export default class PersonCard extends Vue {
           group: "alert",
           type: "warning",
           title: "Cannot Select",
-          text: `You cannot select "${this.person.name || this.person.did || "Unnamed"}" because they are already selected as the ${this.conflictContext}.`,
+          text: `You cannot select "${this.displayName}" because they are already selected as the ${this.conflictContext}.`,
         },
         3000,
       );

src/components/PhotoDialog.vue

@@ -10,7 +10,7 @@ Comprehensive error handling * * @author Matthew Raymer * @version 1.0.0 * @file
 PhotoDialog.vue */
 
 <template>
-  <div v-if="visible" class="dialog-overlay>
+  <div v-if="visible" class="dialog-overlay">
     <div class="dialog relative">
       <div class="text-lg text-center font-light relative z-50">
         <div id="ViewHeading" :class="headingClasses">

src/components/ProjectCard.vue

@@ -15,7 +15,7 @@ issuer information. * * @author Matthew Raymer */
     <h3
       class="text-xs font-medium text-ellipsis whitespace-nowrap overflow-hidden"
     >
-      {{ project.name || "Unnamed Project" }}
+      {{ project.name || unnamedProject }}
     </h3>
 
     <div class="text-xs text-slate-500 truncate">
@@ -31,6 +31,7 @@ import ProjectIcon from "./ProjectIcon.vue";
 import { PlanData } from "../interfaces/records";
 import { Contact } from "../db/tables/contacts";
 import { didInfo } from "../libs/endorserServer";
+import { UNNAMED_PROJECT } from "@/constants/entities";
 
 /**
  * ProjectCard - Displays a project entity with selection capability
@@ -63,6 +64,13 @@ export default class ProjectCard extends Vue {
   @Prop({ required: true })
   allContacts!: Contact[];
 
+  /**
+   * Get the unnamed project constant
+   */
+  get unnamedProject(): string {
+    return UNNAMED_PROJECT;
+  }
+
   /**
    * Computed display name for the project issuer
    */

src/components/PushNotificationPermission.vue

@@ -115,6 +115,7 @@ import { urlBase64ToUint8Array } from "../libs/crypto/vc/util";
 import * as libsUtil from "../libs/util";
 import { logger } from "../utils/logger";
 import { PlatformServiceMixin } from "../utils/PlatformServiceMixin";
+import { UNNAMED_ENTITY_NAME } from "@/constants/entities";
 
 // Example interface for error
 interface ErrorResponse {
@@ -602,7 +603,7 @@ export default class PushNotificationPermission extends Vue {
    * Returns the default message for direct push
    */
   get notificationMessagePlaceholder(): string {
-    return "Click to share some gratitude with the world -- even if they're unnamed.";
+    return `Click to share some gratitude with the world -- even if they're ${UNNAMED_ENTITY_NAME.toLowerCase()}.`;
   }
 
   /**

src/components/QuickNav.vue

@@ -2,7 +2,7 @@
   <!-- QUICK NAV -->
   <nav
     id="QuickNav"
-    class="fixed bottom-0 left-0 right-0 bg-slate-200 z-50 pb-[env(safe-area-inset-bottom)]"
+    class="fixed bottom-0 left-0 right-0 bg-slate-200 z-50 pb-[max(env(safe-area-inset-bottom),var(--safe-area-inset-bottom,0px))]"
   >
     <ul class="flex text-2xl px-6 py-2 gap-1 max-w-3xl mx-auto">
       <!-- Home Feed -->

src/components/SpecialEntityCard.vue

@@ -124,8 +124,6 @@ export default class SpecialEntityCard extends Vue {
   handleClick(): void {
     if (this.selectable && !this.conflicted) {
       this.emitEntitySelected({
-        type: "special",
-        entityType: this.entityType,
         data: this.entityData,
       });
     } else if (this.conflicted && this.notify) {
@@ -145,13 +143,7 @@ export default class SpecialEntityCard extends Vue {
   // Emit methods using @Emit decorator
 
   @Emit("entity-selected")
-  emitEntitySelected(data: {
+  emitEntitySelected(data: { data: { did?: string; name: string } }): {
-    type: string;
-    entityType: string;
-    data: { did?: string; name: string };
-  }): {
-    type: string;
-    entityType: string;
     data: { did?: string; name: string };
   } {
     return data;

src/components/TopMessage.vue

@@ -1,5 +1,7 @@
 <template>
-  <div class="absolute right-5 top-[max(0.75rem,env(safe-area-inset-top))]">
+  <div
+    class="absolute right-5 top-[max(0.75rem,env(safe-area-inset-top),var(--safe-area-inset-top,0px))]"
+  >
     <span class="align-center text-red-500 mr-2">{{ message }}</span>
     <span class="ml-2">
       <router-link
@@ -18,6 +20,7 @@ import { Component, Vue, Prop } from "vue-facing-decorator";
 import { AppString, NotificationIface } from "../constants/app";
 import { PlatformServiceMixin } from "../utils/PlatformServiceMixin";
 import { createNotifyHelpers, TIMEOUTS } from "../utils/notify";
+import { logger } from "../utils/logger";
 
 @Component({
   mixins: [PlatformServiceMixin],
@@ -42,26 +45,49 @@ export default class TopMessage extends Vue {
     this.notify = createNotifyHelpers(this.$notify);
 
     try {
-      // Ultra-concise cached settings loading - replaces 50+ lines of logic!
+      // Load settings without overriding database values - fixes settings inconsistency
-      const settings = await this.$accountSettings(undefined, {
+      logger.debug("[TopMessage] 📥 Loading settings without overrides...");
-        activeDid: undefined,
+      const settings = await this.$accountSettings();
-        apiServer: AppString.PROD_ENDORSER_API_SERVER,
+
+      logger.debug("[TopMessage] 📊 Settings loaded:", {
+        activeDid: settings.activeDid,
+        apiServer: settings.apiServer,
+        warnIfTestServer: settings.warnIfTestServer,
+        warnIfProdServer: settings.warnIfProdServer,
+        component: "TopMessage",
+        timestamp: new Date().toISOString(),
       });
 
+      // Only show warnings if the user has explicitly enabled them
       if (
         settings.warnIfTestServer &&
+        settings.apiServer &&
         settings.apiServer !== AppString.PROD_ENDORSER_API_SERVER
       ) {
         const didPrefix = settings.activeDid?.slice(11, 15);
         this.message = "You're not using prod, user " + didPrefix;
+        logger.debug("[TopMessage] ⚠️ Test server warning displayed:", {
+          apiServer: settings.apiServer,
+          didPrefix: didPrefix,
+        });
       } else if (
         settings.warnIfProdServer &&
+        settings.apiServer &&
         settings.apiServer === AppString.PROD_ENDORSER_API_SERVER
       ) {
         const didPrefix = settings.activeDid?.slice(11, 15);
         this.message = "You are using prod, user " + didPrefix;
+        logger.debug("[TopMessage] ⚠️ Production server warning displayed:", {
+          apiServer: settings.apiServer,
+          didPrefix: didPrefix,
+        });
+      } else {
+        logger.debug(
+          "[TopMessage] ℹ️ No warnings displayed - conditions not met",
+        );
       }
     } catch (err: unknown) {
+      logger.error("[TopMessage] ❌ Error loading settings:", err);
       this.notify.error(JSON.stringify(err), TIMEOUTS.MODAL);
     }
   }

src/components/UserNameDialog.vue

@@ -84,7 +84,8 @@ export default class UserNameDialog extends Vue {
    */
   async open(aCallback?: (name?: string) => void) {
     this.callback = aCallback || this.callback;
-    const settings = await this.$settings();
+    // Load from account-specific settings instead of master settings
+    const settings = await this.$accountSettings();
     this.givenName = settings.firstName || "";
     this.visible = true;
   }
@@ -95,7 +96,18 @@ export default class UserNameDialog extends Vue {
    */
   async onClickSaveChanges() {
     try {
-      await this.$updateSettings({ firstName: this.givenName });
+      // Get the current active DID to save to user-specific settings
+      const settings = await this.$accountSettings();
+      const activeDid = settings.activeDid;
+
+      if (activeDid) {
+        // Save to user-specific settings for the current identity
+        await this.$saveUserSettings(activeDid, { firstName: this.givenName });
+      } else {
+        // Fallback to master settings if no active DID
+        await this.$saveSettings({ firstName: this.givenName });
+      }
+
       this.visible = false;
       this.callback(this.givenName);
     } catch (error) {

src/constants/entities.ts

@@ -0,0 +1,14 @@
+/**
+ * Constants for entity-related strings, particularly for unnamed/unknown person entities
+ */
+
+// Core unnamed entity names
+export const UNNAMED_ENTITY_NAME = "Unnamed";
+
+// Descriptive phrases for unnamed entities
+export const SOMEONE_UNNAMED = "Someone Unnamed";
+export const THAT_UNNAMED_PERSON = "That unnamed person";
+export const UNNAMED_PERSON = "unnamed person";
+
+// Project-related unnamed entities
+export const UNNAMED_PROJECT = "Unnamed Project";

src/constants/notifications.ts

@@ -1,4 +1,5 @@
 import axios from "axios";
+import { THAT_UNNAMED_PERSON } from "./entities";
 
 // Notification message constants for user-facing notifications
 // Add new notification messages here as needed
@@ -873,7 +874,7 @@ export const NOTIFY_CONTACT_LINK_COPIED = {
 // Template for registration success message
 // Used in: ContactsView.vue (register method - registration success with contact name)
 export const getRegisterPersonSuccessMessage = (name?: string): string =>
-  `${name || "That unnamed person"} ${NOTIFY_REGISTER_PERSON_SUCCESS.message}`;
+  `${name || THAT_UNNAMED_PERSON} ${NOTIFY_REGISTER_PERSON_SUCCESS.message}`;
 
 // Template for visibility success message
 // Used in: ContactsView.vue (setVisibility method - visibility success with contact name)
@@ -1378,7 +1379,7 @@ export function createQRContactAddedMessage(hasVisibility: boolean): string {
 export function createQRRegistrationSuccessMessage(
   contactName: string,
 ): string {
-  return `${contactName || "That unnamed person"}${NOTIFY_QR_REGISTRATION_SUCCESS.message}`;
+  return `${contactName || THAT_UNNAMED_PERSON}${NOTIFY_QR_REGISTRATION_SUCCESS.message}`;
 }
 
 // ContactQRScanShowView.vue timeout constants
@@ -1688,3 +1689,11 @@ export const NOTIFY_CONTACTS_ADDED_CONFIRM = {
   title: "They're Added To Your List",
   message: "Would you like to go to the main page now?",
 };
+
+// ImportAccountView.vue specific constants
+// Used in: ImportAccountView.vue (onImportClick method - duplicate account warning)
+export const NOTIFY_DUPLICATE_ACCOUNT_IMPORT = {
+  title: "Account Already Imported",
+  message:
+    "This account has already been imported. Please use a different seed phrase or check your existing accounts.",
+};

src/db-sql/migration.ts

@@ -124,6 +124,12 @@ const MIGRATIONS = [
       ALTER TABLE contacts ADD COLUMN iViewContent BOOLEAN DEFAULT TRUE;
     `,
   },
+  {
+    name: "003_add_hasBackedUpSeed_to_settings",
+    sql: `
+      ALTER TABLE settings ADD COLUMN hasBackedUpSeed BOOLEAN DEFAULT FALSE;
+    `,
+  },
 ];
 
 /**

src/db/tables/settings.ts

@@ -29,6 +29,7 @@ export type Settings = {
   finishedOnboarding?: boolean; // the user has completed the onboarding process
 
   firstName?: string; // user's full name, may be null if unwanted for a particular account
+  hasBackedUpSeed?: boolean; // tracks whether the user has backed up their seed phrase
   hideRegisterPromptOnNewContact?: boolean;
   isRegistered?: boolean;
   // imageServer?: string; // if we want to allow modification then we should make image functionality optional -- or at least customizable

src/libs/endorserServer.ts

@@ -60,6 +60,7 @@ import { PlanSummaryRecord } from "../interfaces/records";
 import { logger } from "../utils/logger";
 import { PlatformServiceFactory } from "@/services/PlatformServiceFactory";
 import { APP_SERVER } from "@/constants/app";
+import { SOMEONE_UNNAMED } from "@/constants/entities";
 
 /**
  * Standard context for schema.org data
@@ -309,7 +310,7 @@ export function didInfoForContact(
   showDidForVisible: boolean = false,
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
 ): { known: boolean; displayName: string; profileImageUrl?: string } {
-  if (!did) return { displayName: "Someone Not Named", known: false };
+  if (!did) return { displayName: SOMEONE_UNNAMED, known: false };
   if (did === activeDid) {
     return { displayName: "You", known: true };
   } else if (contact) {
@@ -485,6 +486,15 @@ const planCache: LRUCache<string, PlanSummaryRecord> = new LRUCache({
   max: 500,
 });
 
+/**
+ * Tracks in-flight requests to prevent duplicate API calls for the same plan
+ * @constant {Map}
+ */
+const inFlightRequests = new Map<
+  string,
+  Promise<PlanSummaryRecord | undefined>
+>();
+
 /**
  * Retrieves plan data from cache or server
  * @param {string} handleId - Plan handle ID
@@ -504,40 +514,140 @@ export async function getPlanFromCache(
   if (!handleId) {
     return undefined;
   }
-  let cred = planCache.get(handleId);
-  if (!cred) {
-    const url =
-      apiServer +
-      "/api/v2/report/plans?handleId=" +
-      encodeURIComponent(handleId);
-    const headers = await getHeaders(requesterDid);
-    try {
-      const resp = await axios.get(url, { headers });
-      if (resp.status === 200 && resp.data?.data?.length > 0) {
-        cred = resp.data.data[0];
-        planCache.set(handleId, cred);
-      } else {
-        // Use debug level for development to reduce console noise
-        const isDevelopment = process.env.VITE_PLATFORM === "development";
-        const log = isDevelopment ? logger.debug : logger.log;
 
-        log(
+  // Check cache first (existing behavior)
-          "[EndorserServer] Plan cache is empty for handle",
+  const cred = planCache.get(handleId);
-          handleId,
+  if (cred) {
-          " Got data:",
+    return cred;
-          JSON.stringify(resp.data),
+  }
-        );
+
-      }
+  // Check if request is already in flight (NEW: request deduplication)
-    } catch (error) {
+  if (inFlightRequests.has(handleId)) {
-      logger.error(
+    logger.debug(
-        "[EndorserServer] Failed to load plan with handle",
+      "[Plan Loading] 🔄 Request already in flight, reusing promise:",
-        handleId,
+      {
-        " Got error:",
+        handleId,
-        JSON.stringify(error),
+        requesterDid,
-      );
+        timestamp: new Date().toISOString(),
-    }
+      },
+    );
+    return inFlightRequests.get(handleId);
+  }
+
+  // Create new request promise (NEW: request coordination)
+  const requestPromise = performPlanRequest(
+    handleId,
+    axios,
+    apiServer,
+    requesterDid,
+  );
+  inFlightRequests.set(handleId, requestPromise);
+
+  try {
+    const result = await requestPromise;
+    return result;
+  } finally {
+    // Clean up in-flight request tracking (NEW: cleanup)
+    inFlightRequests.delete(handleId);
+  }
+}
+
+/**
+ * Performs the actual plan request to the server
+ * @param {string} handleId - Plan handle ID
+ * @param {Axios} axios - Axios instance
+ * @param {string} apiServer - API server URL
+ * @param {string} [requesterDid] - Optional requester DID for private info
+ * @returns {Promise<PlanSummaryRecord|undefined>} Plan data or undefined if not found
+ *
+ * @throws {Error} If server request fails
+ */
+async function performPlanRequest(
+  handleId: string,
+  axios: Axios,
+  apiServer: string,
+  requesterDid?: string,
+): Promise<PlanSummaryRecord | undefined> {
+  const url =
+    apiServer + "/api/v2/report/plans?handleId=" + encodeURIComponent(handleId);
+  const headers = await getHeaders(requesterDid);
+
+  // Enhanced diagnostic logging for plan loading
+  const requestId = `plan_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
+
+  logger.debug("[Plan Loading] 🔍 Loading plan from server:", {
+    requestId,
+    handleId,
+    apiServer,
+    endpoint: url,
+    requesterDid,
+    timestamp: new Date().toISOString(),
+  });
+
+  try {
+    const resp = await axios.get(url, { headers });
+
+    logger.debug("[Plan Loading] ✅ Plan loaded successfully:", {
+      requestId,
+      handleId,
+      status: resp.status,
+      hasData: !!resp.data?.data,
+      dataLength: resp.data?.data?.length || 0,
+      timestamp: new Date().toISOString(),
+    });
+
+    if (resp.status === 200 && resp.data?.data?.length > 0) {
+      const cred = resp.data.data[0];
+      planCache.set(handleId, cred);
+
+      logger.debug("[Plan Loading] 💾 Plan cached:", {
+        requestId,
+        handleId,
+        planName: cred?.name,
+        planIssuer: cred?.issuerDid,
+      });
+
+      return cred;
+    } else {
+      // Use debug level for development to reduce console noise
+      const isDevelopment = process.env.VITE_PLATFORM === "development";
+      const log = isDevelopment ? logger.debug : logger.log;
+
+      log(
+        "[Plan Loading] ⚠️ Plan cache is empty for handle",
+        handleId,
+        " Got data:",
+        JSON.stringify(resp.data),
+      );
+
+      return undefined;
+    }
+  } catch (error) {
+    // Enhanced error logging for plan loading failures
+    const axiosError = error as {
+      response?: {
+        data?: unknown;
+        status?: number;
+        statusText?: string;
+      };
+      message?: string;
+    };
+
+    logger.error("[Plan Loading] ❌ Failed to load plan:", {
+      requestId,
+      handleId,
+      apiServer,
+      endpoint: url,
+      requesterDid,
+      errorStatus: axiosError.response?.status,
+      errorStatusText: axiosError.response?.statusText,
+      errorData: axiosError.response?.data,
+      errorMessage: axiosError.message || String(error),
+      timestamp: new Date().toISOString(),
+    });
+
+    throw error;
   }
-  return cred;
 }
 
 /**
@@ -1018,19 +1128,82 @@ export async function createAndSubmitClaim(
 
     const vcJwt: string = await createEndorserJwtForDid(issuerDid, vcPayload);
 
+    // Enhanced diagnostic logging for claim submission
+    const requestId = `claim_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
+
+    logger.info("[Claim Submission] 🚀 Starting claim submission:", {
+      requestId,
+      apiServer,
+      requesterDid: issuerDid,
+      endpoint: `${apiServer}/api/v2/claim`,
+      timestamp: new Date().toISOString(),
+      jwtLength: vcJwt.length,
+    });
+
     // Make the xhr request payload
     const payload = JSON.stringify({ jwtEncoded: vcJwt });
     const url = `${apiServer}/api/v2/claim`;
 
+    logger.debug("[Claim Submission] 📡 Making API request:", {
+      requestId,
+      url,
+      payloadSize: payload.length,
+      headers: { "Content-Type": "application/json" },
+    });
+
     const response = await axios.post(url, payload, {
       headers: {
         "Content-Type": "application/json",
       },
     });
 
+    logger.info("[Claim Submission] ✅ Claim submitted successfully:", {
+      requestId,
+      status: response.status,
+      handleId: response.data?.handleId,
+      responseSize: JSON.stringify(response.data).length,
+      timestamp: new Date().toISOString(),
+    });
+
     return { success: true, handleId: response.data?.handleId };
   } catch (error: unknown) {
-    logger.error("Error submitting claim:", error);
+    // Enhanced error logging with comprehensive context
+    const requestId = `claim_error_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
+
+    const axiosError = error as {
+      response?: {
+        data?: { error?: { code?: string; message?: string } };
+        status?: number;
+        statusText?: string;
+        headers?: Record<string, string>;
+      };
+      config?: {
+        url?: string;
+        method?: string;
+        headers?: Record<string, string>;
+      };
+      message?: string;
+    };
+
+    logger.error("[Claim Submission] ❌ Claim submission failed:", {
+      requestId,
+      apiServer,
+      requesterDid: issuerDid,
+      endpoint: `${apiServer}/api/v2/claim`,
+      errorCode: axiosError.response?.data?.error?.code,
+      errorMessage: axiosError.response?.data?.error?.message,
+      httpStatus: axiosError.response?.status,
+      httpStatusText: axiosError.response?.statusText,
+      responseHeaders: axiosError.response?.headers,
+      requestConfig: {
+        url: axiosError.config?.url,
+        method: axiosError.config?.method,
+        headers: axiosError.config?.headers,
+      },
+      originalError: axiosError.message || String(error),
+      timestamp: new Date().toISOString(),
+    });
+
     const errorMessage: string =
       serverMessageForUser(error) ||
       (error && typeof error === "object" && "message" in error
@@ -1140,6 +1313,28 @@ export const capitalizeAndInsertSpacesBeforeCaps = (text: string) => {
     : text[0].toUpperCase() + text.substr(1).replace(/([A-Z])/g, " $1");
 };
 
+/**
+ * Formats type string for display by adding spaces before capitals
+ * and optionally adds an appropriate article prefix (a/an)
+ *
+ * @param text - Text to format
+ * @returns Formatted string with article prefix
+ */
+export const capitalizeAndInsertSpacesBeforeCapsWithAPrefix = (
+  text: string,
+): string => {
+  const word = capitalizeAndInsertSpacesBeforeCaps(text);
+  if (word) {
+    // if the word starts with a vowel, use "an" instead of "a"
+    const firstLetter = word[0].toLowerCase();
+    const vowels = ["a", "e", "i", "o", "u"];
+    const particle = vowels.includes(firstLetter) ? "an" : "a";
+    return particle + " " + word;
+  } else {
+    return "";
+  }
+};
+
 /**
  return readable summary of claim, or something generic
 
@@ -1493,14 +1688,56 @@ export async function fetchEndorserRateLimits(
 ) {
   const url = `${apiServer}/api/report/rateLimits`;
   const headers = await getHeaders(issuerDid);
+
+  // Enhanced diagnostic logging for user registration tracking
+  logger.debug("[User Registration] Checking user status on server:", {
+    did: issuerDid,
+    server: apiServer,
+    endpoint: url,
+    timestamp: new Date().toISOString(),
+  });
+
   try {
     const response = await axios.get(url, { headers } as AxiosRequestConfig);
+
+    // Log successful registration check
+    logger.debug("[User Registration] User registration check successful:", {
+      did: issuerDid,
+      server: apiServer,
+      status: response.status,
+      isRegistered: true,
+      timestamp: new Date().toISOString(),
+    });
+
     return response;
   } catch (error) {
+    // Enhanced error logging with user registration context
+    const axiosError = error as {
+      response?: {
+        data?: { error?: { code?: string; message?: string } };
+        status?: number;
+      };
+    };
+    const errorCode = axiosError.response?.data?.error?.code;
+    const errorMessage = axiosError.response?.data?.error?.message;
+    const httpStatus = axiosError.response?.status;
+
+    logger.warn("[User Registration] User not registered on server:", {
+      did: issuerDid,
+      server: apiServer,
+      errorCode: errorCode,
+      errorMessage: errorMessage,
+      httpStatus: httpStatus,
+      needsRegistration: true,
+      timestamp: new Date().toISOString(),
+    });
+
+    // Log the original error for debugging
     logger.error(
       `[fetchEndorserRateLimits] Error for DID ${issuerDid}:`,
       errorStringForLog(error),
     );
+
     throw error;
   }
 }
@@ -1513,8 +1750,53 @@ export async function fetchEndorserRateLimits(
  * @param {string} issuerDid - The DID for which to check rate limits.
  * @returns {Promise<AxiosResponse>} The Axios response object.
  */
-export async function fetchImageRateLimits(axios: Axios, issuerDid: string) {
+export async function fetchImageRateLimits(
-  const url = DEFAULT_IMAGE_API_SERVER + "/image-limits";
+  axios: Axios,
+  issuerDid: string,
+  imageServer?: string,
+) {
+  const server = imageServer || DEFAULT_IMAGE_API_SERVER;
+  const url = server + "/image-limits";
   const headers = await getHeaders(issuerDid);
-  return await axios.get(url, { headers } as AxiosRequestConfig);
+
+  // Enhanced diagnostic logging for image server calls
+  logger.debug("[Image Server] Checking image rate limits:", {
+    did: issuerDid,
+    server: server,
+    endpoint: url,
+    timestamp: new Date().toISOString(),
+  });
+
+  try {
+    const response = await axios.get(url, { headers } as AxiosRequestConfig);
+
+    // Log successful image server call
+    logger.debug("[Image Server] Image rate limits check successful:", {
+      did: issuerDid,
+      server: server,
+      status: response.status,
+      timestamp: new Date().toISOString(),
+    });
+
+    return response;
+  } catch (error) {
+    // Enhanced error logging for image server failures
+    const axiosError = error as {
+      response?: {
+        data?: { error?: { code?: string; message?: string } };
+        status?: number;
+      };
+    };
+
+    logger.warn("[Image Server] Image rate limits check failed:", {
+      did: issuerDid,
+      server: server,
+      errorCode: axiosError.response?.data?.error?.code,
+      errorMessage: axiosError.response?.data?.error?.message,
+      httpStatus: axiosError.response?.status,
+      timestamp: new Date().toISOString(),
+    });
+
+    throw error;
+  }
 }

src/libs/util.ts

@@ -3,7 +3,7 @@
 import axios, { AxiosResponse } from "axios";
 import { Buffer } from "buffer";
 import * as R from "ramda";
-import { useClipboard } from "@vueuse/core";
+import { copyToClipboard } from "../services/ClipboardService";
 
 import { DEFAULT_PUSH_SERVER, NotificationIface } from "../constants/app";
 import { Account, AccountEncrypted } from "../db/tables/accounts";
@@ -33,6 +33,7 @@ import { logger } from "../utils/logger";
 import { PlatformServiceFactory } from "../services/PlatformServiceFactory";
 import { IIdentifier } from "@veramo/core";
 import { DEFAULT_ROOT_DERIVATION_PATH } from "./crypto";
+import { UNNAMED_PERSON } from "@/constants/entities";
 
 // Consolidate this with src/utils/PlatformServiceMixin.mapQueryResultToValues
 function mapQueryResultToValues(
@@ -159,6 +160,41 @@ export const isGiveAction = (
   return isGiveClaimType(veriClaim.claimType);
 };
 
+export interface OfferFulfillment {
+  offerHandleId: string;
+  offerType: string;
+}
+
+/**
+ * Extract offer fulfillment information from the fulfills field
+ * Handles both array and single object cases
+ */
+export const extractOfferFulfillment = (fulfills: any): OfferFulfillment | null => {
+  if (!fulfills) {
+    return null;
+  }
+  
+  // Handle both array and single object cases
+  let offerFulfill = null;
+  
+  if (Array.isArray(fulfills)) {
+    // Find the Offer in the fulfills array
+    offerFulfill = fulfills.find((item) => item["@type"] === "Offer");
+  } else if (fulfills["@type"] === "Offer") {
+    // fulfills is a single Offer object
+    offerFulfill = fulfills;
+  }
+  
+  if (offerFulfill) {
+    return {
+      offerHandleId: offerFulfill.identifier,
+      offerType: offerFulfill["@type"],
+    };
+  }
+  
+  return null;
+};
+
 export const shortDid = (did: string) => {
   if (did.startsWith("did:peer:")) {
     return (
@@ -192,15 +228,23 @@ export const nameForContact = (
 ): string => {
   return (
     (contact?.name as string) ||
-    (capitalize ? "This" : "this") + " unnamed user"
+    (capitalize ? "This" : "this") + " " + UNNAMED_PERSON
   );
 };
 
-export const doCopyTwoSecRedo = (text: string, fn: () => void) => {
+export const doCopyTwoSecRedo = async (
+  text: string,
+  fn: () => void,
+): Promise<void> => {
   fn();
-  useClipboard()
+  try {
-    .copy(text)
+    await copyToClipboard(text);
-    .then(() => setTimeout(fn, 2000));
+    setTimeout(fn, 2000);
+  } catch (error) {
+    // Note: This utility function doesn't have access to notification system
+    // The calling component should handle error notifications
+    // Error is silently caught to avoid breaking the 2-second redo pattern
+  }
 };
 
 export interface ConfirmerData {
@@ -613,57 +657,64 @@ export const retrieveAllAccountsMetadata = async (): Promise<
   return result;
 };
 
+export const DUPLICATE_ACCOUNT_ERROR = "Cannot import duplicate account.";
+
 /**
- * Saves a new identity to both SQL and Dexie databases
+ * Saves a new identity to SQL database
  */
 export async function saveNewIdentity(
   identity: IIdentifier,
   mnemonic: string,
   derivationPath: string,
 ): Promise<void> {
-  try {
+  // add to the new sql db
-    // add to the new sql db
+  const platformService = await getPlatformService();
-    const platformService = await getPlatformService();
 
-    const secrets = await platformService.dbQuery(
+  // Check if account already exists before attempting to save
-      `SELECT secretBase64 FROM secret`,
+  const existingAccount = await platformService.dbQuery(
-    );
+    "SELECT did FROM accounts WHERE did = ?",
-    if (!secrets?.values?.length || !secrets.values[0]?.length) {
+    [identity.did],
-      throw new Error(
+  );
-        "No initial encryption supported. We recommend you clear your data and start over.",
-      );
-    }
 
-    const secretBase64 = secrets.values[0][0] as string;
+  if (existingAccount?.values?.length) {
-
-    const secret = base64ToArrayBuffer(secretBase64);
-    const identityStr = JSON.stringify(identity);
-    const encryptedIdentity = await simpleEncrypt(identityStr, secret);
-    const encryptedMnemonic = await simpleEncrypt(mnemonic, secret);
-    const encryptedIdentityBase64 = arrayBufferToBase64(encryptedIdentity);
-    const encryptedMnemonicBase64 = arrayBufferToBase64(encryptedMnemonic);
-
-    const sql = `INSERT INTO accounts (dateCreated, derivationPath, did, identityEncrBase64, mnemonicEncrBase64, publicKeyHex)
-       VALUES (?, ?, ?, ?, ?, ?)`;
-    const params = [
-      new Date().toISOString(),
-      derivationPath,
-      identity.did,
-      encryptedIdentityBase64,
-      encryptedMnemonicBase64,
-      identity.keys[0].publicKeyHex,
-    ];
-    await platformService.dbExec(sql, params);
-
-    await platformService.updateDefaultSettings({ activeDid: identity.did });
-
-    await platformService.insertNewDidIntoSettings(identity.did);
-  } catch (error) {
-    logger.error("Failed to update default settings:", error);
     throw new Error(
-      "Failed to set default settings. Please try again or restart the app.",
+      `Account with DID ${identity.did} already exists. ${DUPLICATE_ACCOUNT_ERROR}`,
     );
   }
+
+  const secrets = await platformService.dbQuery(
+    `SELECT secretBase64 FROM secret`,
+  );
+  if (!secrets?.values?.length || !secrets.values[0]?.length) {
+    throw new Error(
+      "No initial encryption supported. We recommend you clear your data and start over.",
+    );
+  }
+
+  const secretBase64 = secrets.values[0][0] as string;
+
+  const secret = base64ToArrayBuffer(secretBase64);
+  const identityStr = JSON.stringify(identity);
+  const encryptedIdentity = await simpleEncrypt(identityStr, secret);
+  const encryptedMnemonic = await simpleEncrypt(mnemonic, secret);
+  const encryptedIdentityBase64 = arrayBufferToBase64(encryptedIdentity);
+  const encryptedMnemonicBase64 = arrayBufferToBase64(encryptedMnemonic);
+
+  const sql = `INSERT INTO accounts (dateCreated, derivationPath, did, identityEncrBase64, mnemonicEncrBase64, publicKeyHex)
+      VALUES (?, ?, ?, ?, ?, ?)`;
+  const params = [
+    new Date().toISOString(),
+    derivationPath,
+    identity.did,
+    encryptedIdentityBase64,
+    encryptedMnemonicBase64,
+    identity.keys[0].publicKeyHex,
+  ];
+  await platformService.dbExec(sql, params);
+
+  await platformService.updateDefaultSettings({ activeDid: identity.did });
+
+  await platformService.insertNewDidIntoSettings(identity.did);
 }
 
 /**
@@ -973,13 +1024,16 @@ export async function importFromMnemonic(
         const firstName = settings[0];
         const isRegistered = settings[1];
 
-        logger.info("[importFromMnemonic] Test User #0 settings verification", {
+        logger.debug(
-          did: newId.did,
+          "[importFromMnemonic] Test User #0 settings verification",
-          firstName,
+          {
-          isRegistered,
+            did: newId.did,
-          expectedFirstName: "User Zero",
+            firstName,
-          expectedIsRegistered: true,
+            isRegistered,
-        });
+            expectedFirstName: "User Zero",
+            expectedIsRegistered: true,
+          },
+        );
 
         // If settings weren't saved correctly, try individual updates
         if (firstName !== "User Zero" || isRegistered !== 1) {
@@ -1005,7 +1059,7 @@ export async function importFromMnemonic(
 
           if (retryResult?.values?.length) {
             const retrySettings = retryResult.values[0];
-            logger.info(
+            logger.debug(
               "[importFromMnemonic] Test User #0 settings after retry",
               {
                 firstName: retrySettings[0],
@@ -1028,3 +1082,58 @@ export async function importFromMnemonic(
     }
   }
 }
+
+/**
+ * Checks if an account with the given DID already exists in the database
+ *
+ * @param did - The DID to check for duplicates
+ * @returns Promise<boolean> - True if account already exists, false otherwise
+ * @throws Error if database query fails
+ */
+export async function checkForDuplicateAccount(did: string): Promise<boolean>;
+
+/**
+ * Checks if an account with the given DID already exists in the database
+ *
+ * @param mnemonic - The mnemonic phrase to derive DID from
+ * @param derivationPath - The derivation path to use
+ * @returns Promise<boolean> - True if account already exists, false otherwise
+ * @throws Error if database query fails
+ */
+export async function checkForDuplicateAccount(
+  mnemonic: string,
+  derivationPath: string,
+): Promise<boolean>;
+
+/**
+ * Implementation of checkForDuplicateAccount with overloaded signatures
+ */
+export async function checkForDuplicateAccount(
+  didOrMnemonic: string,
+  derivationPath?: string,
+): Promise<boolean> {
+  let didToCheck: string;
+
+  if (derivationPath) {
+    // Derive the DID from mnemonic and derivation path
+    const [address, privateHex, publicHex] = deriveAddress(
+      didOrMnemonic.trim().toLowerCase(),
+      derivationPath,
+    );
+
+    const newId = newIdentifier(address, privateHex, publicHex, derivationPath);
+    didToCheck = newId.did;
+  } else {
+    // Use the provided DID directly
+    didToCheck = didOrMnemonic;
+  }
+
+  // Check if an account with this DID already exists
+  const platformService = await getPlatformService();
+  const existingAccount = await platformService.dbQuery(
+    "SELECT did FROM accounts WHERE did = ?",
+    [didToCheck],
+  );
+
+  return (existingAccount?.values?.length ?? 0) > 0;
+}

src/main.capacitor.ts

@@ -35,6 +35,7 @@ import { handleApiError } from "./services/api";
 import { AxiosError } from "axios";
 import { DeepLinkHandler } from "./services/deepLinks";
 import { logger, safeStringify } from "./utils/logger";
+import "./utils/safeAreaInset";
 
 logger.log("[Capacitor] 🚀 Starting initialization");
 logger.log("[Capacitor] Platform:", process.env.VITE_PLATFORM);

src/main.ts

@@ -13,6 +13,15 @@ const platform = process.env.VITE_PLATFORM || "web";
 
 logger.info(`[Main] 🚀 Loading TimeSafari for platform: ${platform}`);
 
+// Log all relevant environment variables for boot-time debugging
+logger.info("[Main] 🌍 Boot-time environment configuration:", {
+  platform: process.env.VITE_PLATFORM,
+  defaultEndorserApiServer: process.env.VITE_DEFAULT_ENDORSER_API_SERVER,
+  defaultPartnerApiServer: process.env.VITE_DEFAULT_PARTNER_API_SERVER,
+  nodeEnv: process.env.NODE_ENV,
+  timestamp: new Date().toISOString(),
+});
+
 // Dynamically import the appropriate main entry point
 if (platform === "capacitor") {
   logger.info(`[Main] 📱 Loading Capacitor-specific entry point`);

src/router/index.ts

@@ -327,7 +327,7 @@ router.onError(errorHandler); // Assign the error handler to the router instance
  * @param next - Navigation function
  */
 router.beforeEach(async (to, _from, next) => {
-  logger.info(`[Router] 🧭 Navigation guard triggered:`, {
+  logger.debug(`[Router] 🧭 Navigation guard triggered:`, {
     from: _from?.path || "none",
     to: to.path,
     name: to.name,
@@ -337,6 +337,22 @@ router.beforeEach(async (to, _from, next) => {
   });
 
   try {
+    // Log boot-time configuration on first navigation
+    if (!_from) {
+      logger.info(
+        "[Router] 🚀 First navigation detected - logging boot-time configuration:",
+        {
+          platform: process.env.VITE_PLATFORM,
+          defaultEndorserApiServer:
+            process.env.VITE_DEFAULT_ENDORSER_API_SERVER,
+          defaultPartnerApiServer: process.env.VITE_DEFAULT_PARTNER_API_SERVER,
+          nodeEnv: process.env.NODE_ENV,
+          targetRoute: to.path,
+          timestamp: new Date().toISOString(),
+        },
+      );
+    }
+
     // Skip identity check for routes that handle identity creation manually
     const skipIdentityRoutes = [
       "/start",
@@ -352,11 +368,11 @@ router.beforeEach(async (to, _from, next) => {
       return next();
     }
 
-    logger.info(`[Router] 🔍 Checking user identity for route: ${to.path}`);
+    logger.debug(`[Router] 🔍 Checking user identity for route: ${to.path}`);
 
     // Check if user has any identities
     const allMyDids = await retrieveAccountDids();
-    logger.info(`[Router] 📋 Found ${allMyDids.length} user identities`);
+    logger.debug(`[Router] 📋 Found ${allMyDids.length} user identities`);
 
     if (allMyDids.length === 0) {
       logger.info("[Router] ⚠️ No identities found, creating default identity");
@@ -366,7 +382,7 @@ router.beforeEach(async (to, _from, next) => {
 
       logger.info("[Router] ✅ Default identity created successfully");
     } else {
-      logger.info(
+      logger.debug(
         `[Router] ✅ User has ${allMyDids.length} identities, proceeding`,
       );
     }
@@ -392,7 +408,7 @@ router.beforeEach(async (to, _from, next) => {
 
 // Add navigation success logging
 router.afterEach((to, from) => {
-  logger.info(`[Router] ✅ Navigation completed:`, {
+  logger.debug(`[Router] ✅ Navigation completed:`, {
     from: from?.path || "none",
     to: to.path,
     name: to.name,

src/services/ProfileService.ts

@@ -1,305 +0,0 @@
-/**
- * ProfileService - Handles user profile operations and API calls
- * Extracted from AccountViewView.vue to improve separation of concerns
- */
-
-import { AxiosInstance, AxiosError } from "axios";
-import { UserProfile } from "@/libs/partnerServer";
-import { UserProfileResponse } from "@/interfaces/accountView";
-import { getHeaders, errorStringForLog } from "@/libs/endorserServer";
-import { handleApiError } from "./api";
-import { logger } from "@/utils/logger";
-import { ACCOUNT_VIEW_CONSTANTS } from "@/constants/accountView";
-
-/**
- * Profile data interface
- */
-export interface ProfileData {
-  description: string;
-  latitude: number;
-  longitude: number;
-  includeLocation: boolean;
-}
-
-/**
- * Profile service class
- */
-export class ProfileService {
-  private axios: AxiosInstance;
-  private partnerApiServer: string;
-
-  constructor(axios: AxiosInstance, partnerApiServer: string) {
-    this.axios = axios;
-    this.partnerApiServer = partnerApiServer;
-  }
-
-  /**
-   * Load user profile from the server
-   * @param activeDid - The user's DID
-   * @returns ProfileData or null if profile doesn't exist
-   */
-  async loadProfile(activeDid: string): Promise<ProfileData | null> {
-    try {
-      const headers = await getHeaders(activeDid);
-      const response = await this.axios.get<UserProfileResponse>(
-        `${this.partnerApiServer}/api/partner/userProfileForIssuer/${activeDid}`,
-        { headers },
-      );
-
-      if (response.status === 200) {
-        const data = response.data.data;
-        const profileData: ProfileData = {
-          description: data.description || "",
-          latitude: data.locLat || 0,
-          longitude: data.locLon || 0,
-          includeLocation: !!(data.locLat && data.locLon),
-        };
-        return profileData;
-      } else {
-        throw new Error(ACCOUNT_VIEW_CONSTANTS.ERRORS.UNABLE_TO_LOAD_PROFILE);
-      }
-    } catch (error) {
-      if (this.isApiError(error) && error.response?.status === 404) {
-        // Profile doesn't exist yet - this is normal
-        return null;
-      }
-
-      logger.error("Error loading profile:", errorStringForLog(error));
-      handleApiError(error as AxiosError, "/api/partner/userProfileForIssuer");
-      return null;
-    }
-  }
-
-  /**
-   * Save user profile to the server
-   * @param activeDid - The user's DID
-   * @param profileData - The profile data to save
-   * @returns true if successful, false otherwise
-   */
-  async saveProfile(
-    activeDid: string,
-    profileData: ProfileData,
-  ): Promise<boolean> {
-    try {
-      const headers = await getHeaders(activeDid);
-      const payload: UserProfile = {
-        description: profileData.description,
-        issuerDid: activeDid,
-      };
-
-      // Add location data if location is included
-      if (
-        profileData.includeLocation &&
-        profileData.latitude &&
-        profileData.longitude
-      ) {
-        payload.locLat = profileData.latitude;
-        payload.locLon = profileData.longitude;
-      }
-
-      const response = await this.axios.post(
-        `${this.partnerApiServer}/api/partner/userProfile`,
-        payload,
-        { headers },
-      );
-
-      if (response.status === 201) {
-        return true;
-      } else {
-        logger.error("Error saving profile:", response);
-        throw new Error(ACCOUNT_VIEW_CONSTANTS.ERRORS.PROFILE_NOT_SAVED);
-      }
-    } catch (error) {
-      logger.error("Error saving profile:", errorStringForLog(error));
-      handleApiError(error as AxiosError, "/api/partner/userProfile");
-      return false;
-    }
-  }
-
-  /**
-   * Delete user profile from the server
-   * @param activeDid - The user's DID
-   * @returns true if successful, false otherwise
-   */
-  async deleteProfile(activeDid: string): Promise<boolean> {
-    try {
-      const headers = await getHeaders(activeDid);
-      const url = `${this.partnerApiServer}/api/partner/userProfile`;
-      const response = await this.axios.delete(url, { headers });
-
-      if (response.status === 204 || response.status === 200) {
-        logger.info("Profile deleted successfully");
-        return true;
-      } else {
-        logger.error("Unexpected response status when deleting profile:", {
-          status: response.status,
-          statusText: response.statusText,
-          data: response.data,
-        });
-        throw new Error(
-          `Profile not deleted - HTTP ${response.status}: ${response.statusText}`,
-        );
-      }
-    } catch (error) {
-      if (this.isApiError(error) && error.response) {
-        const response = error.response;
-        logger.error("API error deleting profile:", {
-          status: response.status,
-          statusText: response.statusText,
-          data: response.data,
-          url: this.getErrorUrl(error),
-        });
-
-        // Handle specific HTTP status codes
-        if (response.status === 204) {
-          logger.debug("Profile deleted successfully (204 No Content)");
-          return true; // 204 is success for DELETE operations
-        } else if (response.status === 404) {
-          logger.warn("Profile not found - may already be deleted");
-          return true; // Consider this a success if profile doesn't exist
-        } else if (response.status === 400) {
-          logger.error("Bad request when deleting profile:", response.data);
-          const errorMessage =
-            typeof response.data === "string"
-              ? response.data
-              : response.data?.message || "Bad request";
-          throw new Error(`Profile deletion failed: ${errorMessage}`);
-        } else if (response.status === 401) {
-          logger.error("Unauthorized to delete profile");
-          throw new Error("You are not authorized to delete this profile");
-        } else if (response.status === 403) {
-          logger.error("Forbidden to delete profile");
-          throw new Error("You are not allowed to delete this profile");
-        }
-      }
-
-      logger.error("Error deleting profile:", errorStringForLog(error));
-      handleApiError(error as AxiosError, "/api/partner/userProfile");
-      return false;
-    }
-  }
-
-  /**
-   * Update profile location
-   * @param profileData - Current profile data
-   * @param latitude - New latitude
-   * @param longitude - New longitude
-   * @returns Updated profile data
-   */
-  updateProfileLocation(
-    profileData: ProfileData,
-    latitude: number,
-    longitude: number,
-  ): ProfileData {
-    return {
-      ...profileData,
-      latitude,
-      longitude,
-      includeLocation: true,
-    };
-  }
-
-  /**
-   * Toggle location inclusion in profile
-   * @param profileData - Current profile data
-   * @returns Updated profile data
-   */
-  toggleProfileLocation(profileData: ProfileData): ProfileData {
-    const includeLocation = !profileData.includeLocation;
-    return {
-      ...profileData,
-      latitude: includeLocation ? profileData.latitude : 0,
-      longitude: includeLocation ? profileData.longitude : 0,
-      includeLocation,
-    };
-  }
-
-  /**
-   * Clear profile location
-   * @param profileData - Current profile data
-   * @returns Updated profile data
-   */
-  clearProfileLocation(profileData: ProfileData): ProfileData {
-    return {
-      ...profileData,
-      latitude: 0,
-      longitude: 0,
-      includeLocation: false,
-    };
-  }
-
-  /**
-   * Reset profile to default state
-   * @returns Default profile data
-   */
-  getDefaultProfile(): ProfileData {
-    return {
-      description: "",
-      latitude: 0,
-      longitude: 0,
-      includeLocation: false,
-    };
-  }
-
-  /**
-   * Type guard for API errors with proper typing
-   */
-  private isApiError(error: unknown): error is {
-    response?: {
-      status?: number;
-      statusText?: string;
-      data?: { message?: string } | string;
-    };
-  } {
-    return typeof error === "object" && error !== null && "response" in error;
-  }
-
-  /**
-   * Extract error URL safely from error object
-   */
-  private getErrorUrl(error: unknown): string | undefined {
-    if (this.isAxiosError(error)) {
-      return error.config?.url;
-    }
-    if (this.isApiError(error) && this.hasConfigProperty(error)) {
-      const config = this.getConfigProperty(error);
-      return config?.url;
-    }
-    return undefined;
-  }
-
-  /**
-   * Type guard to check if error has config property
-   */
-  private hasConfigProperty(
-    error: unknown,
-  ): error is { config?: { url?: string } } {
-    return typeof error === "object" && error !== null && "config" in error;
-  }
-
-  /**
-   * Safely extract config property from error
-   */
-  private getConfigProperty(error: {
-    config?: { url?: string };
-  }): { url?: string } | undefined {
-    return error.config;
-  }
-
-  /**
-   * Type guard for AxiosError
-   */
-  private isAxiosError(error: unknown): error is AxiosError {
-    return error instanceof AxiosError;
-  }
-}
-
-/**
- * Factory function to create a ProfileService instance
- */
-export function createProfileService(
-  axios: AxiosInstance,
-  partnerApiServer: string,
-): ProfileService {
-  return new ProfileService(axios, partnerApiServer);
-}

src/services/QRScanner/WebInlineQRScanner.ts

@@ -36,7 +36,7 @@ export class WebInlineQRScanner implements QRScannerService {
     // Generate a short random ID for this scanner instance
     this.id = Math.random().toString(36).substring(2, 8).toUpperCase();
     this.options = options ?? {};
-    logger.error(
+    logger.debug(
       `[WebInlineQRScanner:${this.id}] Initializing scanner with options:`,
       {
         ...this.options,
@@ -49,7 +49,7 @@ export class WebInlineQRScanner implements QRScannerService {
     this.context = this.canvas.getContext("2d", { willReadFrequently: true });
     this.video = document.createElement("video");
     this.video.setAttribute("playsinline", "true"); // Required for iOS
-    logger.error(
+    logger.debug(
       `[WebInlineQRScanner:${this.id}] DOM elements created successfully`,
     );
   }
@@ -60,7 +60,7 @@ export class WebInlineQRScanner implements QRScannerService {
     this.cameraStateListeners.forEach((listener) => {
       try {
         listener.onStateChange(state, message);
-        logger.info(
+        logger.debug(
           `[WebInlineQRScanner:${this.id}] Camera state changed to: ${state}`,
           {
             state,
@@ -89,7 +89,7 @@ export class WebInlineQRScanner implements QRScannerService {
   async checkPermissions(): Promise<boolean> {
     try {
       this.updateCameraState("initializing", "Checking camera permissions...");
-      logger.error(
+      logger.debug(
         `[WebInlineQRScanner:${this.id}] Checking camera permissions...`,
       );
 
@@ -99,7 +99,7 @@ export class WebInlineQRScanner implements QRScannerService {
           const permissions = await navigator.permissions.query({
             name: "camera" as PermissionName,
           });
-          logger.error(
+          logger.debug(
             `[WebInlineQRScanner:${this.id}] Permission state from Permissions API:`,
             permissions.state,
           );
@@ -165,7 +165,7 @@ export class WebInlineQRScanner implements QRScannerService {
         "initializing",
         "Requesting camera permissions...",
       );
-      logger.error(
+      logger.debug(
         `[WebInlineQRScanner:${this.id}] Requesting camera permissions...`,
       );
 
@@ -175,7 +175,7 @@ export class WebInlineQRScanner implements QRScannerService {
         (device) => device.kind === "videoinput",
       );
 
-      logger.error(`[WebInlineQRScanner:${this.id}] Found video devices:`, {
+      logger.debug(`[WebInlineQRScanner:${this.id}] Found video devices:`, {
         count: videoDevices.length,
         devices: videoDevices.map((d) => ({ id: d.deviceId, label: d.label })),
         userAgent: navigator.userAgent,
@@ -188,7 +188,7 @@ export class WebInlineQRScanner implements QRScannerService {
       }
 
       // Try to get a stream with specific constraints
-      logger.error(
+      logger.debug(
         `[WebInlineQRScanner:${this.id}] Requesting camera stream with constraints:`,
         {
           facingMode: "environment",
@@ -210,7 +210,7 @@ export class WebInlineQRScanner implements QRScannerService {
 
         // Stop the test stream immediately
         stream.getTracks().forEach((track) => {
-          logger.error(`[WebInlineQRScanner:${this.id}] Stopping test track:`, {
+          logger.debug(`[WebInlineQRScanner:${this.id}] Stopping test track:`, {
             kind: track.kind,
             label: track.label,
             readyState: track.readyState,
@@ -275,12 +275,12 @@ export class WebInlineQRScanner implements QRScannerService {
 
   async isSupported(): Promise<boolean> {
     try {
-      logger.error(
+      logger.debug(
         `[WebInlineQRScanner:${this.id}] Checking browser support...`,
       );
       // Check for secure context first
       if (!window.isSecureContext) {
-        logger.error(
+        logger.debug(
           `[WebInlineQRScanner:${this.id}] Camera access requires HTTPS (secure context)`,
         );
         return false;
@@ -300,7 +300,7 @@ export class WebInlineQRScanner implements QRScannerService {
         (device) => device.kind === "videoinput",
       );
 
-      logger.error(`[WebInlineQRScanner:${this.id}] Device support check:`, {
+      logger.debug(`[WebInlineQRScanner:${this.id}] Device support check:`, {
         hasSecureContext: window.isSecureContext,
         hasMediaDevices: !!navigator.mediaDevices,
         hasGetUserMedia: !!navigator.mediaDevices?.getUserMedia,
@@ -379,7 +379,7 @@ export class WebInlineQRScanner implements QRScannerService {
 
       // Log scan attempt every 100 frames or 1 second
       if (this.scanAttempts % 100 === 0 || timeSinceLastScan >= 1000) {
-        logger.error(`[WebInlineQRScanner:${this.id}] Scanning frame:`, {
+        logger.debug(`[WebInlineQRScanner:${this.id}] Scanning frame:`, {
           attempt: this.scanAttempts,
           dimensions: {
             width: this.canvas.width,
@@ -421,7 +421,7 @@ export class WebInlineQRScanner implements QRScannerService {
           !code.data ||
           code.data.length === 0;
 
-        logger.error(`[WebInlineQRScanner:${this.id}] QR Code detected:`, {
+        logger.debug(`[WebInlineQRScanner:${this.id}] QR Code detected:`, {
           data: code.data,
           location: code.location,
           attempts: this.scanAttempts,
@@ -512,13 +512,13 @@ export class WebInlineQRScanner implements QRScannerService {
       this.scanAttempts = 0;
       this.lastScanTime = Date.now();
       this.updateCameraState("initializing", "Starting camera...");
-      logger.error(
+      logger.debug(
         `[WebInlineQRScanner:${this.id}] Starting scan with options:`,
         this.options,
       );
 
       // Get camera stream with options
-      logger.error(
+      logger.debug(
         `[WebInlineQRScanner:${this.id}] Requesting camera stream...`,
       );
       this.stream = await navigator.mediaDevices.getUserMedia({
@@ -531,7 +531,7 @@ export class WebInlineQRScanner implements QRScannerService {
 
       this.updateCameraState("active", "Camera is active");
 
-      logger.error(`[WebInlineQRScanner:${this.id}] Camera stream obtained:`, {
+      logger.debug(`[WebInlineQRScanner:${this.id}] Camera stream obtained:`, {
         tracks: this.stream.getTracks().map((t) => ({
           kind: t.kind,
           label: t.label,
@@ -550,14 +550,14 @@ export class WebInlineQRScanner implements QRScannerService {
           this.video.style.display = "none";
         }
         await this.video.play();
-        logger.error(
+        logger.debug(
           `[WebInlineQRScanner:${this.id}] Video element started playing`,
         );
       }
 
       // Emit stream to component
       this.events.emit("stream", this.stream);
-      logger.error(`[WebInlineQRScanner:${this.id}] Stream event emitted`);
+      logger.debug(`[WebInlineQRScanner:${this.id}] Stream event emitted`);
 
       // Start QR code scanning
       this.scanQRCode();
@@ -595,7 +595,7 @@ export class WebInlineQRScanner implements QRScannerService {
     }
 
     try {
-      logger.error(`[WebInlineQRScanner:${this.id}] Stopping scan`, {
+      logger.debug(`[WebInlineQRScanner:${this.id}] Stopping scan`, {
         scanAttempts: this.scanAttempts,
         duration: Date.now() - this.lastScanTime,
       });
@@ -604,7 +604,7 @@ export class WebInlineQRScanner implements QRScannerService {
       if (this.animationFrameId !== null) {
         cancelAnimationFrame(this.animationFrameId);
         this.animationFrameId = null;
-        logger.error(
+        logger.debug(
           `[WebInlineQRScanner:${this.id}] Animation frame cancelled`,
         );
       }
@@ -613,13 +613,13 @@ export class WebInlineQRScanner implements QRScannerService {
       if (this.video) {
         this.video.pause();
         this.video.srcObject = null;
-        logger.error(`[WebInlineQRScanner:${this.id}] Video element stopped`);
+        logger.debug(`[WebInlineQRScanner:${this.id}] Video element stopped`);
       }
 
       // Stop all tracks in the stream
       if (this.stream) {
         this.stream.getTracks().forEach((track) => {
-          logger.error(`[WebInlineQRScanner:${this.id}] Stopping track:`, {
+          logger.debug(`[WebInlineQRScanner:${this.id}] Stopping track:`, {
             kind: track.kind,
             label: track.label,
             readyState: track.readyState,
@@ -631,7 +631,7 @@ export class WebInlineQRScanner implements QRScannerService {
 
       // Emit stream stopped event
       this.events.emit("stream", null);
-      logger.error(
+      logger.debug(
         `[WebInlineQRScanner:${this.id}] Stream stopped event emitted`,
       );
     } catch (error) {
@@ -643,17 +643,17 @@ export class WebInlineQRScanner implements QRScannerService {
       throw error;
     } finally {
       this.isScanning = false;
-      logger.error(`[WebInlineQRScanner:${this.id}] Scan stopped successfully`);
+      logger.debug(`[WebInlineQRScanner:${this.id}] Scan stopped successfully`);
     }
   }
 
   addListener(listener: ScanListener): void {
-    logger.error(`[WebInlineQRScanner:${this.id}] Adding scan listener`);
+    logger.debug(`[WebInlineQRScanner:${this.id}] Adding scan listener`);
     this.scanListener = listener;
   }
 
   onStream(callback: (stream: MediaStream | null) => void): void {
-    logger.error(
+    logger.debug(
       `[WebInlineQRScanner:${this.id}] Adding stream event listener`,
     );
     this.events.on("stream", callback);
@@ -661,24 +661,24 @@ export class WebInlineQRScanner implements QRScannerService {
 
   async cleanup(): Promise<void> {
     try {
-      logger.error(`[WebInlineQRScanner:${this.id}] Starting cleanup`);
+      logger.debug(`[WebInlineQRScanner:${this.id}] Starting cleanup`);
       await this.stopScan();
       this.events.removeAllListeners();
-      logger.error(`[WebInlineQRScanner:${this.id}] Event listeners removed`);
+      logger.debug(`[WebInlineQRScanner:${this.id}] Event listeners removed`);
 
       // Clean up DOM elements
       if (this.video) {
         this.video.remove();
         this.video = null;
-        logger.error(`[WebInlineQRScanner:${this.id}] Video element removed`);
+        logger.debug(`[WebInlineQRScanner:${this.id}] Video element removed`);
       }
       if (this.canvas) {
         this.canvas.remove();
         this.canvas = null;
-        logger.error(`[WebInlineQRScanner:${this.id}] Canvas element removed`);
+        logger.debug(`[WebInlineQRScanner:${this.id}] Canvas element removed`);
       }
       this.context = null;
-      logger.error(
+      logger.debug(
         `[WebInlineQRScanner:${this.id}] Cleanup completed successfully`,
       );
     } catch (error) {

src/services/deepLinks.ts

@@ -74,13 +74,13 @@ export class DeepLinkHandler {
    * @throws {DeepLinkError} If validation fails or route is invalid
    */
   async handleDeepLink(url: string): Promise<void> {
-    logger.info(`[DeepLink] 🚀 Starting deeplink processing for URL: ${url}`);
+    logger.debug(`[DeepLink] 🚀 Starting deeplink processing for URL: ${url}`);
 
     try {
-      logger.info(`[DeepLink] 📍 Parsing URL: ${url}`);
+      logger.debug(`[DeepLink] 📍 Parsing URL: ${url}`);
       const { path, params, query } = this.parseDeepLink(url);
 
-      logger.info(`[DeepLink] ✅ URL parsed successfully:`, {
+      logger.debug(`[DeepLink] ✅ URL parsed successfully:`, {
         path,
         params: Object.keys(params),
         query: Object.keys(query),
@@ -93,10 +93,10 @@ export class DeepLinkHandler {
         Object.entries(params).map(([key, value]) => [key, value ?? ""]),
       );
 
-      logger.info(`[DeepLink] 🧹 Parameters sanitized:`, sanitizedParams);
+      logger.debug(`[DeepLink] 🧹 Parameters sanitized:`, sanitizedParams);
 
       await this.validateAndRoute(path, sanitizedParams, query);
-      logger.info(`[DeepLink] 🎯 Deeplink processing completed successfully`);
+      logger.debug(`[DeepLink] 🎯 Deeplink processing completed successfully`);
     } catch (error) {
       logger.error(`[DeepLink] ❌ Deeplink processing failed:`, {
         url,
@@ -159,7 +159,7 @@ export class DeepLinkHandler {
         logger.debug(`[DeepLink] 🔗 Query parameters extracted:`, query);
       }
 
-      logger.info(`[DeepLink] ✅ Parse completed:`, {
+      logger.debug(`[DeepLink] ✅ Parse completed:`, {
         routePath,
         pathParams: pathParams.length,
         queryParams: Object.keys(query).length,
@@ -186,7 +186,7 @@ export class DeepLinkHandler {
     params: Record<string, string>,
     query: Record<string, string>,
   ): Promise<void> {
-    logger.info(
+    logger.debug(
       `[DeepLink] 🎯 Starting validation and routing for path: ${path}`,
     );
 
@@ -197,11 +197,11 @@ export class DeepLinkHandler {
       logger.debug(`[DeepLink] 🔍 Validating route path: ${path}`);
       // Validate route exists
       const validRoute = routeSchema.parse(path) as DeepLinkRoute;
-      logger.info(`[DeepLink] ✅ Route validation passed: ${validRoute}`);
+      logger.debug(`[DeepLink] ✅ Route validation passed: ${validRoute}`);
 
       // Get route configuration
       const routeConfig = ROUTE_MAP[validRoute];
-      logger.info(`[DeepLink] 📋 Route config retrieved:`, routeConfig);
+      logger.debug(`[DeepLink] 📋 Route config retrieved:`, routeConfig);
 
       if (!routeConfig) {
         logger.error(`[DeepLink] ❌ No route config found for: ${validRoute}`);
@@ -209,7 +209,7 @@ export class DeepLinkHandler {
       }
 
       routeName = routeConfig.name;
-      logger.info(`[DeepLink] 🎯 Route name resolved: ${routeName}`);
+      logger.debug(`[DeepLink] 🎯 Route name resolved: ${routeName}`);
     } catch (error) {
       logger.error(`[DeepLink] ❌ Route validation failed:`, {
         path,
@@ -228,14 +228,14 @@ export class DeepLinkHandler {
         },
       });
 
-      logger.info(
+      logger.debug(
         `[DeepLink] 🔄 Redirected to error page for invalid route: ${path}`,
       );
       return;
     }
 
     // Continue with parameter validation
-    logger.info(
+    logger.debug(
       `[DeepLink] 🔍 Starting parameter validation for route: ${routeName}`,
     );
 
@@ -258,7 +258,7 @@ export class DeepLinkHandler {
       if (pathSchema) {
         logger.debug(`[DeepLink] 🔍 Validating path parameters:`, params);
         validatedPathParams = await pathSchema.parseAsync(params);
-        logger.info(
+        logger.debug(
           `[DeepLink] ✅ Path parameters validated:`,
           validatedPathParams,
         );
@@ -270,7 +270,7 @@ export class DeepLinkHandler {
       if (querySchema) {
         logger.debug(`[DeepLink] 🔍 Validating query parameters:`, query);
         validatedQueryParams = await querySchema.parseAsync(query);
-        logger.info(
+        logger.debug(
           `[DeepLink] ✅ Query parameters validated:`,
           validatedQueryParams,
         );
@@ -299,7 +299,7 @@ export class DeepLinkHandler {
         },
       });
 
-      logger.info(
+      logger.debug(
         `[DeepLink] 🔄 Redirected to error page for invalid parameters`,
       );
       return;
@@ -307,7 +307,7 @@ export class DeepLinkHandler {
 
     // Attempt navigation
     try {
-      logger.info(`[DeepLink] 🚀 Attempting navigation:`, {
+      logger.debug(`[DeepLink] 🚀 Attempting navigation:`, {
         routeName,
         pathParams: validatedPathParams,
         queryParams: validatedQueryParams,
@@ -319,7 +319,7 @@ export class DeepLinkHandler {
         query: validatedQueryParams,
       });
 
-      logger.info(`[DeepLink] ✅ Navigation successful to: ${routeName}`);
+      logger.debug(`[DeepLink] ✅ Navigation successful to: ${routeName}`);
     } catch (error) {
       logger.error(`[DeepLink] ❌ Navigation failed:`, {
         routeName,
@@ -342,7 +342,7 @@ export class DeepLinkHandler {
         },
       });
 
-      logger.info(
+      logger.debug(
         `[DeepLink] 🔄 Redirected to error page for navigation failure`,
       );
     }

src/utils/PlatformServiceMixin.ts

@@ -437,17 +437,17 @@ export const PlatformServiceMixin = {
     },
 
     /**
-     * Utility method for retrieving and parsing settings
+     * Utility method for retrieving master settings
      * Common pattern used across many components
      */
-    async $getSettings(
+    async $getMasterSettings(
-      key: string,
       fallback: Settings | null = null,
     ): Promise<Settings | null> {
       try {
+        // Master settings: query by id
         const result = await this.$dbQuery(
-          "SELECT * FROM settings WHERE id = ? OR accountDid = ?",
+          "SELECT * FROM settings WHERE id = ?",
-          [key, key],
+          [MASTER_SETTINGS_KEY],
         );
 
         if (!result?.values?.length) {
@@ -472,8 +472,7 @@ export const PlatformServiceMixin = {
 
         return settings;
       } catch (error) {
-        logger.error(`[Settings Trace] ❌ Failed to get settings:`, {
+        logger.error(`[Settings Trace] ❌ Failed to get master settings:`, {
-          key,
           error,
         });
         return fallback;
@@ -491,10 +490,7 @@ export const PlatformServiceMixin = {
     ): Promise<Settings> {
       try {
         // Get default settings
-        const defaultSettings = await this.$getSettings(
+        const defaultSettings = await this.$getMasterSettings(defaultFallback);
-          defaultKey,
-          defaultFallback,
-        );
 
         // If no account DID, return defaults
         if (!accountDid) {
@@ -757,19 +753,20 @@ export const PlatformServiceMixin = {
      * @returns Fresh settings object from database
      */
     async $settings(defaults: Settings = {}): Promise<Settings> {
-      const settings = await this.$getSettings(MASTER_SETTINGS_KEY, defaults);
+      const settings = await this.$getMasterSettings(defaults);
 
       if (!settings) {
         return defaults;
       }
 
-      // **ELECTRON-SPECIFIC FIX**: Apply platform-specific API server override
+      // FIXED: Remove forced override - respect user preferences
-      // This ensures Electron always uses production endpoints regardless of cached settings
+      // Only set default if no user preference exists
-      if (process.env.VITE_PLATFORM === "electron") {
+      if (!settings.apiServer && process.env.VITE_PLATFORM === "electron") {
         // Import constants dynamically to get platform-specific values
         const { DEFAULT_ENDORSER_API_SERVER } = await import(
           "../constants/app"
         );
+        // Only set if user hasn't specified a preference
         settings.apiServer = DEFAULT_ENDORSER_API_SERVER;
       }
 
@@ -789,10 +786,7 @@ export const PlatformServiceMixin = {
     ): Promise<Settings> {
       try {
         // Get default settings first
-        const defaultSettings = await this.$getSettings(
+        const defaultSettings = await this.$getMasterSettings(defaults);
-          MASTER_SETTINGS_KEY,
-          defaults,
-        );
 
         if (!defaultSettings) {
           return defaults;
@@ -813,14 +807,17 @@ export const PlatformServiceMixin = {
           defaultSettings,
         );
 
-        // **ELECTRON-SPECIFIC FIX**: Force production API endpoints for Electron
+        // FIXED: Remove forced override - respect user preferences
-        // This ensures Electron doesn't use localhost development servers that might be saved in user settings
+        // Only set default if no user preference exists
-        if (process.env.VITE_PLATFORM === "electron") {
+        if (
+          !mergedSettings.apiServer &&
+          process.env.VITE_PLATFORM === "electron"
+        ) {
           // Import constants dynamically to get platform-specific values
           const { DEFAULT_ENDORSER_API_SERVER } = await import(
             "../constants/app"
           );
-
+          // Only set if user hasn't specified a preference
           mergedSettings.apiServer = DEFAULT_ENDORSER_API_SERVER;
         }
 
@@ -1574,10 +1571,7 @@ export const PlatformServiceMixin = {
     async $debugMergedSettings(did: string): Promise<void> {
       try {
         // Get default settings
-        const defaultSettings = await this.$getSettings(
+        const defaultSettings = await this.$getMasterSettings({});
-          MASTER_SETTINGS_KEY,
-          {},
-        );
         logger.info(
           `[PlatformServiceMixin] Default settings:`,
           defaultSettings,
@@ -1624,10 +1618,7 @@ export interface IPlatformServiceMixin {
   ): Promise<QueryExecResult | undefined>;
   $dbExec(sql: string, params?: unknown[]): Promise<DatabaseExecResult>;
   $dbGetOneRow(sql: string, params?: unknown[]): Promise<unknown[] | undefined>;
-  $getSettings(
+  $getMasterSettings(fallback?: Settings | null): Promise<Settings | null>;
-    key: string,
-    fallback?: Settings | null,
-  ): Promise<Settings | null>;
   $getMergedSettings(
     defaultKey: string,
     accountDid?: string,
@@ -1749,10 +1740,7 @@ declare module "@vue/runtime-core" {
       sql: string,
       params?: unknown[],
     ): Promise<unknown[] | undefined>;
-    $getSettings(
+    $getMasterSettings(defaults?: Settings | null): Promise<Settings | null>;
-      key: string,
-      defaults?: Settings | null,
-    ): Promise<Settings | null>;
     $getMergedSettings(
       key: string,
       did?: string,

src/utils/errorHandler.ts

@@ -0,0 +1,298 @@
+/**
+ * Standardized Error Handler
+ *
+ * Provides consistent error handling patterns across the TimeSafari codebase
+ * to improve debugging, user experience, and maintainability.
+ *
+ * @author Matthew Raymer
+ * @since 2025-08-25
+ */
+
+import { AxiosError } from "axios";
+import { logger } from "./logger";
+
+/**
+ * Standard error context for consistent logging
+ */
+export interface ErrorContext {
+  component: string;
+  operation: string;
+  timestamp: string;
+  [key: string]: unknown;
+}
+
+/**
+ * Enhanced error information for better debugging
+ */
+export interface EnhancedErrorInfo {
+  errorType: "AxiosError" | "NetworkError" | "ValidationError" | "UnknownError";
+  status?: number;
+  statusText?: string;
+  errorData?: unknown;
+  errorMessage: string;
+  errorStack?: string;
+  requestContext?: {
+    url?: string;
+    method?: string;
+    headers?: Record<string, unknown>;
+  };
+}
+
+/**
+ * Standardized error handler for API operations
+ *
+ * @param error - The error that occurred
+ * @param context - Context information about the operation
+ * @param operation - Description of the operation being performed
+ * @returns Enhanced error information for consistent handling
+ */
+export function handleApiError(
+  error: unknown,
+  context: ErrorContext,
+  operation: string,
+): EnhancedErrorInfo {
+  const baseContext = {
+    ...context,
+    operation,
+    timestamp: new Date().toISOString(),
+  };
+
+  if (error instanceof AxiosError) {
+    const axiosError = error as AxiosError;
+    const status = axiosError.response?.status;
+    const statusText = axiosError.response?.statusText;
+    const errorData = axiosError.response?.data;
+
+    const enhancedError: EnhancedErrorInfo = {
+      errorType: "AxiosError",
+      status,
+      statusText,
+      errorData,
+      errorMessage: axiosError.message,
+      errorStack: axiosError.stack,
+      requestContext: {
+        url: axiosError.config?.url,
+        method: axiosError.config?.method,
+        headers: axiosError.config?.headers,
+      },
+    };
+
+    // Log with consistent format
+    logger.error(
+      `[${context.component}] ❌ ${operation} failed (AxiosError):`,
+      {
+        ...baseContext,
+        ...enhancedError,
+      },
+    );
+
+    return enhancedError;
+  }
+
+  if (error instanceof Error) {
+    const enhancedError: EnhancedErrorInfo = {
+      errorType: "UnknownError",
+      errorMessage: error.message,
+      errorStack: error.stack,
+    };
+
+    logger.error(`[${context.component}] ❌ ${operation} failed (Error):`, {
+      ...baseContext,
+      ...enhancedError,
+    });
+
+    return enhancedError;
+  }
+
+  // Handle unknown error types
+  const enhancedError: EnhancedErrorInfo = {
+    errorType: "UnknownError",
+    errorMessage: String(error),
+  };
+
+  logger.error(`[${context.component}] ❌ ${operation} failed (Unknown):`, {
+    ...baseContext,
+    ...enhancedError,
+  });
+
+  return enhancedError;
+}
+
+/**
+ * Extract human-readable error message from various error response formats
+ *
+ * @param errorData - Error response data
+ * @returns Human-readable error message
+ */
+export function extractErrorMessage(errorData: unknown): string {
+  if (typeof errorData === "string") {
+    return errorData;
+  }
+
+  if (typeof errorData === "object" && errorData !== null) {
+    const obj = errorData as Record<string, unknown>;
+
+    // Try common error message fields
+    if (obj.message && typeof obj.message === "string") {
+      return obj.message;
+    }
+
+    if (obj.error && typeof obj.error === "string") {
+      return obj.error;
+    }
+
+    if (obj.detail && typeof obj.detail === "string") {
+      return obj.detail;
+    }
+
+    if (obj.reason && typeof obj.reason === "string") {
+      return obj.reason;
+    }
+
+    // Fallback to stringified object
+    return JSON.stringify(errorData);
+  }
+
+  return String(errorData);
+}
+
+/**
+ * Create user-friendly error message from enhanced error info
+ *
+ * @param errorInfo - Enhanced error information
+ * @param fallbackMessage - Fallback message if error details are insufficient
+ * @returns User-friendly error message
+ */
+export function createUserMessage(
+  errorInfo: EnhancedErrorInfo,
+  fallbackMessage: string,
+): string {
+  if (errorInfo.errorType === "AxiosError") {
+    const status = errorInfo.status;
+    const statusText = errorInfo.statusText;
+    const errorMessage = extractErrorMessage(errorInfo.errorData);
+
+    if (status && statusText) {
+      if (errorMessage && errorMessage !== "{}") {
+        return `${fallbackMessage}: ${status} ${statusText} - ${errorMessage}`;
+      }
+      return `${fallbackMessage}: ${status} ${statusText}`;
+    }
+  }
+
+  if (
+    errorInfo.errorMessage &&
+    errorInfo.errorMessage !== "Request failed with status code 0"
+  ) {
+    return `${fallbackMessage}: ${errorInfo.errorMessage}`;
+  }
+
+  return fallbackMessage;
+}
+
+/**
+ * Handle specific HTTP status codes with appropriate user messages
+ *
+ * @param status - HTTP status code
+ * @param errorData - Error response data
+ * @param operation - Description of the operation
+ * @returns User-friendly error message
+ */
+export function handleHttpStatus(
+  status: number,
+  errorData: unknown,
+  operation: string,
+): string {
+  const errorMessage = extractErrorMessage(errorData);
+
+  switch (status) {
+    case 400:
+      return errorMessage || `${operation} failed: Bad request`;
+    case 401:
+      return `${operation} failed: Authentication required`;
+    case 403:
+      return `${operation} failed: Access denied`;
+    case 404:
+      return errorMessage || `${operation} failed: Resource not found`;
+    case 409:
+      return errorMessage || `${operation} failed: Conflict with existing data`;
+    case 422:
+      return errorMessage || `${operation} failed: Validation error`;
+    case 429:
+      return `${operation} failed: Too many requests. Please try again later.`;
+    case 500:
+      return `${operation} failed: Server error. Please try again later.`;
+    case 502:
+    case 503:
+    case 504:
+      return `${operation} failed: Service temporarily unavailable. Please try again later.`;
+    default:
+      return errorMessage || `${operation} failed: HTTP ${status}`;
+  }
+}
+
+/**
+ * Check if an error is a network-related error
+ *
+ * @param error - The error to check
+ * @returns True if the error is network-related
+ */
+export function isNetworkError(error: unknown): boolean {
+  if (error instanceof AxiosError) {
+    return !error.response && !error.request;
+  }
+
+  if (error instanceof Error) {
+    const message = error.message.toLowerCase();
+    return (
+      message.includes("network") ||
+      message.includes("timeout") ||
+      message.includes("connection") ||
+      message.includes("fetch")
+    );
+  }
+
+  return false;
+}
+
+/**
+ * Check if an error is a timeout error
+ *
+ * @param error - The error to check
+ * @returns True if the error is a timeout
+ */
+export function isTimeoutError(error: unknown): boolean {
+  if (error instanceof AxiosError) {
+    return (
+      error.code === "ECONNABORTED" ||
+      error.message.toLowerCase().includes("timeout")
+    );
+  }
+
+  if (error instanceof Error) {
+    return error.message.toLowerCase().includes("timeout");
+  }
+
+  return false;
+}
+
+/**
+ * Create standardized error context for components
+ *
+ * @param component - Component name
+ * @param operation - Operation being performed
+ * @param additionalContext - Additional context information
+ * @returns Standardized error context
+ */
+export function createErrorContext(
+  component: string,
+  operation: string,
+  additionalContext: Record<string, unknown> = {},
+): ErrorContext {
+  return {
+    component,
+    operation,
+    timestamp: new Date().toISOString(),
+    ...additionalContext,
+  };
+}

src/utils/performanceOptimizer.ts

@@ -0,0 +1,482 @@
+/**
+ * Performance Optimizer
+ *
+ * Provides utilities for optimizing API calls, database queries, and component
+ * rendering to improve TimeSafari application performance.
+ *
+ * @author Matthew Raymer
+ * @since 2025-08-25
+ */
+
+import { logger } from "./logger";
+
+/**
+ * Batch operation configuration
+ */
+export interface BatchConfig {
+  maxBatchSize: number;
+  maxWaitTime: number;
+  retryAttempts: number;
+  retryDelay: number;
+}
+
+/**
+ * Default batch configuration
+ */
+export const DEFAULT_BATCH_CONFIG: BatchConfig = {
+  maxBatchSize: 10,
+  maxWaitTime: 100, // milliseconds
+  retryAttempts: 3,
+  retryDelay: 1000, // milliseconds
+};
+
+/**
+ * Batched operation item
+ */
+export interface BatchItem<T, R> {
+  id: string;
+  data: T;
+  resolve: (value: R) => void;
+  reject: (error: Error) => void;
+  timestamp: number;
+}
+
+/**
+ * Batch processor for API operations
+ *
+ * Groups multiple similar operations into batches to reduce
+ * the number of API calls and improve performance.
+ */
+export class BatchProcessor<T, R> {
+  private items: BatchItem<T, R>[] = [];
+  private timer: NodeJS.Timeout | null = null;
+  private processing = false;
+  private config: BatchConfig;
+
+  constructor(
+    private batchHandler: (items: T[]) => Promise<R[]>,
+    private itemIdExtractor: (item: T) => string,
+    config: Partial<BatchConfig> = {},
+  ) {
+    this.config = { ...DEFAULT_BATCH_CONFIG, ...config };
+  }
+
+  /**
+   * Add an item to the batch
+   *
+   * @param data - Data to process
+   * @returns Promise that resolves when the item is processed
+   */
+  async add(data: T): Promise<R> {
+    return new Promise((resolve, reject) => {
+      const item: BatchItem<T, R> = {
+        id: this.itemIdExtractor(data),
+        data,
+        resolve,
+        reject,
+        timestamp: Date.now(),
+      };
+
+      this.items.push(item);
+
+      // Start timer if this is the first item
+      if (this.items.length === 1) {
+        this.startTimer();
+      }
+
+      // Process immediately if batch is full
+      if (this.items.length >= this.config.maxBatchSize) {
+        this.processBatch();
+      }
+    });
+  }
+
+  /**
+   * Start the batch timer
+   */
+  private startTimer(): void {
+    if (this.timer) {
+      clearTimeout(this.timer);
+    }
+
+    this.timer = setTimeout(() => {
+      this.processBatch();
+    }, this.config.maxWaitTime);
+  }
+
+  /**
+   * Process the current batch
+   */
+  private async processBatch(): Promise<void> {
+    if (this.processing || this.items.length === 0) {
+      return;
+    }
+
+    this.processing = true;
+
+    // Clear timer
+    if (this.timer) {
+      clearTimeout(this.timer);
+      this.timer = null;
+    }
+
+    // Get current batch
+    const currentItems = [...this.items];
+    this.items = [];
+
+    try {
+      logger.debug("[BatchProcessor] 🔄 Processing batch:", {
+        batchSize: currentItems.length,
+        itemIds: currentItems.map((item) => item.id),
+        timestamp: new Date().toISOString(),
+      });
+
+      // Process batch
+      const results = await this.batchHandler(
+        currentItems.map((item) => item.data),
+      );
+
+      // Map results back to items
+      const resultMap = new Map<string, R>();
+      results.forEach((result, index) => {
+        const item = currentItems[index];
+        if (item) {
+          resultMap.set(item.id, result);
+        }
+      });
+
+      // Resolve promises
+      currentItems.forEach((item) => {
+        const result = resultMap.get(item.id);
+        if (result !== undefined) {
+          item.resolve(result);
+        } else {
+          item.reject(new Error(`No result found for item ${item.id}`));
+        }
+      });
+
+      logger.debug("[BatchProcessor] ✅ Batch processed successfully:", {
+        batchSize: currentItems.length,
+        resultsCount: results.length,
+        timestamp: new Date().toISOString(),
+      });
+    } catch (error) {
+      logger.error("[BatchProcessor] ❌ Batch processing failed:", {
+        batchSize: currentItems.length,
+        error: error instanceof Error ? error.message : String(error),
+        timestamp: new Date().toISOString(),
+      });
+
+      // Reject all items in the batch
+      currentItems.forEach((item) => {
+        item.reject(error instanceof Error ? error : new Error(String(error)));
+      });
+    } finally {
+      this.processing = false;
+
+      // Start timer for remaining items if any
+      if (this.items.length > 0) {
+        this.startTimer();
+      }
+    }
+  }
+
+  /**
+   * Get current batch status
+   */
+  getStatus(): {
+    pendingItems: number;
+    isProcessing: boolean;
+    hasTimer: boolean;
+  } {
+    return {
+      pendingItems: this.items.length,
+      isProcessing: this.processing,
+      hasTimer: this.timer !== null,
+    };
+  }
+
+  /**
+   * Clear all pending items
+   */
+  clear(): void {
+    if (this.timer) {
+      clearTimeout(this.timer);
+      this.timer = null;
+    }
+
+    // Reject all pending items
+    this.items.forEach((item) => {
+      item.reject(new Error("Batch processor cleared"));
+    });
+
+    this.items = [];
+    this.processing = false;
+  }
+}
+
+/**
+ * Database query optimizer
+ *
+ * Provides utilities for optimizing database queries and reducing
+ * the number of database operations.
+ */
+export class DatabaseOptimizer {
+  /**
+   * Batch multiple SELECT queries into a single query
+   *
+   * @param baseQuery - Base SELECT query
+   * @param ids - Array of IDs to query
+   * @param idColumn - Name of the ID column
+   * @returns Optimized query string
+   */
+  static batchSelectQuery(
+    baseQuery: string,
+    ids: (string | number)[],
+    idColumn: string,
+  ): string {
+    if (ids.length === 0) {
+      return baseQuery;
+    }
+
+    if (ids.length === 1) {
+      return `${baseQuery} WHERE ${idColumn} = ?`;
+    }
+
+    const placeholders = ids.map(() => "?").join(", ");
+    return `${baseQuery} WHERE ${idColumn} IN (${placeholders})`;
+  }
+
+  /**
+   * Create a query plan for multiple operations
+   *
+   * @param operations - Array of database operations
+   * @returns Optimized query plan
+   */
+  static createQueryPlan(
+    operations: Array<{
+      type: "SELECT" | "INSERT" | "UPDATE" | "DELETE";
+      table: string;
+      priority: number;
+    }>,
+  ): Array<{
+    type: "SELECT" | "INSERT" | "UPDATE" | "DELETE";
+    table: string;
+    priority: number;
+    batchable: boolean;
+  }> {
+    return operations
+      .map((op) => ({
+        ...op,
+        batchable: op.type === "SELECT" || op.type === "INSERT",
+      }))
+      .sort((a, b) => {
+        // Sort by priority first, then by type
+        if (a.priority !== b.priority) {
+          return b.priority - a.priority;
+        }
+
+        // SELECT operations first, then INSERT, UPDATE, DELETE
+        const typeOrder = { SELECT: 0, INSERT: 1, UPDATE: 2, DELETE: 3 };
+        return typeOrder[a.type] - typeOrder[b.type];
+      });
+  }
+}
+
+/**
+ * Component rendering optimizer
+ *
+ * Provides utilities for optimizing Vue component rendering
+ * and reducing unnecessary re-renders.
+ */
+export class ComponentOptimizer {
+  /**
+   * Debounce function calls to prevent excessive execution
+   *
+   * @param func - Function to debounce
+   * @param wait - Wait time in milliseconds
+   * @returns Debounced function
+   */
+  static debounce<T extends (...args: unknown[]) => unknown>(
+    func: T,
+    wait: number,
+  ): (...args: Parameters<T>) => void {
+    let timeout: NodeJS.Timeout | null = null;
+
+    return (...args: Parameters<T>) => {
+      if (timeout) {
+        clearTimeout(timeout);
+      }
+
+      timeout = setTimeout(() => {
+        func(...args);
+      }, wait);
+    };
+  }
+
+  /**
+   * Throttle function calls to limit execution frequency
+   *
+   * @param func - Function to throttle
+   * @param limit - Time limit in milliseconds
+   * @returns Throttled function
+   */
+  static throttle<T extends (...args: unknown[]) => unknown>(
+    func: T,
+    limit: number,
+  ): (...args: Parameters<T>) => void {
+    let inThrottle = false;
+
+    return (...args: Parameters<T>) => {
+      if (!inThrottle) {
+        func(...args);
+        inThrottle = true;
+        setTimeout(() => {
+          inThrottle = false;
+        }, limit);
+      }
+    };
+  }
+
+  /**
+   * Memoize function results to avoid redundant computation
+   *
+   * @param func - Function to memoize
+   * @param keyGenerator - Function to generate cache keys
+   * @returns Memoized function
+   */
+  static memoize<T extends (...args: unknown[]) => unknown, K>(
+    func: T,
+    keyGenerator: (...args: Parameters<T>) => K,
+  ): T {
+    const cache = new Map<K, unknown>();
+
+    return ((...args: Parameters<T>) => {
+      const key = keyGenerator(...args);
+
+      if (cache.has(key)) {
+        return cache.get(key);
+      }
+
+      const result = func(...args);
+      cache.set(key, result);
+      return result;
+    }) as T;
+  }
+}
+
+/**
+ * Performance monitoring utility
+ *
+ * Tracks and reports performance metrics for optimization analysis.
+ */
+export class PerformanceMonitor {
+  private static instance: PerformanceMonitor;
+  private metrics = new Map<
+    string,
+    Array<{ timestamp: number; duration: number }>
+  >();
+
+  private constructor() {}
+
+  /**
+   * Get singleton instance
+   */
+  static getInstance(): PerformanceMonitor {
+    if (!PerformanceMonitor.instance) {
+      PerformanceMonitor.instance = new PerformanceMonitor();
+    }
+    return PerformanceMonitor.instance;
+  }
+
+  /**
+   * Start timing an operation
+   *
+   * @param operationName - Name of the operation
+   * @returns Function to call when operation completes
+   */
+  startTiming(operationName: string): () => void {
+    const startTime = performance.now();
+
+    return () => {
+      const duration = performance.now() - startTime;
+      this.recordMetric(operationName, duration);
+    };
+  }
+
+  /**
+   * Record a performance metric
+   *
+   * @param operationName - Name of the operation
+   * @param duration - Duration in milliseconds
+   */
+  private recordMetric(operationName: string, duration: number): void {
+    if (!this.metrics.has(operationName)) {
+      this.metrics.set(operationName, []);
+    }
+
+    const operationMetrics = this.metrics.get(operationName)!;
+    operationMetrics.push({
+      timestamp: Date.now(),
+      duration,
+    });
+
+    // Keep only last 100 metrics per operation
+    if (operationMetrics.length > 100) {
+      operationMetrics.splice(0, operationMetrics.length - 100);
+    }
+  }
+
+  /**
+   * Get performance summary for an operation
+   *
+   * @param operationName - Name of the operation
+   * @returns Performance statistics
+   */
+  getPerformanceSummary(operationName: string): {
+    count: number;
+    average: number;
+    min: number;
+    max: number;
+    recentAverage: number;
+  } | null {
+    const metrics = this.metrics.get(operationName);
+    if (!metrics || metrics.length === 0) {
+      return null;
+    }
+
+    const durations = metrics.map((m) => m.duration);
+    const recentMetrics = metrics.slice(-10); // Last 10 metrics
+
+    return {
+      count: metrics.length,
+      average: durations.reduce((a, b) => a + b, 0) / durations.length,
+      min: Math.min(...durations),
+      max: Math.max(...durations),
+      recentAverage:
+        recentMetrics.reduce((a, b) => a + b.duration, 0) /
+        recentMetrics.length,
+    };
+  }
+
+  /**
+   * Get all performance metrics
+   */
+  getAllMetrics(): Map<string, Array<{ timestamp: number; duration: number }>> {
+    return new Map(this.metrics);
+  }
+
+  /**
+   * Clear all performance metrics
+   */
+  clearMetrics(): void {
+    this.metrics.clear();
+  }
+}
+
+/**
+ * Convenience function to get the performance monitor
+ */
+export const getPerformanceMonitor = (): PerformanceMonitor => {
+  return PerformanceMonitor.getInstance();
+};

src/utils/safeAreaInset.js

@@ -0,0 +1,226 @@
+/**
+ * Safe Area Inset Injection for Android WebView
+ *
+ * This script injects safe area inset values into CSS environment variables
+ * when running in Android WebView, since Android doesn't natively support
+ * CSS env(safe-area-inset-*) variables like iOS does.
+ */
+
+// Check if we're running in Android WebView with Capacitor
+const isAndroidWebView = () => {
+  // Check if we're on iOS - if so, skip this script entirely
+  const isIOS =
+    /iPad|iPhone|iPod/.test(navigator.userAgent) ||
+    (navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1);
+
+  if (isIOS) {
+    return false;
+  }
+
+  // Check if we're on Android
+  const isAndroid = /Android/.test(navigator.userAgent);
+
+  // Check if we have Capacitor (required for Android WebView)
+  const hasCapacitor = window.Capacitor !== undefined;
+
+  // Only run on Android with Capacitor
+  return isAndroid && hasCapacitor;
+};
+
+// Wait for Capacitor to be available
+const waitForCapacitor = () => {
+  return new Promise((resolve) => {
+    if (window.Capacitor) {
+      resolve(window.Capacitor);
+      return;
+    }
+
+    // Wait for Capacitor to be available
+    const checkCapacitor = () => {
+      if (window.Capacitor) {
+        resolve(window.Capacitor);
+      } else {
+        setTimeout(checkCapacitor, 100);
+      }
+    };
+
+    checkCapacitor();
+  });
+};
+
+// Inject safe area inset values into CSS custom properties
+const injectSafeAreaInsets = async () => {
+  try {
+    // Wait for Capacitor to be available
+    const Capacitor = await waitForCapacitor();
+
+    // Try to get safe area insets using StatusBar plugin (which is already available)
+
+    let top = 0,
+      bottom = 0,
+      left = 0,
+      right = 0;
+
+    try {
+      // Use StatusBar plugin to get status bar height
+      if (Capacitor.Plugins.StatusBar) {
+        const statusBarInfo = await Capacitor.Plugins.StatusBar.getInfo();
+        // Status bar height is typically the top safe area inset
+        top = statusBarInfo.overlays ? 0 : statusBarInfo.height || 0;
+      }
+    } catch (error) {
+      // Status bar info not available, will use fallback
+    }
+
+    // Detect navigation bar and gesture bar heights
+    const detectNavigationBar = () => {
+      const screenHeight = window.screen.height;
+      const screenWidth = window.screen.width;
+      const windowHeight = window.innerHeight;
+      const devicePixelRatio = window.devicePixelRatio || 1;
+
+      // Calculate navigation bar height
+      let navBarHeight = 0;
+
+      // Method 1: Direct comparison (most reliable)
+      if (windowHeight < screenHeight) {
+        navBarHeight = screenHeight - windowHeight;
+      }
+
+      // Method 2: Check for gesture navigation indicators
+      if (navBarHeight === 0) {
+        // Look for common gesture navigation patterns
+        const isTallDevice = screenHeight > 2000;
+        const isModernDevice = screenHeight > 1800;
+        const hasHighDensity = devicePixelRatio >= 2.5;
+
+        if (isTallDevice && hasHighDensity) {
+          // Modern gesture-based device
+          navBarHeight = 12; // Typical gesture bar height
+        } else if (isModernDevice) {
+          // Modern device with traditional navigation
+          navBarHeight = 48; // Traditional navigation bar height
+        }
+      }
+
+      // Method 3: Check visual viewport (more accurate for WebView)
+      if (navBarHeight === 0) {
+        if (window.visualViewport) {
+          const visualHeight = window.visualViewport.height;
+
+          if (visualHeight < windowHeight) {
+            navBarHeight = windowHeight - visualHeight;
+          }
+        }
+      }
+
+      // Method 4: Device-specific estimation based on screen dimensions
+      if (navBarHeight === 0) {
+        // Common Android navigation bar heights in pixels
+        const commonNavBarHeights = {
+          "1080x2400": 48, // Common 1080p devices
+          "1440x3200": 64, // QHD devices
+          "720x1600": 32, // HD devices
+        };
+
+        const resolution = `${screenWidth}x${screenHeight}`;
+        const estimatedHeight = commonNavBarHeights[resolution];
+
+        if (estimatedHeight) {
+          navBarHeight = estimatedHeight;
+        } else {
+          // Fallback: estimate based on screen height
+          navBarHeight = screenHeight > 2000 ? 48 : 32;
+        }
+      }
+
+      return navBarHeight;
+    };
+
+    // Get navigation bar height
+    bottom = detectNavigationBar();
+
+    // If we still don't have a top value, estimate it
+    if (top === 0) {
+      const screenHeight = window.screen.height;
+      // Common status bar heights: 24dp (48px) for most devices, 32dp (64px) for some
+      top = screenHeight > 1920 ? 64 : 48;
+    }
+
+    // Left/right safe areas are rare on Android
+    left = 0;
+    right = 0;
+
+    // Create CSS custom properties
+    const style = document.createElement("style");
+    style.textContent = `
+      :root {
+        --safe-area-inset-top: ${top}px;
+        --safe-area-inset-bottom: ${bottom}px;
+        --safe-area-inset-left: ${left}px;
+        --safe-area-inset-right: ${right}px;
+      }
+    `;
+
+    // Inject the style into the document head
+    document.head.appendChild(style);
+
+    // Also set CSS environment variables if supported
+    if (CSS.supports("env(safe-area-inset-top)")) {
+      document.documentElement.style.setProperty(
+        "--env-safe-area-inset-top",
+        `${top}px`,
+      );
+      document.documentElement.style.setProperty(
+        "--env-safe-area-inset-bottom",
+        `${bottom}px`,
+      );
+      document.documentElement.style.setProperty(
+        "--env-safe-area-inset-left",
+        `${left}px`,
+      );
+      document.documentElement.style.setProperty(
+        "--env-safe-area-inset-right",
+        `${right}px`,
+      );
+    }
+  } catch (error) {
+    // Error injecting safe area insets, will use fallback values
+  }
+};
+
+// Initialize when DOM is ready
+const initializeSafeArea = () => {
+  // Check if we should run this script at all
+  if (!isAndroidWebView()) {
+    return;
+  }
+
+  // Add a small delay to ensure WebView is fully initialized
+  setTimeout(() => {
+    injectSafeAreaInsets();
+  }, 100);
+};
+
+if (document.readyState === "loading") {
+  document.addEventListener("DOMContentLoaded", initializeSafeArea);
+} else {
+  initializeSafeArea();
+}
+
+// Re-inject on orientation change (only on Android)
+window.addEventListener("orientationchange", () => {
+  if (isAndroidWebView()) {
+    setTimeout(() => injectSafeAreaInsets(), 100);
+  }
+});
+
+// Re-inject on resize (only on Android)
+window.addEventListener("resize", () => {
+  if (isAndroidWebView()) {
+    setTimeout(() => injectSafeAreaInsets(), 100);
+  }
+});
+
+// Export for use in other modules
+export { injectSafeAreaInsets, isAndroidWebView };

src/utils/seedPhraseReminder.ts

@@ -0,0 +1,90 @@
+import { NotificationIface } from "@/constants/app";
+
+const SEED_REMINDER_KEY = "seedPhraseReminderLastShown";
+const REMINDER_COOLDOWN_MS = 24 * 60 * 60 * 1000; // 24 hours in milliseconds
+
+/**
+ * Checks if the seed phrase backup reminder should be shown
+ * @param hasBackedUpSeed - Whether the user has backed up their seed phrase
+ * @returns true if the reminder should be shown, false otherwise
+ */
+export function shouldShowSeedReminder(hasBackedUpSeed: boolean): boolean {
+  // Don't show if user has already backed up
+  if (hasBackedUpSeed) {
+    return false;
+  }
+
+  // Check localStorage for last shown time
+  const lastShown = localStorage.getItem(SEED_REMINDER_KEY);
+  if (!lastShown) {
+    return true; // First time, show the reminder
+  }
+
+  try {
+    const lastShownTime = parseInt(lastShown, 10);
+    const now = Date.now();
+    const timeSinceLastShown = now - lastShownTime;
+
+    // Show if more than 24 hours have passed
+    return timeSinceLastShown >= REMINDER_COOLDOWN_MS;
+  } catch (error) {
+    // If there's an error parsing the timestamp, show the reminder
+    return true;
+  }
+}
+
+/**
+ * Marks the seed phrase reminder as shown by updating localStorage
+ */
+export function markSeedReminderShown(): void {
+  localStorage.setItem(SEED_REMINDER_KEY, Date.now().toString());
+}
+
+/**
+ * Creates the seed phrase backup reminder notification
+ * @returns NotificationIface configuration for the reminder modal
+ */
+export function createSeedReminderNotification(): NotificationIface {
+  return {
+    group: "modal",
+    type: "confirm",
+    title: "Backup Your Identifier Seed?",
+    text: "It looks like you haven't backed up your identifier seed yet. It's important to back it up as soon as possible to secure your identity.",
+    yesText: "Backup Identifier Seed",
+    noText: "Remind me Later",
+    onYes: async () => {
+      // Navigate to seed backup page
+      window.location.href = "/seed-backup";
+    },
+    onNo: async () => {
+      // Mark as shown so it won't appear again for 24 hours
+      markSeedReminderShown();
+    },
+    onCancel: async () => {
+      // Mark as shown so it won't appear again for 24 hours
+      markSeedReminderShown();
+    },
+  };
+}
+
+/**
+ * Shows the seed phrase backup reminder if conditions are met
+ * @param hasBackedUpSeed - Whether the user has backed up their seed phrase
+ * @param notifyFunction - Function to show notifications
+ * @returns true if the reminder was shown, false otherwise
+ */
+export function showSeedPhraseReminder(
+  hasBackedUpSeed: boolean,
+  notifyFunction: (notification: NotificationIface, timeout?: number) => void,
+): boolean {
+  if (shouldShowSeedReminder(hasBackedUpSeed)) {
+    const notification = createSeedReminderNotification();
+    // Add 1-second delay before showing the modal to allow success message to be visible
+    setTimeout(() => {
+      // Pass -1 as timeout to ensure modal stays open until user interaction
+      notifyFunction(notification, -1);
+    }, 1000);
+    return true;
+  }
+  return false;
+}

src/views/AccountViewView.vue

@@ -58,7 +58,10 @@
       v-if="!isRegistered"
       :passkeys-enabled="PASSKEYS_ENABLED"
       :given-name="givenName"
-      message="Before you can publicly announce a new project or time commitment, a friend needs to register you."
+      :message="
+        `Before you can publicly announce a new project or time commitment, ` +
+        `a friend needs to register you.`
+      "
     />
 
     <!-- Notifications -->
@@ -751,6 +754,7 @@ import "leaflet/dist/leaflet.css";
 
 import { Buffer } from "buffer/";
 import "dexie-export-import";
+
 // @ts-expect-error - they aren't exporting it but it's there
 import { ImportProgress } from "dexie-export-import";
 import { LeafletMouseEvent } from "leaflet";
@@ -760,7 +764,7 @@ import { IIdentifier } from "@veramo/core";
 import { ref } from "vue";
 import { Component, Vue } from "vue-facing-decorator";
 import { RouteLocationNormalizedLoaded, Router } from "vue-router";
-import { useClipboard } from "@vueuse/core";
+import { copyToClipboard } from "../services/ClipboardService";
 import { LMap, LMarker, LTileLayer } from "@vue-leaflet/vue-leaflet";
 import { Capacitor } from "@capacitor/core";
 
@@ -807,16 +811,19 @@ import { logger } from "../utils/logger";
 import { PlatformServiceMixin } from "../utils/PlatformServiceMixin";
 import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
 import { ACCOUNT_VIEW_CONSTANTS } from "@/constants/accountView";
+import { showSeedPhraseReminder } from "@/utils/seedPhraseReminder";
 import {
   AccountSettings,
   isApiError,
   ImportContent,
 } from "@/interfaces/accountView";
-import {
+// Profile data interface (inlined from ProfileService)
-  ProfileService,
+interface ProfileData {
-  createProfileService,
+  description: string;
-  ProfileData,
+  latitude: number;
-} from "@/services/ProfileService";
+  longitude: number;
+  includeLocation: boolean;
+}
 
 const inputImportFileNameRef = ref<Blob>();
 
@@ -915,7 +922,6 @@ export default class AccountViewView extends Vue {
   imageLimits: ImageRateLimits | null = null;
   limitsMessage: string = "";
 
-  private profileService!: ProfileService;
   private notify!: ReturnType<typeof createNotifyHelpers>;
 
   created() {
@@ -925,7 +931,10 @@ export default class AccountViewView extends Vue {
     // This prevents the "Cannot read properties of undefined (reading 'Default')" error
     if (L.Icon.Default) {
       // Type-safe way to handle Leaflet icon prototype
-      const iconDefault = L.Icon.Default.prototype as Record<string, unknown>;
+      const iconDefault = L.Icon.Default.prototype as unknown as Record<
+        string,
+        unknown
+      >;
       if ("_getIconUrl" in iconDefault) {
         delete iconDefault._getIconUrl;
       }
@@ -947,17 +956,21 @@ export default class AccountViewView extends Vue {
    * @throws Will display specific messages to the user based on different errors.
    */
   async mounted(): Promise<void> {
-    this.profileService = createProfileService(
-      this.axios,
-      this.partnerApiServer,
-    );
     try {
       await this.initializeState();
       await this.processIdentity();
 
+      // Profile service logic now inlined - no need for external service
+      logger.debug(
+        "[AccountViewView] Profile logic ready with partnerApiServer:",
+        {
+          partnerApiServer: this.partnerApiServer,
+        },
+      );
+
       if (this.isRegistered) {
         try {
-          const profile = await this.profileService.loadProfile(this.activeDid);
+          const profile = await this.loadProfile(this.activeDid);
           if (profile) {
             this.userProfileDesc = profile.description;
             this.userProfileLatitude = profile.latitude;
@@ -1071,11 +1084,15 @@ export default class AccountViewView extends Vue {
   }
 
   // call fn, copy text to the clipboard, then redo fn after 2 seconds
-  doCopyTwoSecRedo(text: string, fn: () => void): void {
+  async doCopyTwoSecRedo(text: string, fn: () => void): Promise<void> {
     fn();
-    useClipboard()
+    try {
-      .copy(text)
+      await copyToClipboard(text);
-      .then(() => setTimeout(fn, 2000));
+      setTimeout(fn, 2000);
+    } catch (error) {
+      this.$logAndConsole(`Error copying to clipboard: ${error}`, true);
+      this.notify.error("Failed to copy to clipboard.");
+    }
   }
 
   async toggleShowContactAmounts(): Promise<void> {
@@ -1410,21 +1427,24 @@ export default class AccountViewView extends Vue {
 
   async checkLimits(): Promise<void> {
     this.loadingLimits = true;
+    const did = this.activeDid;
+    if (!did) {
+      this.limitsMessage = ACCOUNT_VIEW_CONSTANTS.LIMITS.NO_IDENTIFIER;
+      return;
+    }
+
     try {
-      const did = this.activeDid;
-
-      if (!did) {
-        this.limitsMessage = ACCOUNT_VIEW_CONSTANTS.LIMITS.NO_IDENTIFIER;
-        return;
-      }
-
       await this.$saveUserSettings(did, {
         apiServer: this.apiServer,
         partnerApiServer: this.partnerApiServer,
         webPushServer: this.webPushServer,
       });
 
-      const imageResp = await fetchImageRateLimits(this.axios, did);
+      const imageResp = await fetchImageRateLimits(
+        this.axios,
+        did,
+        this.DEFAULT_IMAGE_API_SERVER,
+      );
 
       if (imageResp.status === 200) {
         this.imageLimits = imageResp.data;
@@ -1450,7 +1470,26 @@ export default class AccountViewView extends Vue {
     } catch (error) {
       this.limitsMessage =
         ACCOUNT_VIEW_CONSTANTS.LIMITS.ERROR_RETRIEVING_LIMITS;
-      logger.error("Error retrieving limits: ", error);
+
+      // Enhanced error logging with server context
+      const axiosError = error as {
+        response?: {
+          data?: { error?: { code?: string; message?: string } };
+          status?: number;
+        };
+      };
+      logger.error("[Server Limits] Error retrieving limits:", {
+        error: error instanceof Error ? error.message : String(error),
+        did: did,
+        apiServer: this.apiServer,
+        partnerApiServer: this.partnerApiServer,
+        errorCode: axiosError?.response?.data?.error?.code,
+        errorMessage: axiosError?.response?.data?.error?.message,
+        httpStatus: axiosError?.response?.status,
+        needsUserMigration: true,
+        timestamp: new Date().toISOString(),
+      });
+
       // this.notify.error(this.limitsMessage, TIMEOUTS.STANDARD);
     } finally {
       this.loadingLimits = false;
@@ -1458,24 +1497,70 @@ export default class AccountViewView extends Vue {
   }
 
   async onClickSaveApiServer(): Promise<void> {
-    await this.$saveSettings({
+    // Enhanced diagnostic logging for claim URL changes
-      apiServer: this.apiServerInput,
+    const previousApiServer = this.apiServer;
+    const newApiServer = this.apiServerInput;
+
+    logger.debug("[Server Switching] Claim URL change initiated:", {
+      did: this.activeDid,
+      previousServer: previousApiServer,
+      newServer: newApiServer,
+      changeType: "apiServer",
+      timestamp: new Date().toISOString(),
     });
-    this.apiServer = this.apiServerInput;
+
+    await this.$saveSettings({
+      apiServer: newApiServer,
+    });
+    this.apiServer = newApiServer;
+
     // Add this line to save to user-specific settings
     await this.$saveUserSettings(this.activeDid, {
       apiServer: this.apiServer,
     });
+
+    // Log successful server switch
+    logger.debug("[Server Switching] Claim URL change completed:", {
+      did: this.activeDid,
+      previousServer: previousApiServer,
+      newServer: newApiServer,
+      changeType: "apiServer",
+      settingsSaved: true,
+      timestamp: new Date().toISOString(),
+    });
   }
 
   async onClickSavePartnerServer(): Promise<void> {
-    await this.$saveSettings({
+    // Enhanced diagnostic logging for partner server changes
-      partnerApiServer: this.partnerApiServerInput,
+    const previousPartnerServer = this.partnerApiServer;
+    const newPartnerServer = this.partnerApiServerInput;
+
+    logger.debug("[Server Switching] Partner server change initiated:", {
+      did: this.activeDid,
+      previousServer: previousPartnerServer,
+      newServer: newPartnerServer,
+      changeType: "partnerApiServer",
+      timestamp: new Date().toISOString(),
     });
-    this.partnerApiServer = this.partnerApiServerInput;
+
+    await this.$saveSettings({
+      partnerApiServer: newPartnerServer,
+    });
+    this.partnerApiServer = newPartnerServer;
+
     await this.$saveUserSettings(this.activeDid, {
       partnerApiServer: this.partnerApiServer,
     });
+
+    // Log successful partner server switch
+    logger.debug("[Server Switching] Partner server change completed:", {
+      did: this.activeDid,
+      previousServer: previousPartnerServer,
+      newServer: newPartnerServer,
+      changeType: "partnerApiServer",
+      settingsSaved: true,
+      timestamp: new Date().toISOString(),
+    });
   }
 
   async onClickSavePushServer(): Promise<void> {
@@ -1549,7 +1634,6 @@ export default class AccountViewView extends Vue {
 
   onMapReady(map: L.Map): void {
     try {
-      logger.debug("Map ready event fired, map object:", map);
       // doing this here instead of on the l-map element avoids a recentering after a drag then zoom at startup
       const zoom =
         this.userProfileLatitude && this.userProfileLongitude ? 12 : 2;
@@ -1578,19 +1662,15 @@ export default class AccountViewView extends Vue {
     // Try to set map ready after component is mounted
     setTimeout(() => {
       this.isMapReady = true;
-      logger.debug("Map ready set to true after mounted");
     }, 500);
   }
 
   // Fallback method to handle map initialization failures
   private handleMapInitFailure(): void {
-    logger.debug("Starting map initialization timeout (5 seconds)");
     setTimeout(() => {
       if (!this.isMapReady) {
         logger.warn("Map failed to initialize, forcing ready state");
         this.isMapReady = true;
-      } else {
-        logger.debug("Map initialized successfully, timeout not needed");
       }
     }, 5000); // 5 second timeout
   }
@@ -1614,12 +1694,20 @@ export default class AccountViewView extends Vue {
 
       logger.debug("Saving profile data:", profileData);
 
-      const success = await this.profileService.saveProfile(
+      const success = await this.saveProfileToServer(
         this.activeDid,
         profileData,
       );
       if (success) {
         this.notify.success(ACCOUNT_VIEW_CONSTANTS.SUCCESS.PROFILE_SAVED);
+
+        // Show seed phrase backup reminder if needed
+        try {
+          const settings = await this.$accountSettings();
+          showSeedPhraseReminder(!!settings.hasBackedUpSeed, this.$notify);
+        } catch (error) {
+          logger.error("Error checking seed backup status:", error);
+        }
       } else {
         this.notify.error(ACCOUNT_VIEW_CONSTANTS.ERRORS.PROFILE_SAVE_ERROR);
       }
@@ -1633,7 +1721,7 @@ export default class AccountViewView extends Vue {
 
   toggleUserProfileLocation(): void {
     try {
-      const updated = this.profileService.toggleProfileLocation({
+      const updated = this.toggleProfileLocation({
         description: this.userProfileDesc,
         latitude: this.userProfileLatitude,
         longitude: this.userProfileLongitude,
@@ -1678,8 +1766,7 @@ export default class AccountViewView extends Vue {
 
   async deleteProfile(): Promise<void> {
     try {
-      logger.debug("Attempting to delete profile for DID:", this.activeDid);
+      const success = await this.deleteProfileFromServer(this.activeDid);
-      const success = await this.profileService.deleteProfile(this.activeDid);
       if (success) {
         this.notify.success(ACCOUNT_VIEW_CONSTANTS.SUCCESS.PROFILE_DELETED);
         this.userProfileDesc = "";
@@ -1687,7 +1774,6 @@ export default class AccountViewView extends Vue {
         this.userProfileLongitude = 0;
         this.includeUserProfileLocation = false;
         this.isMapReady = false; // Reset map state
-        logger.debug("Profile deleted successfully, UI state reset");
       } else {
         this.notify.error(ACCOUNT_VIEW_CONSTANTS.ERRORS.PROFILE_DELETE_ERROR);
       }
@@ -1733,7 +1819,6 @@ export default class AccountViewView extends Vue {
         this.isMapReady = false;
         this.userProfileLatitude = 0;
         this.userProfileLongitude = 0;
-        logger.debug("Location unchecked, map state reset");
       } else {
         // Location checkbox was checked, start map initialization timeout
         this.isMapReady = false;
@@ -1742,7 +1827,6 @@ export default class AccountViewView extends Vue {
         // Try to set map ready after a short delay to allow Vue to render
         setTimeout(() => {
           if (!this.isMapReady) {
-            logger.debug("Setting map ready after timeout");
             this.isMapReady = true;
           }
         }, 1000); // 1 second delay
@@ -1795,5 +1879,338 @@ export default class AccountViewView extends Vue {
   onRecheckLimits() {
     this.checkLimits();
   }
+
+  // Inlined profile methods (previously in ProfileService)
+
+  /**
+   * Load user profile from the partner API
+   */
+  private async loadProfile(did: string): Promise<ProfileData | null> {
+    try {
+      const requestId = `profile_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
+
+      logger.debug("[AccountViewView] Loading profile:", {
+        requestId,
+        did,
+        partnerApiServer: this.partnerApiServer,
+      });
+
+      // Get authentication headers
+      const headers = await getHeaders(did);
+
+      const fullUrl = `${this.partnerApiServer}/api/partner/userProfileForIssuer/${did}`;
+
+      logger.debug("[AccountViewView] Making API request:", {
+        requestId,
+        did,
+        fullUrl,
+        hasAuthHeader: !!headers.Authorization,
+      });
+
+      const response = await this.axios.get(fullUrl, { headers });
+
+      logger.debug("[AccountViewView] Profile loaded successfully:", {
+        requestId,
+        status: response.status,
+        hasData: !!response.data,
+      });
+
+      if (response.data && response.data.data) {
+        const profileData = response.data.data;
+        logger.debug("[AccountViewView] Parsing profile data:", {
+          requestId,
+          locLat: profileData.locLat,
+          locLon: profileData.locLon,
+          description: profileData.description,
+        });
+
+        const result = {
+          description: profileData.description || "",
+          latitude: profileData.locLat || 0,
+          longitude: profileData.locLon || 0,
+          includeLocation: !!(profileData.locLat && profileData.locLon),
+        };
+
+        logger.debug("[AccountViewView] Parsed profile result:", {
+          requestId,
+          result,
+          hasLocation: result.includeLocation,
+        });
+
+        return result;
+      } else {
+        logger.debug("[AccountViewView] No profile data found in response:", {
+          requestId,
+          hasData: !!response.data,
+          hasDataData: !!(response.data && response.data.data),
+        });
+      }
+
+      return null;
+    } catch (error: unknown) {
+      // Handle specific HTTP status codes cleanly to suppress console spam
+      if (error && typeof error === "object" && "response" in error) {
+        const axiosError = error as { response?: { status?: number } };
+
+        if (axiosError.response?.status === 404) {
+          logger.info(
+            "[Profile] No profile found - this is normal for new users",
+            {
+              did,
+              server: this.partnerApiServer,
+              status: 404,
+              timestamp: new Date().toISOString(),
+            },
+          );
+          return null;
+        }
+
+        if (axiosError.response?.status === 400) {
+          logger.warn("[Profile] Bad request - user may not be registered", {
+            did,
+            server: this.partnerApiServer,
+            status: 400,
+            timestamp: new Date().toISOString(),
+          });
+          return null;
+        }
+
+        if (
+          axiosError.response?.status === 401 ||
+          axiosError.response?.status === 403
+        ) {
+          logger.warn("[Profile] Authentication/authorization issue", {
+            did,
+            server: this.partnerApiServer,
+            status: axiosError.response.status,
+            timestamp: new Date().toISOString(),
+          });
+          return null;
+        }
+      }
+
+      // Only log full errors for unexpected issues (5xx, network errors, etc.)
+      logger.error("[Profile] Unexpected error loading profile:", {
+        did,
+        server: this.partnerApiServer,
+        error: error instanceof Error ? error.message : String(error),
+        timestamp: new Date().toISOString(),
+      });
+      throw new Error("Failed to load profile");
+    }
+  }
+
+  /**
+   * Save user profile to the partner API
+   */
+  private async saveProfileToServer(
+    did: string,
+    profileData: ProfileData,
+  ): Promise<boolean> {
+    try {
+      const requestId = `profile_save_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
+
+      logger.debug("[AccountViewView] Saving profile:", {
+        requestId,
+        did,
+        profileData,
+      });
+
+      // Get authentication headers
+      const headers = await getHeaders(did);
+
+      // Prepare payload in the format expected by the partner API
+      const payload = {
+        description: profileData.description,
+        issuerDid: did,
+        ...(profileData.includeLocation &&
+        profileData.latitude &&
+        profileData.longitude
+          ? {
+              locLat: profileData.latitude,
+              locLon: profileData.longitude,
+            }
+          : {}),
+      };
+
+      logger.debug("[AccountViewView] Sending payload to server:", {
+        requestId,
+        payload,
+        hasLocation: profileData.includeLocation,
+      });
+
+      const response = await this.axios.post(
+        `${this.partnerApiServer}/api/partner/userProfile`,
+        payload,
+        { headers },
+      );
+
+      logger.debug("[AccountViewView] Profile saved successfully:", {
+        requestId,
+        status: response.status,
+      });
+
+      return true;
+    } catch (error: unknown) {
+      // Handle specific HTTP status codes cleanly to suppress console spam
+      if (error && typeof error === "object" && "response" in error) {
+        const axiosError = error as { response?: { status?: number } };
+
+        if (axiosError.response?.status === 400) {
+          logger.warn("[Profile] Bad request saving profile", {
+            did,
+            server: this.partnerApiServer,
+            status: 400,
+            timestamp: new Date().toISOString(),
+          });
+          throw new Error("Invalid profile data");
+        }
+
+        if (
+          axiosError.response?.status === 401 ||
+          axiosError.response?.status === 403
+        ) {
+          logger.warn(
+            "[Profile] Authentication/authorization issue saving profile",
+            {
+              did,
+              server: this.partnerApiServer,
+              status: axiosError.response.status,
+              timestamp: new Date().toISOString(),
+            },
+          );
+          throw new Error("Authentication required");
+        }
+
+        if (axiosError.response?.status === 409) {
+          logger.warn("[Profile] Profile conflict - may already exist", {
+            did,
+            server: this.partnerApiServer,
+            status: 409,
+            timestamp: new Date().toISOString(),
+          });
+          throw new Error("Profile already exists");
+        }
+      }
+
+      // Only log full errors for unexpected issues
+      logger.error("[Profile] Unexpected error saving profile:", {
+        did,
+        server: this.partnerApiServer,
+        error: error instanceof Error ? error.message : String(error),
+        timestamp: new Date().toISOString(),
+      });
+      throw new Error("Failed to save profile");
+    }
+  }
+
+  /**
+   * Toggle profile location visibility
+   */
+  private toggleProfileLocation(profileData: ProfileData): ProfileData {
+    const includeLocation = !profileData.includeLocation;
+    return {
+      ...profileData,
+      latitude: includeLocation ? profileData.latitude : 0,
+      longitude: includeLocation ? profileData.longitude : 0,
+      includeLocation,
+    };
+  }
+
+  /**
+   * Clear profile location
+   */
+  private clearProfileLocation(profileData: ProfileData): ProfileData {
+    return {
+      ...profileData,
+      latitude: 0,
+      longitude: 0,
+      includeLocation: false,
+    };
+  }
+
+  /**
+   * Get default profile data
+   */
+  private getDefaultProfile(): ProfileData {
+    return {
+      description: "",
+      latitude: 0,
+      longitude: 0,
+      includeLocation: false,
+    };
+  }
+
+  /**
+   * Delete user profile from the partner API
+   */
+  private async deleteProfileFromServer(did: string): Promise<boolean> {
+    try {
+      const requestId = `profile_delete_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
+
+      logger.debug("[AccountViewView] Deleting profile:", {
+        requestId,
+        did,
+      });
+
+      // Get authentication headers
+      const headers = await getHeaders(did);
+
+      const response = await this.axios.delete(
+        `${this.partnerApiServer}/api/partner/userProfile/${did}`,
+        { headers },
+      );
+
+      logger.debug("[AccountViewView] Profile deleted successfully:", {
+        requestId,
+        status: response.status,
+      });
+
+      return true;
+    } catch (error: unknown) {
+      // Handle specific HTTP status codes cleanly to suppress console spam
+      if (error && typeof error === "object" && "response" in error) {
+        const axiosError = error as { response?: { status?: number } };
+
+        if (axiosError.response?.status === 404) {
+          logger.info(
+            "[Profile] Profile not found for deletion - may already be deleted",
+            {
+              did,
+              server: this.partnerApiServer,
+              status: 404,
+              timestamp: new Date().toISOString(),
+            },
+          );
+          return true; // Consider it successful if already deleted
+        }
+
+        if (
+          axiosError.response?.status === 401 ||
+          axiosError.response?.status === 403
+        ) {
+          logger.warn(
+            "[Profile] Authentication/authorization issue deleting profile",
+            {
+              did,
+              server: this.partnerApiServer,
+              status: axiosError.response.status,
+              timestamp: new Date().toISOString(),
+            },
+          );
+          return false;
+        }
+      }
+
+      // Only log full errors for unexpected issues
+      logger.error("[Profile] Unexpected error deleting profile:", {
+        did,
+        server: this.partnerApiServer,
+        error: error instanceof Error ? error.message : String(error),
+        timestamp: new Date().toISOString(),
+      });
+      return false;
+    }
+  }
 }
 </script>

src/views/ClaimAddRawView.vue

@@ -41,6 +41,7 @@ import { Router, RouteLocationNormalizedLoaded } from "vue-router";
 import { logger } from "../utils/logger";
 import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
 import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
+import { showSeedPhraseReminder } from "@/utils/seedPhraseReminder";
 
 // Type guard for API responses
 function isApiResponse(response: unknown): response is AxiosResponse {
@@ -223,6 +224,14 @@ export default class ClaimAddRawView extends Vue {
     );
     if (result.success) {
       this.notify.success("Claim submitted.", TIMEOUTS.LONG);
+
+      // Show seed phrase backup reminder if needed
+      try {
+        const settings = await this.$accountSettings();
+        showSeedPhraseReminder(!!settings.hasBackedUpSeed, this.$notify);
+      } catch (error) {
+        logger.error("Error checking seed backup status:", error);
+      }
     } else {
       logger.error("Got error submitting the claim:", result);
       this.notify.error(

src/views/ClaimView.vue

@@ -24,7 +24,9 @@
           <div class="flex columns-3">
             <h2 class="text-md font-bold w-full">
               {{
-                capitalizeAndInsertSpacesBeforeCaps(veriClaim.claimType || "")
+                serverUtil.capitalizeAndInsertSpacesBeforeCaps(
+                  veriClaim.claimType || "",
+                )
               }}
               <button
                 v-if="canEditClaim"
@@ -56,7 +58,7 @@
                 title="Copy Printable Certificate Link"
                 aria-label="Copy printable certificate link"
                 @click="
-                  copyToClipboard(
+                  copyTextToClipboard(
                     'A link to the certificate page',
                     `${APP_SERVER}/deep-link/claim-cert/${veriClaim.id}`,
                   )
@@ -70,7 +72,9 @@
               <button
                 title="Copy Link"
                 aria-label="Copy page link"
-                @click="copyToClipboard('A link to this page', windowDeepLink)"
+                @click="
+                  copyTextToClipboard('A link to this page', windowDeepLink)
+                "
               >
                 <font-awesome icon="link" class="text-slate-500" />
               </button>
@@ -106,77 +110,91 @@
             </div>
 
             <!-- Fullfills Links -->
-
+            <div class="mt-4 empty:hidden">
-            <!-- fullfills links for a give -->
+              <!-- fullfills links for a give -->
-            <div v-if="detailsForGive?.fulfillsPlanHandleId" class="mt-4">
+              <div v-if="detailsForGive?.fulfillsPlanHandleId">
-              <router-link
+                <router-link
-                :to="
+                  :to="
-                  '/project/' +
+                    '/project/' +
-                  encodeURIComponent(detailsForGive?.fulfillsPlanHandleId)
+                    encodeURIComponent(detailsForGive?.fulfillsPlanHandleId)
-                "
+                  "
-                class="text-blue-500 mt-2"
+                  class="text-blue-500 mt-2"
-              >
-                Fulfills a bigger plan...
-              </router-link>
-            </div>
-            <!-- if there's another, it's probably fulfilling an offer, too -->
-            <div
-              v-if="
-                detailsForGive?.fulfillsType &&
-                detailsForGive?.fulfillsType !== 'PlanAction' &&
-                detailsForGive?.fulfillsHandleId
-              "
-            >
-              <!-- router-link to /claim/ only changes URL path -->
-              <a
-                class="text-blue-500 mt-4 cursor-pointer"
-                @click="
-                  showDifferentClaimPage(detailsForGive?.fulfillsHandleId)
-                "
-              >
-                Fulfills
-                {{
-                  capitalizeAndInsertSpacesBeforeCaps(
-                    detailsForGive.fulfillsType,
-                  )
-                }}...
-              </a>
-            </div>
-
-            <!-- fullfills links for an offer -->
-            <div v-if="detailsForOffer?.fulfillsPlanHandleId">
-              <router-link
-                :to="
-                  '/project/' +
-                  encodeURIComponent(detailsForOffer?.fulfillsPlanHandleId)
-                "
-                class="text-blue-500 mt-4"
-              >
-                Offered to a bigger plan...
-              </router-link>
-            </div>
-
-            <!-- Providers -->
-            <div v-if="providersForGive?.length > 0" class="mt-4">
-              <span>Other assistance provided by:</span>
-              <ul class="ml-4">
-                <li
-                  v-for="provider of providersForGive"
-                  :key="provider.identifier"
-                  class="list-disc ml-4"
                 >
-                  <div class="flex gap-4">
+                  This fulfills a bigger plan
-                    <div class="grow overflow-hidden">
+                  <font-awesome
-                      <a
+                    icon="arrow-up-right-from-square"
-                        class="text-blue-500 mt-4 cursor-pointer"
+                    class="fa-fw"
-                        @click="handleProviderClick(provider)"
+                  />
-                      >
+                </router-link>
-                        an activity...
+              </div>
-                      </a>
+
+              <!-- Show offer fulfillment if this give fulfills an offer -->
+              <div v-if="detailsForGiveOfferFulfillment?.offerHandleId">
+                <!-- router-link to /claim/ only changes URL path -->
+                <a
+                  class="text-blue-500 mt-4 cursor-pointer"
+                  @click="
+                    showDifferentClaimPage(
+                      detailsForGiveOfferFulfillment.offerHandleId,
+                    )
+                  "
+                >
+                  This fulfills
+                  {{
+                    serverUtil.capitalizeAndInsertSpacesBeforeCapsWithAPrefix(
+                      detailsForGiveOfferFulfillment.offerType || "Offer",
+                    )
+                  }}
+                  <font-awesome
+                    icon="arrow-up-right-from-square"
+                    class="fa-fw"
+                  />
+                </a>
+              </div>
+
+              <!-- fullfills links for an offer -->
+              <div v-if="detailsForOffer?.fulfillsPlanHandleId">
+                <router-link
+                  :to="
+                    '/project/' +
+                    encodeURIComponent(detailsForOffer?.fulfillsPlanHandleId)
+                  "
+                  class="text-blue-500 mt-4"
+                >
+                  Offered to a bigger plan
+                  <font-awesome
+                    icon="arrow-up-right-from-square"
+                    class="fa-fw"
+                  />
+                </router-link>
+              </div>
+
+              <!-- Providers -->
+              <div v-if="providersForGive?.length > 0">
+                <span>Other assistance provided by:</span>
+                <ul class="ml-4">
+                  <li
+                    v-for="provider of providersForGive"
+                    :key="provider.identifier"
+                    class="list-disc ml-4"
+                  >
+                    <div class="flex gap-4">
+                      <div class="grow overflow-hidden">
+                        <a
+                          class="text-blue-500 mt-4 cursor-pointer"
+                          @click="handleProviderClick(provider)"
+                        >
+                          an activity
+                          <font-awesome
+                            icon="arrow-up-right-from-square"
+                            class="fa-fw"
+                          />
+                        </a>
+                      </div>
                     </div>
-                  </div>
+                  </li>
-                </li>
+                </ul>
-              </ul>
+              </div>
             </div>
           </div>
         </div>
@@ -383,7 +401,7 @@
           contacts can see more details:
           <a
             class="text-blue-500"
-            @click="copyToClipboard('A link to this page', windowDeepLink)"
+            @click="copyTextToClipboard('A link to this page', windowDeepLink)"
             >click to copy this page info</a
           >
           and see if they can make an introduction. Someone is connected to
@@ -406,7 +424,7 @@
           If you'd like an introduction,
           <a
             class="text-blue-500"
-            @click="copyToClipboard('A link to this page', windowDeepLink)"
+            @click="copyTextToClipboard('A link to this page', windowDeepLink)"
             >share this page with them and ask if they'll tell you more about
             about the participants.</a
           >
@@ -516,7 +534,7 @@ import * as yaml from "js-yaml";
 import * as R from "ramda";
 import { Component, Vue } from "vue-facing-decorator";
 import { Router, RouteLocationNormalizedLoaded } from "vue-router";
-import { useClipboard } from "@vueuse/core";
+import { copyToClipboard } from "../services/ClipboardService";
 import { GenericVerifiableCredential } from "../interfaces";
 import GiftedDialog from "../components/GiftedDialog.vue";
 import QuickNav from "../components/QuickNav.vue";
@@ -556,6 +574,17 @@ export default class ClaimView extends Vue {
     fulfillsPlanHandleId?: string;
     fulfillsType?: string;
     fulfillsHandleId?: string;
+    fullClaim?: {
+      fulfills?: Array<{
+        "@type": string;
+        identifier?: string;
+      }>;
+    };
+  } | null = null;
+  // Additional offer information extracted from the fulfills array
+  detailsForGiveOfferFulfillment: {
+    offerHandleId?: string;
+    offerType?: string;
   } | null = null;
   detailsForOffer: { fulfillsPlanHandleId?: string } | null = null;
   // Project information for fulfillsPlanHandleId
@@ -689,6 +718,7 @@ export default class ClaimView extends Vue {
     this.confsVisibleToIdList = [];
     this.detailsForGive = null;
     this.detailsForOffer = null;
+    this.detailsForGiveOfferFulfillment = null;
     this.projectInfo = null;
     this.fullClaim = null;
     this.fullClaimDump = "";
@@ -701,6 +731,15 @@ export default class ClaimView extends Vue {
     this.veriClaimDidsVisible = {};
   }
 
+  /**
+   * Extract offer fulfillment information from the fulfills array
+   */
+  extractOfferFulfillment() {
+    this.detailsForGiveOfferFulfillment = libsUtil.extractOfferFulfillment(
+      this.detailsForGive?.fullClaim?.fulfills
+    );
+  }
+
   // =================================================
   // UTILITY METHODS
   // =================================================
@@ -758,13 +797,6 @@ export default class ClaimView extends Vue {
     this.canShare = !!navigator.share;
   }
 
-  // insert a space before any capital letters except the initial letter
-  // (and capitalize initial letter, just in case)
-  capitalizeAndInsertSpacesBeforeCaps(text: string): string {
-    if (!text) return "";
-    return text[0].toUpperCase() + text.substr(1).replace(/([A-Z])/g, " $1");
-  }
-
   totalConfirmers() {
     return (
       this.numConfsNotVisible +
@@ -821,6 +853,8 @@ export default class ClaimView extends Vue {
         });
         if (giveResp.status === 200 && giveResp.data.data?.length > 0) {
           this.detailsForGive = giveResp.data.data[0];
+          // Extract offer information from the fulfills array
+          this.extractOfferFulfillment();
         } else {
           await this.$logError(
             "Error getting detailed give info: " + JSON.stringify(giveResp),
@@ -1097,16 +1131,21 @@ export default class ClaimView extends Vue {
     );
   }
 
-  copyToClipboard(name: string, text: string) {
+  async copyTextToClipboard(name: string, text: string) {
-    useClipboard()
+    try {
-      .copy(text)
+      await copyToClipboard(text);
-      .then(() => {
+      this.notify.copied(name || "That");
-        this.notify.copied(name || "That");
+    } catch (error) {
-      });
+      this.$logAndConsole(
+        `Error copying ${name || "content"} to clipboard: ${error}`,
+        true,
+      );
+      this.notify.error(`Failed to copy ${name || "content"} to clipboard.`);
+    }
   }
 
   onClickShareClaim() {
-    this.copyToClipboard("A link to this page", this.windowDeepLink);
+    this.copyTextToClipboard("A link to this page", this.windowDeepLink);
     window.navigator.share({
       title: "Help Connect Me",
       text: "I'm trying to find the people who recorded this. Can you help me?",

src/views/ConfirmGiftView.vue

@@ -96,50 +96,50 @@
               </div>
 
               <!-- Fullfills Links -->
+              <div class="mt-4">
+                <!-- fullfills links for a give -->
+                <div v-if="giveDetails?.fulfillsPlanHandleId">
+                  <router-link
+                    :to="
+                      '/project/' +
+                      encodeURIComponent(
+                        giveDetails?.fulfillsPlanHandleId || '',
+                      )
+                    "
+                    class="text-blue-500 mt-2 cursor-pointer"
+                  >
+                    This fulfills a bigger plan
+                    <font-awesome
+                      icon="arrow-up-right-from-square"
+                      class="fa-fw"
+                    />
+                  </router-link>
+                </div>
 
-              <!-- fullfills links for a give -->
+                <!-- Show offer fulfillment if this give fulfills an offer -->
-              <div v-if="giveDetails?.fulfillsPlanHandleId" class="mt-2">
+                <div v-if="giveDetailsOfferFulfillment?.offerHandleId">
-                <router-link
+                  <!-- router-link to /claim/ only changes URL path -->
-                  :to="
+                  <router-link
-                    '/project/' +
+                    :to="
-                    encodeURIComponent(giveDetails?.fulfillsPlanHandleId || '')
+                      '/claim/' +
-                  "
+                      encodeURIComponent(
-                  class="text-blue-500 mt-2 cursor-pointer"
+                        giveDetailsOfferFulfillment.offerHandleId || '',
-                >
+                      )
-                  This fulfills a bigger plan
+                    "
-                  <font-awesome
+                    class="text-blue-500 mt-2 cursor-pointer"
-                    icon="arrow-up-right-from-square"
+                  >
-                    class="fa-fw"
+                    This fulfills
-                  />
+                    {{
-                </router-link>
+                      serverUtil.capitalizeAndInsertSpacesBeforeCapsWithAPrefix(
-              </div>
+                        giveDetailsOfferFulfillment.offerType || "Offer",
-              <!-- if there's another, it's probably fulfilling an offer, too -->
+                      )
-              <div
+                    }}
-                v-if="
+                    <font-awesome
-                  giveDetails?.fulfillsType &&
+                      icon="arrow-up-right-from-square"
-                  giveDetails?.fulfillsType !== 'PlanAction' &&
+                      class="fa-fw"
-                  giveDetails?.fulfillsHandleId
+                    />
-                "
+                  </router-link>
-              >
+                </div>
-                <!-- router-link to /claim/ only changes URL path -->
-                <router-link
-                  :to="
-                    '/claim/' +
-                    encodeURIComponent(giveDetails?.fulfillsHandleId || '')
-                  "
-                  class="text-blue-500 mt-2 cursor-pointer"
-                >
-                  This fulfills
-                  {{
-                    capitalizeAndInsertSpacesBeforeCapsWithAPrefix(
-                      giveDetails?.fulfillsType || "",
-                    )
-                  }}
-                  <font-awesome
-                    icon="arrow-up-right-from-square"
-                    class="fa-fw"
-                  />
-                </router-link>
               </div>
             </div>
           </div>
@@ -192,7 +192,7 @@
                       <span v-if="!serverUtil.isEmptyOrHiddenDid(confirmerId)">
                         <button
                           @click="
-                            copyToClipboard(
+                            copyTextToClipboard(
                               'The DID of ' + confirmerId,
                               confirmerId,
                             )
@@ -238,7 +238,7 @@
                       >
                         <button
                           @click="
-                            copyToClipboard(
+                            copyTextToClipboard(
                               'The DID of ' + confsVisibleTo,
                               confsVisibleTo,
                             )
@@ -309,7 +309,9 @@
             contacts can see more details:
             <a
               class="text-blue-500"
-              @click="copyToClipboard('A link to this page', windowLocation)"
+              @click="
+                copyTextToClipboard('A link to this page', windowLocation)
+              "
               >click to copy this page info</a
             >
             and see if they can make an introduction. Someone is connected to
@@ -332,7 +334,9 @@
             If you'd like an introduction,
             <a
               class="text-blue-500"
-              @click="copyToClipboard('A link to this page', windowLocation)"
+              @click="
+                copyTextToClipboard('A link to this page', windowLocation)
+              "
               >share this page with them and ask if they'll tell you more about
               about the participants.</a
             >
@@ -360,7 +364,7 @@
                       <span v-if="!serverUtil.isEmptyOrHiddenDid(visDid)">
                         <button
                           @click="
-                            copyToClipboard('The DID of ' + visDid, visDid)
+                            copyTextToClipboard('The DID of ' + visDid, visDid)
                           "
                         >
                           <font-awesome
@@ -433,7 +437,7 @@
 import * as yaml from "js-yaml";
 import * as R from "ramda";
 import { Component, Vue } from "vue-facing-decorator";
-import { useClipboard } from "@vueuse/core";
+import { copyToClipboard } from "../services/ClipboardService";
 import { RouteLocationNormalizedLoaded, Router } from "vue-router";
 import QuickNav from "../components/QuickNav.vue";
 import { NotificationIface } from "../constants/app";
@@ -493,6 +497,11 @@ export default class ConfirmGiftView extends Vue {
   confsVisibleErrorMessage = "";
   confsVisibleToIdList: string[] = []; // list of DIDs that can see any confirmer
   giveDetails?: GiveSummaryRecord;
+  // Additional offer information extracted from the fulfills array
+  giveDetailsOfferFulfillment: {
+    offerHandleId?: string;
+    offerType?: string;
+  } | null = null;
   giverName = "";
   issuerName = "";
   isLoading = false;
@@ -648,6 +657,8 @@ export default class ConfirmGiftView extends Vue {
 
       if (resp.status === 200) {
         this.giveDetails = resp.data.data[0];
+        // Extract offer information from the fulfills array
+        this.extractOfferFulfillment();
       } else {
         throw new Error("Error getting detailed give info: " + resp.status);
       }
@@ -707,6 +718,15 @@ export default class ConfirmGiftView extends Vue {
     }
   }
 
+  /**
+   * Extract offer fulfillment information from the fulfills array
+   */
+  private extractOfferFulfillment() {
+    this.giveDetailsOfferFulfillment = libsUtil.extractOfferFulfillment(
+      this.giveDetails?.fullClaim?.fulfills
+    );
+  }
+
   /**
    * Fetches confirmer information for the claim
    */
@@ -763,16 +783,21 @@ export default class ConfirmGiftView extends Vue {
    * @param description - Description of copied content
    * @param text - Text to copy
    */
-  copyToClipboard(description: string, text: string): void {
+  async copyTextToClipboard(description: string, text: string): Promise<void> {
-    useClipboard()
+    try {
-      .copy(text)
+      await copyToClipboard(text);
-      .then(() => {
+      this.notify.toast(
-        this.notify.toast(
+        NOTIFY_COPIED_TO_CLIPBOARD.title,
-          NOTIFY_COPIED_TO_CLIPBOARD.title,
+        NOTIFY_COPIED_TO_CLIPBOARD.message(description),
-          NOTIFY_COPIED_TO_CLIPBOARD.message(description),
+        TIMEOUTS.SHORT,
-          TIMEOUTS.SHORT,
+      );
-        );
+    } catch (error) {
-      });
+      this.$logAndConsole(
+        `Error copying ${description} to clipboard: ${error}`,
+        true,
+      );
+      this.notify.error(`Failed to copy ${description} to clipboard.`);
+    }
   }
 
   /**
@@ -849,33 +874,12 @@ export default class ConfirmGiftView extends Vue {
     );
   }
 
-  /**
-   * Formats type string for display by adding spaces before capitals
-   * Optionally adds a prefix
-   *
-   * @param text - Text to format
-   * @param prefix - Optional prefix to add
-   * @returns Formatted string
-   */
-  capitalizeAndInsertSpacesBeforeCapsWithAPrefix(text: string): string {
-    const word = this.capitalizeAndInsertSpacesBeforeCaps(text);
-    if (word) {
-      // if the word starts with a vowel, use "an" instead of "a"
-      const firstLetter = word[0].toLowerCase();
-      const vowels = ["a", "e", "i", "o", "u"];
-      const particle = vowels.includes(firstLetter) ? "an" : "a";
-      return particle + " " + word;
-    } else {
-      return "";
-    }
-  }
-
   /**
    * Initiates sharing of claim information
    * Handles share functionality based on platform capabilities
    */
   async onClickShareClaim(): Promise<void> {
-    this.copyToClipboard("A link to this page", this.windowLocation);
+    this.copyTextToClipboard("A link to this page", this.windowLocation);
     window.navigator.share({
       title: "Help Connect Me",
       text: "I'm trying to find the full details of this claim. Can you help me?",
@@ -894,11 +898,5 @@ export default class ConfirmGiftView extends Vue {
     this.veriClaim = serverUtil.BLANK_GENERIC_SERVER_RECORD;
     this.veriClaimDump = "";
   }
-
-  capitalizeAndInsertSpacesBeforeCaps(text: string) {
-    return !text
-      ? ""
-      : text[0].toUpperCase() + text.substr(1).replace(/([A-Z])/g, " $1");
-  }
 }
 </script>

src/views/ContactAmountsView.vue

@@ -124,7 +124,7 @@ import {
   NOTIFY_CONFIRMATION_RESTRICTION,
 } from "../constants/notifications";
 import { Contact } from "../db/tables/contacts";
-import { MASTER_SETTINGS_KEY } from "../db/tables/settings";
+
 import { GiveSummaryRecord, GiveActionClaim } from "../interfaces";
 import { AgreeActionClaim } from "../interfaces/claims";
 import {
@@ -223,7 +223,7 @@ export default class ContactAmountssView extends Vue {
       const contact = await this.$getContact(contactDid);
       this.contact = contact;
 
-      const settings = await this.$getSettings(MASTER_SETTINGS_KEY);
+      const settings = await this.$getMasterSettings();
       this.activeDid = settings?.activeDid || "";
       this.apiServer = settings?.apiServer || "";
 

src/views/ContactGiftingView.vue

@@ -17,20 +17,40 @@
 
     <!-- Results List -->
     <ul class="border-t border-slate-300">
-      <li class="border-b border-slate-300 py-3">
+      <!-- "You" entity -->
+      <li v-if="shouldShowYouEntity" class="border-b border-slate-300 py-3">
         <h2 class="text-base flex gap-4 items-center">
           <span class="grow flex gap-2 items-center font-medium">
-            <font-awesome
+            <font-awesome icon="hand" class="text-blue-500 text-4xl shrink-0" />
-              icon="circle-question"
+            <span class="text-ellipsis overflow-hidden text-blue-500">You</span>
-              class="text-slate-400 text-4xl"
-            />
-            <span class="italic text-slate-400">(Not Named)</span>
           </span>
           <span class="text-right">
             <button
               type="button"
               class="block w-full text-center text-sm uppercase bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-3 py-1.5 rounded-md"
-              @click="openDialog('Unnamed')"
+              @click="openDialog({ did: activeDid, name: 'You' })"
+            >
+              <font-awesome icon="gift" class="fa-fw"></font-awesome>
+            </button>
+          </span>
+        </h2>
+      </li>
+      <li class="border-b border-slate-300 py-3">
+        <h2 class="text-base flex gap-4 items-center">
+          <span class="grow flex gap-2 items-center font-medium">
+            <font-awesome
+              icon="circle-question"
+              class="text-slate-400 text-4xl shrink-0"
+            />
+            <span class="text-ellipsis overflow-hidden italic text-slate-500">{{
+              unnamedEntityName
+            }}</span>
+          </span>
+          <span class="text-right">
+            <button
+              type="button"
+              class="block w-full text-center text-sm uppercase bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-3 py-1.5 rounded-md"
+              @click="openDialog({ did: '', name: unnamedEntityName })"
             >
               <font-awesome icon="gift" class="fa-fw"></font-awesome>
             </button>
@@ -43,14 +63,22 @@
         class="border-b border-slate-300 py-3"
       >
         <h2 class="text-base flex gap-4 items-center">
-          <span class="grow flex gap-2 items-center font-medium">
+          <span
+            class="grow flex gap-2 items-center font-medium overflow-hidden"
+          >
             <EntityIcon
               :contact="contact"
               :icon-size="34"
-              class="inline-block align-middle border border-slate-300 rounded-full overflow-hidden"
+              class="inline-block align-middle border border-slate-300 rounded-full overflow-hidden shrink-0"
             />
-            <span v-if="contact.name">{{ contact.name }}</span>
+            <span v-if="contact.name" class="text-ellipsis overflow-hidden">{{
-            <span v-else class="italic text-slate-400">(No name)</span>
+              contact.name
+            }}</span>
+            <span
+              v-else
+              class="text-ellipsis overflow-hidden italic text-slate-500"
+              >{{ contact.did }}</span
+            >
           </span>
           <span class="text-right">
             <button
@@ -72,6 +100,7 @@
       :from-project-id="fromProjectId"
       :to-project-id="toProjectId"
       :is-from-project-view="isFromProjectView"
+      :hide-show-all="true"
     />
   </section>
 </template>
@@ -89,6 +118,7 @@ import { GiverReceiverInputInfo } from "../libs/util";
 import { logger } from "../utils/logger";
 import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
 import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
+import { UNNAMED_ENTITY_NAME } from "@/constants/entities";
 @Component({
   components: { GiftedDialog, QuickNav, EntityIcon },
   mixins: [PlatformServiceMixin],
@@ -188,147 +218,151 @@ export default class ContactGiftingView extends Vue {
     }
   }
 
-  openDialog(contact?: GiverReceiverInputInfo | "Unnamed") {
+  openDialog(contact?: GiverReceiverInputInfo) {
-    if (contact === "Unnamed") {
+    // Determine the selected entity based on contact type
-      // Special case: Handle "Unnamed" contacts for both givers and recipients
+    const selectedEntity = this.createEntityFromContact(contact);
-      let recipient: GiverReceiverInputInfo;
-      let giver: GiverReceiverInputInfo | undefined;
 
-      if (this.stepType === "giver") {
+    // Create giver and recipient based on step type and selected entity
-        // We're selecting a giver, so preserve the existing recipient from context
+    const { giver, recipient } = this.createGiverAndRecipient(selectedEntity);
-        if (this.recipientEntityType === "project") {
-          recipient = {
-            did: this.recipientProjectHandleId,
-            name: this.recipientProjectName,
-            image: this.recipientProjectImage,
-            handleId: this.recipientProjectHandleId,
-          };
-        } else {
-          // Preserve the existing recipient from context
-          if (this.recipientDid === this.activeDid) {
-            // Recipient was "You"
-            recipient = { did: this.activeDid, name: "You" };
-          } else if (this.recipientDid) {
-            // Recipient was a regular contact
-            recipient = {
-              did: this.recipientDid,
-              name: this.recipientProjectName || "Someone",
-            };
-          } else {
-            // Fallback to "You" if no recipient was previously selected
-            recipient = { did: this.activeDid, name: "You" };
-          }
-        }
-        giver = undefined; // Will be set to "Unnamed" in GiftedDialog
-      } else {
-        // We're selecting a recipient, so recipient is "Unnamed" and giver is preserved from context
-        recipient = { did: "", name: "Unnamed" };
 
-        // Preserve the existing giver from the context
+    // Open the dialog
-        if (this.giverEntityType === "project") {
+    (this.$refs.giftedDialog as GiftedDialog).open(
-          giver = {
+      giver,
-            did: this.giverProjectHandleId,
+      recipient,
-            name: this.giverProjectName,
+      this.offerId,
-            image: this.giverProjectImage,
+      this.prompt,
-            handleId: this.giverProjectHandleId,
+      this.description,
-          };
+      this.amountInput,
-        } else if (this.giverDid) {
+      this.unitCode,
-          giver = {
+    );
-            did: this.giverDid,
-            name: this.giverProjectName || "Someone",
-          };
-        } else {
-          giver = { did: this.activeDid, name: "You" };
-        }
-      }
 
-      (this.$refs.giftedDialog as GiftedDialog).open(
+    // Move to Step 2 - entities are already set by the open() call
-        giver,
+    (this.$refs.giftedDialog as GiftedDialog).moveToStep2();
-        recipient,
+  }
-        this.offerId,
-        this.prompt,
-        this.description,
-        this.amountInput,
-        this.unitCode,
-      );
 
-      // Move to Step 2 - entities are already set by the open() call
+  /**
-      (this.$refs.giftedDialog as GiftedDialog).moveToStep2();
+   * Creates an entity object from the contact parameter
+   * Uses DID-based logic to determine "You" and "Unnamed" entities
+   */
+  private createEntityFromContact(
+    contact?: GiverReceiverInputInfo,
+  ): GiverReceiverInputInfo | undefined {
+    if (!contact) {
+      return undefined;
+    }
+
+    // Handle GiverReceiverInputInfo object
+    if (contact.did === this.activeDid) {
+      // If DID matches active DID, create "You" entity
+      return { did: this.activeDid, name: "You" };
+    } else if (!contact.did || contact.did === "") {
+      // If DID is empty/null, create "Unnamed" entity
+      return { did: "", name: UNNAMED_ENTITY_NAME };
     } else {
-      // Regular case: contact is a GiverReceiverInputInfo
+      // Create a copy of the contact to avoid modifying the original
-      let giver: GiverReceiverInputInfo;
+      return { ...contact };
-      let recipient: GiverReceiverInputInfo;
+    }
+  }
 
-      if (this.stepType === "giver") {
+  /**
-        // We're selecting a giver, so the contact becomes the giver
+   * Creates giver and recipient objects based on step type and selected entity
-        giver = contact as GiverReceiverInputInfo; // Safe because we know contact is not "Unnamed" or undefined
+   */
+  private createGiverAndRecipient(selectedEntity?: GiverReceiverInputInfo): {
+    giver: GiverReceiverInputInfo | undefined;
+    recipient: GiverReceiverInputInfo;
+  } {
+    if (this.stepType === "giver") {
+      // We're selecting a giver, so the selected entity becomes the giver
+      const giver = selectedEntity;
+      const recipient = this.createRecipientFromContext();
+      return { giver, recipient };
+    } else {
+      // We're selecting a recipient, so the selected entity becomes the recipient
+      const recipient = selectedEntity || {
+        did: "",
+        name: UNNAMED_ENTITY_NAME,
+      };
+      const giver = this.createGiverFromContext();
+      return { giver, recipient };
+    }
+  }
 
-        // Preserve the existing recipient from the context
+  /**
-        if (this.recipientEntityType === "project") {
+   * Creates recipient object from context (preserves existing recipient)
-          recipient = {
+   */
-            did: this.recipientProjectHandleId,
+  private createRecipientFromContext(): GiverReceiverInputInfo {
-            name: this.recipientProjectName,
+    if (this.recipientEntityType === "project") {
-            image: this.recipientProjectImage,
+      return {
-            handleId: this.recipientProjectHandleId,
+        name: this.recipientProjectName,
-          };
+        image: this.recipientProjectImage,
-        } else {
+        handleId: this.recipientProjectHandleId,
-          // Check if the preserved recipient was "You" or a regular contact
+      };
-          if (this.recipientDid === this.activeDid) {
+    } else {
-            // Recipient was "You"
+      if (this.recipientDid === this.activeDid) {
-            recipient = { did: this.activeDid, name: "You" };
+        return { did: this.activeDid, name: "You" };
-          } else if (this.recipientDid) {
+      } else if (this.recipientDid) {
-            // Recipient was a regular contact
+        return {
-            recipient = {
+          did: this.recipientDid,
-              did: this.recipientDid,
+          name: this.recipientProjectName,
-              name: this.recipientProjectName || "Someone",
+        };
-            };
-          } else {
-            // Fallback to "Unnamed"
-            recipient = { did: "", name: "Unnamed" };
-          }
-        }
       } else {
-        // We're selecting a recipient, so the contact becomes the recipient
+        return { did: "", name: UNNAMED_ENTITY_NAME };
-        recipient = contact as GiverReceiverInputInfo; // Safe because we know contact is not "Unnamed" or undefined
-
-        // Preserve the existing giver from the context
-        if (this.giverEntityType === "project") {
-          giver = {
-            did: this.giverProjectHandleId,
-            name: this.giverProjectName,
-            image: this.giverProjectImage,
-            handleId: this.giverProjectHandleId,
-          };
-        } else {
-          // Check if the preserved giver was "You" or a regular contact
-          if (this.giverDid === this.activeDid) {
-            // Giver was "You"
-            giver = { did: this.activeDid, name: "You" };
-          } else if (this.giverDid) {
-            // Giver was a regular contact
-            giver = {
-              did: this.giverDid,
-              name: this.giverProjectName || "Someone",
-            };
-          } else {
-            // Fallback to "Unnamed"
-            giver = { did: "", name: "Unnamed" };
-          }
-        }
       }
+    }
+  }
 
-      (this.$refs.giftedDialog as GiftedDialog).open(
+  /**
-        giver,
+   * Creates giver object from context (preserves existing giver)
-        recipient,
+   */
-        this.offerId,
+  private createGiverFromContext(): GiverReceiverInputInfo {
-        this.prompt,
+    if (this.giverEntityType === "project") {
-        this.description,
+      return {
-        this.amountInput,
+        name: this.giverProjectName,
-        this.unitCode,
+        image: this.giverProjectImage,
-      );
+        handleId: this.giverProjectHandleId,
+      };
+    } else {
+      if (this.giverDid === this.activeDid) {
+        return { did: this.activeDid, name: "You" };
+      } else if (this.giverDid) {
+        return {
+          did: this.giverDid,
+          name: this.giverProjectName,
+        };
+      } else {
+        return { did: "", name: UNNAMED_ENTITY_NAME };
+      }
+    }
+  }
 
-      // Move to Step 2 - entities are already set by the open() call
+  /**
-      (this.$refs.giftedDialog as GiftedDialog).moveToStep2();
+   * Get the unnamed entity name constant
+   */
+  get unnamedEntityName(): string {
+    return UNNAMED_ENTITY_NAME;
+  }
+
+  get shouldShowYouEntity(): boolean {
+    if (this.stepType === "giver") {
+      // When selecting a giver, show "You" if the current recipient is not "You"
+      // This prevents selecting yourself as both giver and recipient
+      if (this.recipientEntityType === "project") {
+        // If recipient is a project, we can select "You" as giver
+        return true;
+      } else {
+        // If recipient is a person, check if it's not "You"
+        return this.recipientDid !== this.activeDid;
+      }
+    } else {
+      // When selecting a recipient, show "You" if the current giver is not "You"
+      // This prevents selecting yourself as both giver and recipient
+      if (this.giverEntityType === "project") {
+        // If giver is a project, we can select "You" as recipient
+        return true;
+      } else {
+        // If giver is a person, check if it's not "You"
+        return this.giverDid !== this.activeDid;
+      }
     }
   }
 }

src/views/ContactQRScanFullView.vue

@@ -104,7 +104,7 @@ import { Buffer } from "buffer/";
 import QRCodeVue3 from "qr-code-generator-vue3";
 import { Component, Vue } from "vue-facing-decorator";
 import { Router } from "vue-router";
-import { useClipboard } from "@vueuse/core";
+import { copyToClipboard } from "../services/ClipboardService";
 
 import { logger } from "../utils/logger";
 import { QRScannerFactory } from "../services/QRScanner/QRScannerFactory";
@@ -144,6 +144,7 @@ import {
   QR_TIMEOUT_LONG,
 } from "@/constants/notifications";
 import { createNotifyHelpers, NotifyFunction } from "../utils/notify";
+import { showSeedPhraseReminder } from "@/utils/seedPhraseReminder";
 
 interface QRScanResult {
   rawValue?: string;
@@ -195,7 +196,7 @@ export default class ContactQRScanFull extends Vue {
   $router!: Router;
 
   // Notification helper system
-  private notify = createNotifyHelpers(this.$notify);
+  private notify!: ReturnType<typeof createNotifyHelpers>;
 
   isScanning = false;
   error: string | null = null;
@@ -220,21 +221,21 @@ export default class ContactQRScanFull extends Vue {
    * Computed property for QR code container CSS classes
    */
   get qrContainerClasses(): string {
-    return "block w-full max-w-[calc((100vh-env(safe-area-inset-top)-env(safe-area-inset-bottom))*0.4)] mx-auto mt-4";
+    return "block w-full max-w-[calc((100vh-max(env(safe-area-inset-top),var(--safe-area-inset-top,0px))-max(env(safe-area-inset-bottom),var(--safe-area-inset-bottom,0px)))*0.4)] mx-auto mt-4";
   }
 
   /**
    * Computed property for camera frame CSS classes
    */
   get cameraFrameClasses(): string {
-    return "relative w-full max-w-[calc((100vh-env(safe-area-inset-top)-env(safe-area-inset-bottom))*0.4)] mx-auto border border-dashed border-white mt-8 aspect-square";
+    return "relative w-full max-w-[calc((100vh-max(env(safe-area-inset-top),var(--safe-area-inset-top,0px))-max(env(safe-area-inset-bottom),var(--safe-area-inset-bottom,0px)))*0.4)] mx-auto border border-dashed border-white mt-8 aspect-square";
   }
 
   /**
    * Computed property for main content container CSS classes
    */
   get mainContentClasses(): string {
-    return "p-6 bg-white w-full max-w-[calc((100vh-env(safe-area-inset-top)-env(safe-area-inset-bottom))*0.4)] mx-auto";
+    return "p-6 bg-white w-full max-w-[calc((100vh-max(env(safe-area-inset-top),var(--safe-area-inset-top,0px))-max(env(safe-area-inset-bottom),var(--safe-area-inset-bottom,0px)))*0.4)] mx-auto";
   }
 
   /**
@@ -263,6 +264,9 @@ export default class ContactQRScanFull extends Vue {
    * Loads user settings and generates QR code for contact sharing
    */
   async created() {
+    // Initialize notification helper system
+    this.notify = createNotifyHelpers(this.$notify);
+
     try {
       const settings = await this.$accountSettings();
       this.activeDid = settings.activeDid || "";
@@ -622,6 +626,15 @@ export default class ContactQRScanFull extends Vue {
    */
   async handleBack() {
     await this.cleanupScanner();
+
+    // Show seed phrase backup reminder if needed
+    try {
+      const settings = await this.$accountSettings();
+      showSeedPhraseReminder(!!settings.hasBackedUpSeed, this.$notify);
+    } catch (error) {
+      logger.error("Error checking seed backup status:", error);
+    }
+
     this.$router.back();
   }
 
@@ -636,36 +649,51 @@ export default class ContactQRScanFull extends Vue {
    * Copies contact URL to clipboard for sharing
    */
   async onCopyUrlToClipboard() {
-    const account = (await libsUtil.retrieveFullyDecryptedAccount(
+    try {
-      this.activeDid,
+      const account = (await libsUtil.retrieveFullyDecryptedAccount(
-    )) as Account;
+        this.activeDid,
-    const jwtUrl = await generateEndorserJwtUrlForAccount(
+      )) as Account;
-      account,
+      const jwtUrl = await generateEndorserJwtUrlForAccount(
-      this.isRegistered,
+        account,
-      this.givenName,
+        this.isRegistered,
-      this.profileImageUrl,
+        this.givenName,
-      true,
+        this.profileImageUrl,
-    );
+        true,
-    useClipboard()
+      );
-      .copy(jwtUrl)
+
-      .then(() => {
+      // Use the platform-specific ClipboardService for reliable iOS support
-        this.notify.toast(
+      await copyToClipboard(jwtUrl);
-          NOTIFY_QR_URL_COPIED.title,
+
-          NOTIFY_QR_URL_COPIED.message,
+      this.notify.toast(
-          QR_TIMEOUT_MEDIUM,
+        NOTIFY_QR_URL_COPIED.title,
-        );
+        NOTIFY_QR_URL_COPIED.message,
+        QR_TIMEOUT_MEDIUM,
+      );
+    } catch (error) {
+      logger.error("Error copying URL to clipboard:", {
+        error: error instanceof Error ? error.message : String(error),
+        stack: error instanceof Error ? error.stack : undefined,
       });
+      this.notify.error("Failed to copy URL to clipboard.");
+    }
   }
 
   /**
    * Copies DID to clipboard for manual sharing
    */
-  onCopyDidToClipboard() {
+  async onCopyDidToClipboard() {
-    useClipboard()
+    try {
-      .copy(this.activeDid)
+      // Use the platform-specific ClipboardService for reliable iOS support
-      .then(() => {
+      await copyToClipboard(this.activeDid);
-        this.notify.info(NOTIFY_QR_DID_COPIED.message, QR_TIMEOUT_LONG);
+
+      this.notify.info(NOTIFY_QR_DID_COPIED.message, QR_TIMEOUT_LONG);
+    } catch (error) {
+      logger.error("Error copying DID to clipboard:", {
+        error: error instanceof Error ? error.message : String(error),
+        stack: error instanceof Error ? error.stack : undefined,
       });
+      this.notify.error("Failed to copy DID to clipboard.");
+    }
   }
 
   /**

src/views/ContactQRScanShowView.vue

@@ -140,6 +140,7 @@ import { AxiosError } from "axios";
 import { Buffer } from "buffer/";
 import QRCodeVue3 from "qr-code-generator-vue3";
 import { Component, Vue } from "vue-facing-decorator";
+import { copyToClipboard } from "../services/ClipboardService";
 
 import { QrcodeStream } from "vue-qrcode-reader";
 
@@ -163,6 +164,7 @@ import { QRScannerFactory } from "@/services/QRScanner/QRScannerFactory";
 import { CameraState } from "@/services/QRScanner/types";
 import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
 import { createNotifyHelpers } from "@/utils/notify";
+import { showSeedPhraseReminder } from "@/utils/seedPhraseReminder";
 import {
   NOTIFY_QR_INITIALIZATION_ERROR,
   NOTIFY_QR_CAMERA_IN_USE,
@@ -257,11 +259,11 @@ export default class ContactQRScanShow extends Vue {
   }
 
   get qrCodeContainerClasses(): string {
-    return "block w-[90vw] max-w-[calc((100vh-env(safe-area-inset-top)-env(safe-area-inset-bottom))*0.4)] mx-auto my-4";
+    return "block w-[90vw] max-w-[calc((100vh-max(env(safe-area-inset-top),var(--safe-area-inset-top,0px))-max(env(safe-area-inset-bottom),var(--safe-area-inset-bottom,0px)))*0.4)] mx-auto my-4";
   }
 
   get scannerContainerClasses(): string {
-    return "relative aspect-square overflow-hidden bg-slate-800 w-[90vw] max-w-[calc((100vh-env(safe-area-inset-top)-env(safe-area-inset-bottom))*0.4)] mx-auto";
+    return "relative aspect-square overflow-hidden bg-slate-800 w-[90vw] max-w-[calc((100vh-max(env(safe-area-inset-top),var(--safe-area-inset-top,0px))-max(env(safe-area-inset-bottom),var(--safe-area-inset-bottom,0px)))*0.4)] mx-auto";
   }
 
   get statusMessageClasses(): string {
@@ -319,6 +321,15 @@ export default class ContactQRScanShow extends Vue {
 
   async handleBack(): Promise<void> {
     await this.cleanupScanner();
+
+    // Show seed phrase backup reminder if needed
+    try {
+      const settings = await this.$accountSettings();
+      showSeedPhraseReminder(!!settings.hasBackedUpSeed, this.$notify);
+    } catch (error) {
+      logger.error("Error checking seed backup status:", error);
+    }
+
     this.$router.back();
   }
 
@@ -618,7 +629,6 @@ export default class ContactQRScanShow extends Vue {
       );
 
       // Copy the URL to clipboard
-      const { copyToClipboard } = await import("../services/ClipboardService");
       await copyToClipboard(jwtUrl);
       this.notify.toast(
         NOTIFY_QR_URL_COPIED.title,
@@ -637,7 +647,6 @@ export default class ContactQRScanShow extends Vue {
   async onCopyDidToClipboard() {
     //this.onScanDetect([{ rawValue: this.qrValue }]); // good for testing
     try {
-      const { copyToClipboard } = await import("../services/ClipboardService");
       await copyToClipboard(this.activeDid);
       this.notify.info(NOTIFY_QR_DID_COPIED.message, QR_TIMEOUT_LONG);
     } catch (error) {
@@ -738,24 +747,17 @@ export default class ContactQRScanShow extends Vue {
         !contact.registered
       ) {
         setTimeout(() => {
-          this.notify.confirm(
+          this.$notify(
-            "Do you want to register them?",
             {
+              group: "modal",
+              type: "confirm",
+              title: "Register",
+              text: "Do you want to register them?",
               onCancel: async (stopAsking?: boolean) => {
-                if (stopAsking) {
+                await this.handleRegistrationPromptResponse(stopAsking);
-                  await this.$updateSettings({
-                    hideRegisterPromptOnNewContact: stopAsking,
-                  });
-                  this.hideRegisterPromptOnNewContact = stopAsking;
-                }
               },
               onNo: async (stopAsking?: boolean) => {
-                if (stopAsking) {
+                await this.handleRegistrationPromptResponse(stopAsking);
-                  await this.$updateSettings({
-                    hideRegisterPromptOnNewContact: stopAsking,
-                  });
-                  this.hideRegisterPromptOnNewContact = stopAsking;
-                }
               },
               onYes: async () => {
                 await this.register(contact);
@@ -885,6 +887,17 @@ export default class ContactQRScanShow extends Vue {
       videoElement.style.transform = shouldMirror ? "scaleX(-1)" : "none";
     }
   }
+
+  private async handleRegistrationPromptResponse(
+    stopAsking?: boolean,
+  ): Promise<void> {
+    if (stopAsking) {
+      await this.$saveSettings({
+        hideRegisterPromptOnNewContact: stopAsking,
+      });
+      this.hideRegisterPromptOnNewContact = stopAsking;
+    }
+  }
 }
 </script>
 

src/views/DIDView.vue

@@ -71,22 +71,22 @@
                   contactFromDid?.seesMe && contactFromDid.did !== activeDid
                 "
                 class="text-sm uppercase bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white mx-0.5 my-0.5 px-2 py-1.5 rounded-md"
-                title="They can see you"
+                title="They can see your activity"
                 @click="confirmSetVisibility(contactFromDid, false)"
               >
-                <font-awesome icon="eye" class="fa-fw" />
                 <font-awesome icon="arrow-up" class="fa-fw" />
+                <font-awesome icon="eye" class="fa-fw" />
               </button>
               <button
                 v-else-if="
                   !contactFromDid?.seesMe && contactFromDid?.did !== activeDid
                 "
                 class="text-sm uppercase bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white mx-0.5 my-0.5 px-2 py-1.5 rounded-md"
-                title="They cannot see you"
+                title="They cannot see your activity"
                 @click="confirmSetVisibility(contactFromDid, true)"
               >
-                <font-awesome icon="eye-slash" class="fa-fw" />
                 <font-awesome icon="arrow-up" class="fa-fw" />
+                <font-awesome icon="eye-slash" class="fa-fw" />
               </button>
 
               <button
@@ -95,11 +95,11 @@
                   contactFromDid.did !== activeDid
                 "
                 class="text-sm uppercase bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white mx-0.5 my-0.5 px-2 py-1.5 rounded-md"
-                title="I view their content"
+                title="You watch their activity"
                 @click="confirmViewContent(contactFromDid, false)"
               >
-                <font-awesome icon="eye" class="fa-fw" />
                 <font-awesome icon="arrow-down" class="fa-fw" />
+                <font-awesome icon="eye" class="fa-fw" />
               </button>
               <button
                 v-else-if="
@@ -107,11 +107,11 @@
                   contactFromDid?.did !== activeDid
                 "
                 class="text-sm uppercase bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white mx-0.5 my-0.5 px-2 py-1.5 rounded-md"
-                title="I do not view their content"
+                title="You do not watch their activity"
                 @click="confirmViewContent(contactFromDid, true)"
               >
-                <font-awesome icon="eye-slash" class="fa-fw" />
                 <font-awesome icon="arrow-down" class="fa-fw" />
+                <font-awesome icon="eye-slash" class="fa-fw" />
               </button>
 
               <button
@@ -273,6 +273,7 @@ import {
   didInfoForContact,
   displayAmount,
   getHeaders,
+  isDid,
   register,
   setVisibilityUtil,
 } from "../libs/endorserServer";
@@ -289,7 +290,9 @@ import {
   NOTIFY_REGISTRATION_ERROR,
   NOTIFY_SERVER_ACCESS_ERROR,
   NOTIFY_NO_IDENTITY_ERROR,
+  NOTIFY_CONTACT_INVALID_DID,
 } from "@/constants/notifications";
+import { THAT_UNNAMED_PERSON } from "@/constants/entities";
 
 /**
  * DIDView Component
@@ -379,22 +382,29 @@ export default class DIDView extends Vue {
 
   /**
    * Determines which DID to display based on URL parameters
-   * Falls back to active DID if no parameter provided
+   * Validates DID format and shows error for invalid DIDs
    */
   private async determineDIDToDisplay() {
     const pathParam = window.location.pathname.substring("/did/".length);
     let showDid = pathParam;
 
     if (!showDid) {
+      // No DID provided in URL, use active DID
       showDid = this.activeDid;
-      if (showDid) {
+      this.notifyDefaultToActiveDID();
-        this.notifyDefaultToActiveDID();
+    } else {
+      // DID provided in URL, validate it
+      const decodedDid = decodeURIComponent(showDid);
+      if (!isDid(decodedDid)) {
+        // Invalid DID format - show error and redirect
+        this.notify.error(NOTIFY_CONTACT_INVALID_DID.message, TIMEOUTS.LONG);
+        this.$router.push({ name: "home" });
+        return;
       }
+      showDid = decodedDid;
     }
 
-    if (showDid) {
+    this.viewingDid = showDid;
-      this.viewingDid = decodeURIComponent(showDid);
-    }
   }
 
   /**
@@ -551,7 +561,7 @@ export default class DIDView extends Vue {
         contact.registered = true;
         await this.$updateContact(contact.did, { registered: true });
 
-        const name = contact.name || "That unnamed person";
+        const name = contact.name || THAT_UNNAMED_PERSON;
         this.notify.success(
           `${name} ${NOTIFY_REGISTRATION_SUCCESS.message}`,
           TIMEOUTS.LONG,

src/views/DatabaseMigration.vue

@@ -1003,7 +1003,7 @@
       <h2>Exported Data</h2>
       <span
         class="text-blue-500 cursor-pointer hover:text-blue-700"
-        @click="copyToClipboard"
+        @click="copyExportedDataToClipboard"
       >
         Copy to Clipboard
       </span>
@@ -1014,7 +1014,7 @@
 
 <script lang="ts">
 import { Component, Vue } from "vue-facing-decorator";
-import { useClipboard } from "@vueuse/core";
+import { copyToClipboard } from "../services/ClipboardService";
 import { Router } from "vue-router";
 
 import {
@@ -1072,8 +1072,6 @@ export default class DatabaseMigration extends Vue {
   private exportedData: Record<string, any> | null = null;
   private successMessage = "";
 
-  useClipboard = useClipboard;
-
   /**
    * Computed property to get the display name for a setting
    * Handles both live comparison data and exported JSON format
@@ -1133,13 +1131,11 @@ export default class DatabaseMigration extends Vue {
   /**
    * Copies exported data to clipboard and shows success message
    */
-  async copyToClipboard(): Promise<void> {
+  async copyExportedDataToClipboard(): Promise<void> {
     if (!this.exportedData) return;
 
     try {
-      await this.useClipboard().copy(
+      await copyToClipboard(JSON.stringify(this.exportedData, null, 2));
-        JSON.stringify(this.exportedData, null, 2),
-      );
       // Use global window object properly
       if (typeof window !== "undefined") {
         window.alert("Copied to clipboard!");

src/views/DeepLinkErrorView.vue

@@ -1,6 +1,6 @@
 <template>
-  <div class="deep-link-error">
+  <!-- CONTENT -->
-    <div class="safe-area-spacer"></div>
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <h1>Invalid Deep Link</h1>
     <div class="error-details">
       <div class="error-message">
@@ -39,7 +39,7 @@
         </li>
       </ul>
     </div>
-  </div>
+  </section>
 </template>
 
 <script setup lang="ts">
@@ -114,18 +114,6 @@ onMounted(() => {
 </script>
 
 <style scoped>
-.deep-link-error {
-  padding-top: 60px;
-  padding-left: 20px;
-  padding-right: 20px;
-  max-width: 600px;
-  margin: 0 auto;
-}
-
-.safe-area-spacer {
-  height: env(safe-area-inset-top);
-}
-
 h1 {
   color: #ff4444;
   margin-bottom: 24px;

src/views/DeepLinkRedirectView.vue

@@ -1,95 +1,87 @@
 <template>
   <!-- CONTENT -->
-  <section id="Content" class="relative w-[100vw] h-[100vh]">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
-    <div
+    <div class="mb-4">
-      class="p-6 bg-white w-full max-w-[calc((100vh-env(safe-area-inset-top)-env(safe-area-inset-bottom))*0.4)] mx-auto"
+      <h1 class="text-2xl text-center font-semibold relative px-7">
-    >
+        Redirecting to Time Safari
-      <div class="mb-4">
+      </h1>
-        <h1 class="text-xl text-center font-semibold relative mb-4">
-          Redirecting to Time Safari
-        </h1>
 
-        <div v-if="destinationUrl" class="space-y-4">
+      <div v-if="destinationUrl" class="space-y-4">
-          <!-- Platform-specific messaging -->
+        <!-- Platform-specific messaging -->
-          <div class="text-center text-gray-600 mb-4">
+        <div class="text-center text-gray-600 mb-4">
-            <p v-if="isMobile">
+          <p v-if="isMobile">
-              {{
+            {{
-                isIOS
+              isIOS
-                  ? "Opening Time Safari app on your iPhone..."
+                ? "Opening Time Safari app on your iPhone..."
-                  : "Opening Time Safari app on your Android device..."
+                : "Opening Time Safari app on your Android device..."
-              }}
+            }}
-            </p>
+          </p>
-            <p v-else>Opening Time Safari app...</p>
+          <p v-else>Opening Time Safari app...</p>
-            <p class="text-sm mt-2">
+          <p class="text-sm mt-2">
-              <span v-if="isMobile"
+            <span v-if="isMobile"
-                >If the app doesn't open automatically, use one of these
+              >If the app doesn't open automatically, use one of these
-                options:</span
+              options:</span
-              >
-              <span v-else>Choose how you'd like to open this link:</span>
-            </p>
-          </div>
-
-          <!-- Deep Link Button -->
-          <div class="text-center">
-            <a
-              :href="deepLinkUrl || '#'"
-              class="inline-block bg-blue-600 text-white px-6 py-3 rounded-lg font-medium hover:bg-blue-700 transition-colors"
-              @click="handleDeepLinkClick"
             >
-              <span v-if="isMobile">Open in Time Safari App</span>
+            <span v-else>Choose how you'd like to open this link:</span>
-              <span v-else>Try Opening in Time Safari App</span>
+          </p>
-            </a>
+        </div>
-          </div>
 
-          <!-- Web Fallback Link -->
+        <!-- Deep Link Button -->
-          <div class="text-center">
+        <div class="text-center">
-            <a
+          <a
-              :href="webUrl || '#'"
+            :href="deepLinkUrl || '#'"
-              target="_blank"
+            class="inline-block bg-blue-600 text-white px-6 py-3 rounded-lg font-medium hover:bg-blue-700 transition-colors"
-              class="inline-block bg-gray-600 text-white px-6 py-3 rounded-lg font-medium hover:bg-gray-700 transition-colors"
+            @click="handleDeepLinkClick"
-              @click="handleWebFallbackClick"
-            >
-              <span v-if="isMobile">Open in Web Browser Instead</span>
-              <span v-else>Open in Web Browser</span>
-            </a>
-          </div>
-
-          <!-- Manual Instructions -->
-          <div class="text-center text-sm text-gray-500 mt-4">
-            <p v-if="isMobile">
-              Or manually open:
-              <code class="bg-gray-100 px-2 py-1 rounded">{{
-                deepLinkUrl
-              }}</code>
-            </p>
-            <p v-else>
-              If you have the Time Safari app installed, you can also copy this
-              link:
-              <code class="bg-gray-100 px-2 py-1 rounded">{{
-                deepLinkUrl
-              }}</code>
-            </p>
-          </div>
-
-          <!-- Platform info for debugging -->
-          <div
-            v-if="isDevelopment"
-            class="text-center text-xs text-gray-400 mt-4"
           >
-            <p>
+            <span v-if="isMobile">Open in Time Safari App</span>
-              Platform: {{ isMobile ? (isIOS ? "iOS" : "Android") : "Desktop" }}
+            <span v-else>Try Opening in Time Safari App</span>
-            </p>
+          </a>
-            <p>User Agent: {{ userAgent.substring(0, 50) }}...</p>
-          </div>
         </div>
 
-        <div v-else-if="pageError" class="text-center text-red-500 mb-4">
+        <!-- Web Fallback Link -->
-          {{ pageError }}
+        <div class="text-center">
+          <a
+            :href="webUrl || '#'"
+            target="_blank"
+            class="inline-block bg-gray-600 text-white px-6 py-3 rounded-lg font-medium hover:bg-gray-700 transition-colors"
+            @click="handleWebFallbackClick"
+          >
+            <span v-if="isMobile">Open in Web Browser Instead</span>
+            <span v-else>Open in Web Browser</span>
+          </a>
         </div>
 
-        <div v-else class="text-center text-gray-600">
+        <!-- Manual Instructions -->
-          <p>Processing redirect...</p>
+        <div class="text-center text-sm text-gray-500 mt-4">
+          <p v-if="isMobile">
+            Or manually open:
+            <code class="bg-gray-100 px-2 py-1 rounded">{{ deepLinkUrl }}</code>
+          </p>
+          <p v-else>
+            If you have the Time Safari app installed, you can also copy this
+            link:
+            <code class="bg-gray-100 px-2 py-1 rounded">{{ deepLinkUrl }}</code>
+          </p>
         </div>
+
+        <!-- Platform info for debugging -->
+        <div
+          v-if="isDevelopment"
+          class="text-center text-xs text-gray-400 mt-4"
+        >
+          <p>
+            Platform: {{ isMobile ? (isIOS ? "iOS" : "Android") : "Desktop" }}
+          </p>
+          <p>User Agent: {{ userAgent.substring(0, 50) }}...</p>
+        </div>
+      </div>
+
+      <div v-else-if="pageError" class="text-center text-red-500 mb-4">
+        {{ pageError }}
+      </div>
+
+      <div v-else class="text-center text-gray-600">
+        <p>Processing redirect...</p>
       </div>
     </div>
   </section>

src/views/DiscoverView.vue

@@ -233,7 +233,7 @@
 
               <div class="grow">
                 <h2 class="text-base font-semibold">
-                  {{ project.name || "Unnamed Project" }}
+                  {{ project.name || unnamedProject }}
                 </h2>
                 <div class="text-sm">
                   <font-awesome
@@ -340,6 +340,7 @@ import {
   NOTIFY_DISCOVER_LOCAL_SEARCH_ERROR,
   NOTIFY_DISCOVER_MAP_SEARCH_ERROR,
 } from "@/constants/notifications";
+import { UNNAMED_PROJECT } from "@/constants/entities";
 interface Tile {
   indexLat: number;
   indexLon: number;
@@ -370,6 +371,13 @@ export default class DiscoverView extends Vue {
 
   notify!: ReturnType<typeof createNotifyHelpers>;
 
+  /**
+   * Get the unnamed project constant
+   */
+  get unnamedProject(): string {
+    return UNNAMED_PROJECT;
+  }
+
   activeDid = "";
   allContacts: Array<Contact> = [];
   allMyDids: Array<string> = [];

src/views/GiftedDetailsView.vue

@@ -280,6 +280,7 @@ import { logger } from "../utils/logger";
 import { Contact } from "@/db/tables/contacts";
 import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
 import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
+import { showSeedPhraseReminder } from "@/utils/seedPhraseReminder";
 import {
   NOTIFY_GIFTED_DETAILS_RETRIEVAL_ERROR,
   NOTIFY_GIFTED_DETAILS_DELETE_IMAGE_CONFIRM,
@@ -770,6 +771,15 @@ export default class GiftedDetails extends Vue {
           NOTIFY_GIFTED_DETAILS_GIFT_RECORDED.message,
           TIMEOUTS.SHORT,
         );
+
+        // Show seed phrase backup reminder if needed
+        try {
+          const settings = await this.$accountSettings();
+          showSeedPhraseReminder(!!settings.hasBackedUpSeed, this.$notify);
+        } catch (error) {
+          logger.error("Error checking seed backup status:", error);
+        }
+
         localStorage.removeItem("imageUrl");
         if (this.destinationPathAfter) {
           (this.$router as Router).push({ path: this.destinationPathAfter });

src/views/HelpView.vue

@@ -200,7 +200,7 @@
       </p>
       <p>
         Then you can record your appreciation for... whatever: select any contact on the home page
-        (or "Unnamed") and send it. The main goal is to record what people
+        (or "{{ unnamedEntityName }}") and send it. The main goal is to record what people
         have given you, to grow giving economies. You can also record your own
         ideas for projects. Each claim is recorded on a
         custom ledger.
@@ -319,8 +319,9 @@
         <ul class="list-disc list-outside ml-4">
           <li>
             Go to Your Identity <font-awesome icon="circle-user" class="fa-fw" /> page,
-            click Advanced, and follow the instructions for the Contacts & Settings Database "Import".
+            click Advanced, and follow the instructions to "Import Contacts".
-            Beware that this will erase your existing contact & settings.
+            (There is currently no way to import other settings, so you'll have to recreate
+            by hand your search area, filters, etc.)
           </li>
         </ul>
       </div>
@@ -336,14 +337,18 @@
 
       <h2 class="text-xl font-semibold">How do I erase my data from my device?</h2>
       <p>
-        Before doing this, you may want to back up your data with the instructions above.
+        Before doing this, you should back up your data with the instructions above.
+        Note that this does not erase data sent to our servers (see contact info below)
       </p>
       <ul>
         <li class="list-disc list-outside ml-4">
           Mobile
           <ul>
             <li class="list-disc list-outside ml-4">
-              Home Screen: hold down on the icon, and choose to delete it
+              App Store app: hold down on the icon, then uninstall it
+            </li>
+            <li class="list-disc list-outside ml-4">
+              Home Screen PWA: hold down on the icon, and delete it
             </li>
             <li class="list-disc list-outside ml-4">
               Chrome: Settings -> Privacy and Security -> Clear Browsing Data
@@ -415,15 +420,6 @@
         different page.
       </p>
 
-      <h2 class="text-xl font-semibold">
-        Where do I get help with notifications?
-      </h2>
-      <p>
-        <router-link class="text-blue-500" to="/help-notifications"
-        >Here.</router-link
-        >
-      </p>
-
       <h2 class="text-xl font-semibold">
         This app is misbehaving, like showing me a blank screen or failing to show my personal data.
         What can I do?
@@ -434,10 +430,13 @@
       </p>
       <ul class="list-disc list-outside ml-4">
         <li>
-          Drag down on the screen to refresh it; do that multiple times, because
+          For mobile apps, make sure you're connected to the internet.
+        </li>
+        <li>
+          For PWAs, drag down on the screen to refresh it; do that multiple times, because
           it sometimes takes multiple tries for the app to refresh to the latest version.
           You can see the version information at the bottom of this page; the best
-          way to determine the latest version is to open this page in an incognito/private
+          way to determine the latest version is to open TimeSafari.app in an incognito/private
           browser window and look at the version there.
         </li>
         <li>
@@ -468,9 +467,6 @@
           </ul>
           Then reload Time Safari.
         </li>
-        <li>
-          Restart your device.
-        </li>
       </ul>
       <p>
         If you still have problems, you can clear the cache (see "erase my data" above)
@@ -508,16 +504,12 @@
       </p>
       <ul class="list-disc list-outside ml-4">
         <li>
-          If using notifications, a server stores push token data. That can be revoked at any time
+          If sending images, a server stores them. They can be removed by editing each claim
-          by disabling notifications on the Profile <font-awesome icon="circle-user" class="fa-fw" /> page.
+          and deleting the image.
-        </li>
-        <li>
-          If sending images, a server stores them, too. They can be removed by editing the claim
-          and deleting them.
         </li>
         <li>
           If sending other partner system data (eg. to Trustroots) a public key and message
-          data are stored on a server. Those can be removed via direct personal request.
+          data are stored on a server. Those can be removed via direct personal request (via contact below).
         </li>
         <li>
           For all other claim data,
@@ -592,14 +584,16 @@
 <script lang="ts">
 import { Component, Vue } from "vue-facing-decorator";
 import { Router } from "vue-router";
-import { useClipboard } from "@vueuse/core";
+import { copyToClipboard } from "../services/ClipboardService";
 // Capacitor import removed - using QRNavigationService instead
 
 import * as Package from "../../package.json";
 import QuickNav from "../components/QuickNav.vue";
-import { APP_SERVER } from "../constants/app";
+import { APP_SERVER, NotificationIface } from "../constants/app";
 import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
 import { QRNavigationService } from "@/services/QRNavigationService";
+import { UNNAMED_ENTITY_NAME } from "@/constants/entities";
+import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
 
 /**
  * HelpView.vue - Comprehensive Help System Component
@@ -633,8 +627,10 @@ import { QRNavigationService } from "@/services/QRNavigationService";
 })
 export default class HelpView extends Vue {
   $router!: Router;
+  $notify!: (notification: NotificationIface, timeout?: number) => void;
 
   package = Package;
+  notify!: ReturnType<typeof createNotifyHelpers>;
   commitHash = import.meta.env.VITE_GIT_HASH;
   showAlpha = false;
   showBasics = false;
@@ -647,6 +643,20 @@ export default class HelpView extends Vue {
   APP_SERVER = APP_SERVER;
   // Capacitor reference removed - using QRNavigationService instead
 
+  /**
+   * Initialize notification helpers
+   */
+  created() {
+    this.notify = createNotifyHelpers(this.$notify);
+  }
+
+  /**
+   * Get the unnamed entity name constant
+   */
+  get unnamedEntityName(): string {
+    return UNNAMED_ENTITY_NAME;
+  }
+
   // Ideally, we put no functionality in here, especially in the setup,
   // because we never want this page to have a chance of throwing an error.
 
@@ -660,11 +670,15 @@ export default class HelpView extends Vue {
    * @param {string} text - The text to copy to clipboard
    * @param {Function} fn - Callback function to execute before and after copying
    */
-  doCopyTwoSecRedo(text: string, fn: () => void): void {
+  async doCopyTwoSecRedo(text: string, fn: () => void): Promise<void> {
     fn();
-    useClipboard()
+    try {
-      .copy(text)
+      await copyToClipboard(text);
-      .then(() => setTimeout(fn, 2000));
+      setTimeout(fn, 2000);
+    } catch (error) {
+      this.$logAndConsole(`Error copying to clipboard: ${error}`, true);
+      this.notify.error("Failed to copy to clipboard.", TIMEOUTS.SHORT);
+    }
   }
 
   /**

src/views/HomeView.vue

@@ -282,6 +282,7 @@ import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
 import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
 import { NOTIFY_CONTACT_LOADING_ISSUE } from "@/constants/notifications";
 import * as Package from "../../package.json";
+import { UNNAMED_ENTITY_NAME } from "@/constants/entities";
 
 // consolidate this with GiveActionClaim in src/interfaces/claims.ts
 interface Claim {
@@ -567,10 +568,27 @@ export default class HomeView extends Vue {
             this.isRegistered = true;
           }
         } catch (error) {
+          // Enhanced error logging with server context
+          const errorMessage =
+            error instanceof Error ? error.message : String(error);
+          const axiosError = error as {
+            response?: {
+              data?: { error?: { code?: string; message?: string } };
+              status?: number;
+            };
+          };
+
           logger.warn(
             "[HomeView Settings Trace] ⚠️ Registration check failed",
             {
-              error: error instanceof Error ? error.message : String(error),
+              error: errorMessage,
+              did: this.activeDid,
+              server: this.apiServer,
+              errorCode: axiosError?.response?.data?.error?.code,
+              errorMessage: axiosError?.response?.data?.error?.message,
+              httpStatus: axiosError?.response?.status,
+              needsUserMigration: true,
+              timestamp: new Date().toISOString(),
             },
           );
         }
@@ -584,8 +602,7 @@ export default class HomeView extends Vue {
   }
 
   /**
-   * Ensures API server is correctly set for the current platform
+   * Ensures correct API server configuration
-   * For Electron, always use production endpoint regardless of saved settings
    *
    * @internal
    * Called after loading settings to ensure correct API endpoint
@@ -593,12 +610,9 @@ export default class HomeView extends Vue {
   private async ensureCorrectApiServer() {
     const { DEFAULT_ENDORSER_API_SERVER } = await import("../constants/app");
 
-    if (process.env.VITE_PLATFORM === "electron") {
+    // Only set default if no user preference exists
-      // **CRITICAL FIX**: Always use production API server for Electron
+    if (!this.apiServer) {
-      // This prevents the capacitor-electron:// protocol from being used for API calls
+      // Set default API server for any platform if not already set
-      this.apiServer = DEFAULT_ENDORSER_API_SERVER;
-    } else if (!this.apiServer) {
-      // **FIX**: Set default API server for web/development if not already set
       this.apiServer = DEFAULT_ENDORSER_API_SERVER;
     }
   }
@@ -1160,9 +1174,13 @@ export default class HomeView extends Vue {
         location: fulfillsPlan
           ? { lat: fulfillsPlan.locLat, lon: fulfillsPlan.locLon }
           : null,
-        inSearchBox: fulfillsPlan
+        inSearchBox:
-          ? this.latLongInAnySearchBox(fulfillsPlan.locLat, fulfillsPlan.locLon)
+          fulfillsPlan?.locLat && fulfillsPlan?.locLon
-          : null,
+            ? this.latLongInAnySearchBox(
+                fulfillsPlan.locLat,
+                fulfillsPlan.locLon,
+              )
+            : null,
         finalResult: anyMatch,
       });
     }
@@ -1546,30 +1564,41 @@ export default class HomeView extends Vue {
    * @param giver Optional contact info for giver
    * @param description Optional gift description
    */
-  openDialog(giver?: GiverReceiverInputInfo | "Unnamed", prompt?: string) {
+  openDialog(giver?: GiverReceiverInputInfo, prompt?: string) {
-    if (giver === "Unnamed") {
+    // Determine the giver entity based on DID logic
-      // Special case: Pass undefined to trigger Step 1, but with "Unnamed" pre-selected
+    const giverEntity = this.createGiverEntity(giver);
-      (this.$refs.giftedDialog as GiftedDialog).open(
+
-        undefined,
+    (this.$refs.giftedDialog as GiftedDialog).open(
-        {
+      giverEntity,
-          did: this.activeDid,
+      {
-          name: "You",
+        did: this.activeDid,
-        } as GiverReceiverInputInfo,
+        name: "You", // In HomeView, we always use "You" as the giver
-        undefined,
+      } as GiverReceiverInputInfo,
-        prompt,
+      undefined,
-      );
+      prompt,
-      // Immediately select "Unnamed" and move to Step 2
+    );
-      (this.$refs.giftedDialog as GiftedDialog).selectGiver();
+  }
+
+  /**
+   * Creates giver entity using DID-based logic
+   */
+  private createGiverEntity(
+    giver?: GiverReceiverInputInfo,
+  ): GiverReceiverInputInfo | undefined {
+    if (!giver) {
+      return undefined;
+    }
+
+    // Handle GiverReceiverInputInfo object
+    if (giver.did === this.activeDid) {
+      // If DID matches active DID, create "You" entity
+      return { did: this.activeDid, name: "You" };
+    } else if (!giver.did || giver.did === "") {
+      // If DID is empty/null, create "Unnamed" entity
+      return { did: "", name: UNNAMED_ENTITY_NAME };
     } else {
-      (this.$refs.giftedDialog as GiftedDialog).open(
+      // Return the giver as-is
-        giver,
+      return giver;
-        {
-          did: this.activeDid,
-          name: "You",
-        } as GiverReceiverInputInfo,
-        undefined,
-        prompt,
-      );
     }
   }
 
@@ -1632,10 +1661,15 @@ export default class HomeView extends Vue {
     this.isImageViewerOpen = true;
   }
 
-  openPersonDialog(
+  private handleQRCodeClick() {
-    giver?: GiverReceiverInputInfo | "Unnamed",
+    if (Capacitor.isNativePlatform()) {
-    prompt?: string,
+      this.$router.push({ name: "contact-qr-scan-full" });
-  ) {
+    } else {
+      this.$router.push({ name: "contact-qr" });
+    }
+  }
+
+  openPersonDialog(giver?: GiverReceiverInputInfo, prompt?: string) {
     this.showProjectsDialog = false;
     this.openDialog(giver, prompt);
   }

src/views/IdentitySwitcherView.vue

@@ -229,7 +229,7 @@ export default class IdentitySwitcherView extends Vue {
     if (did) {
       try {
         const newSettings = await this.$accountSettings(did);
-        logger.info(
+        logger.debug(
           "[IdentitySwitcher Settings Trace] ✅ New account settings loaded",
           {
             did,
@@ -252,7 +252,7 @@ export default class IdentitySwitcherView extends Vue {
       }
     }
 
-    logger.info(
+    logger.debug(
       "[IdentitySwitcher Settings Trace] 🔄 Navigating to home to trigger watcher",
       {
         newDid: did,

src/views/ImportAccountView.vue

@@ -88,9 +88,15 @@ import { Router } from "vue-router";
 
 import { AppString, NotificationIface } from "../constants/app";
 import { DEFAULT_ROOT_DERIVATION_PATH } from "../libs/crypto";
-import { retrieveAccountCount, importFromMnemonic } from "../libs/util";
+import {
+  retrieveAccountCount,
+  importFromMnemonic,
+  checkForDuplicateAccount,
+  DUPLICATE_ACCOUNT_ERROR,
+} from "../libs/util";
 import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
 import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
+import { NOTIFY_DUPLICATE_ACCOUNT_IMPORT } from "@/constants/notifications";
 
 /**
  * Import Account View Component
@@ -198,6 +204,19 @@ export default class ImportAccountView extends Vue {
     }
 
     try {
+      // Check for duplicate account before importing
+      const isDuplicate = await checkForDuplicateAccount(
+        this.mnemonic,
+        this.derivationPath,
+      );
+      if (isDuplicate) {
+        this.notify.warning(
+          NOTIFY_DUPLICATE_ACCOUNT_IMPORT.message,
+          TIMEOUTS.LONG,
+        );
+        return;
+      }
+
       await importFromMnemonic(
         this.mnemonic,
         this.derivationPath,
@@ -223,9 +242,20 @@ export default class ImportAccountView extends Vue {
       this.$router.push({ name: "account" });
     } catch (error: unknown) {
       this.$logError("Import failed: " + error);
+
+      // Check if this is a duplicate account error from saveNewIdentity
+      const errorMessage =
+        error instanceof Error ? error.message : String(error);
+      if (errorMessage.includes(DUPLICATE_ACCOUNT_ERROR)) {
+        this.notify.warning(
+          NOTIFY_DUPLICATE_ACCOUNT_IMPORT.message,
+          TIMEOUTS.LONG,
+        );
+        return;
+      }
+
       this.notify.error(
-        (error instanceof Error ? error.message : String(error)) ||
+        errorMessage || "Failed to import account.",
-          "Failed to import account.",
         TIMEOUTS.LONG,
       );
     }

src/views/ImportDerivedAccountView.vue

@@ -83,6 +83,7 @@ import {
   retrieveAllAccountsMetadata,
   retrieveFullyDecryptedAccount,
   saveNewIdentity,
+  checkForDuplicateAccount,
 } from "../libs/util";
 import { logger } from "../utils/logger";
 import { Account, AccountEncrypted } from "../db/tables/accounts";
@@ -171,6 +172,16 @@ export default class ImportAccountView extends Vue {
     const newId = newIdentifier(address, publicHex, privateHex, newDerivPath);
 
     try {
+      // Check for duplicate account before creating
+      const isDuplicate = await checkForDuplicateAccount(newId.did);
+      if (isDuplicate) {
+        this.notify.warning(
+          "This derived account already exists. Please try a different derivation path.",
+          TIMEOUTS.LONG,
+        );
+        return;
+      }
+
       await saveNewIdentity(newId, mne, newDerivPath);
 
       // record that as the active DID

src/views/InviteOneView.vue

@@ -128,7 +128,7 @@
 <script lang="ts">
 import axios from "axios";
 import { Component, Vue } from "vue-facing-decorator";
-import { useClipboard } from "@vueuse/core";
+import { copyToClipboard } from "../services/ClipboardService";
 import { Router } from "vue-router";
 
 import ContactNameDialog from "../components/ContactNameDialog.vue";
@@ -333,17 +333,27 @@ export default class InviteOneView extends Vue {
     return `${APP_SERVER}/deep-link/invite-one-accept/${jwt}`;
   }
 
-  copyInviteAndNotify(inviteId: string, jwt: string) {
+  async copyInviteAndNotify(inviteId: string, jwt: string) {
-    useClipboard().copy(this.inviteLink(jwt));
+    try {
-    this.notify.success(createInviteLinkCopyMessage(inviteId), TIMEOUTS.LONG);
+      await copyToClipboard(this.inviteLink(jwt));
+      this.notify.success(createInviteLinkCopyMessage(inviteId), TIMEOUTS.LONG);
+    } catch (error) {
+      this.$logAndConsole(`Error copying invite link: ${error}`, true);
+      this.notify.error("Failed to copy invite link.");
+    }
   }
 
-  showInvite(inviteId: string, redeemed: boolean, expired: boolean) {
+  async showInvite(inviteId: string, redeemed: boolean, expired: boolean) {
-    useClipboard().copy(inviteId);
+    try {
-    this.notify.success(
+      await copyToClipboard(inviteId);
-      createInviteIdCopyMessage(inviteId, redeemed, expired),
+      this.notify.success(
-      TIMEOUTS.LONG,
+        createInviteIdCopyMessage(inviteId, redeemed, expired),
-    );
+        TIMEOUTS.LONG,
+      );
+    } catch (error) {
+      this.$logAndConsole(`Error copying invite ID: ${error}`, true);
+      this.notify.error("Failed to copy invite ID.");
+    }
   }
 
   // eslint-disable-next-line @typescript-eslint/no-explicit-any

src/views/NewEditAccountView.vue

@@ -110,10 +110,22 @@ export default class NewEditAccountView extends Vue {
    * @async
    */
   async onClickSaveChanges() {
-    await this.$updateSettings({
+    // Get the current active DID to save to user-specific settings
-      firstName: this.givenName,
+    const settings = await this.$accountSettings();
-      lastName: "", // deprecated, pre v 0.1.3
+    const activeDid = settings.activeDid;
-    });
+
+    if (activeDid) {
+      // Save to user-specific settings for the current identity
+      await this.$saveUserSettings(activeDid, {
+        firstName: this.givenName,
+      });
+    } else {
+      // Fallback to master settings if no active DID
+      await this.$saveSettings({
+        firstName: this.givenName,
+      });
+    }
+
     this.$router.back();
   }
 

src/views/OnboardMeetingSetupView.vue

@@ -270,7 +270,7 @@
 
 <script lang="ts">
 import { Component, Vue } from "vue-facing-decorator";
-import { useClipboard } from "@vueuse/core";
+import { copyToClipboard } from "../services/ClipboardService";
 import { RouteLocationNormalizedLoaded, Router } from "vue-router";
 
 import QuickNav from "../components/QuickNav.vue";
@@ -676,12 +676,17 @@ export default class OnboardMeetingView extends Vue {
     this.notify.error(message, TIMEOUTS.LONG);
   }
 
-  copyMembersLinkToClipboard() {
+  async copyMembersLinkToClipboard() {
-    useClipboard()
+    try {
-      .copy(this.onboardMeetingMembersLink())
+      await copyToClipboard(this.onboardMeetingMembersLink());
-      .then(() => {
+      this.notify.info(NOTIFY_MEETING_LINK_COPIED.message, TIMEOUTS.LONG);
-        this.notify.info(NOTIFY_MEETING_LINK_COPIED.message, TIMEOUTS.LONG);
+    } catch (error) {
-      });
+      this.$logAndConsole(
+        `Error copying meeting link to clipboard: ${error}`,
+        true,
+      );
+      this.notify.error("Failed to copy meeting link to clipboard.");
+    }
   }
 }
 </script>

src/views/ProjectViewView.vue

@@ -183,7 +183,7 @@
                 class="text-blue-500"
                 @click="onClickLoadProject(plan.handleId)"
               >
-                {{ plan.name || "Unnamed Project" }}
+                {{ plan.name || unnamedProject }}
               </button>
             </div>
             <div v-if="fulfillersToHitLimit" class="text-center">
@@ -207,7 +207,7 @@
               class="text-blue-500"
               @click="onClickLoadProject(fulfilledByThis.handleId)"
             >
-              {{ fulfilledByThis.name || "Unnamed Project" }}
+              {{ fulfilledByThis.name || unnamedProject }}
             </button>
           </div>
         </div>
@@ -226,7 +226,7 @@
     <div class="grid items-start grid-cols-1 sm:grid-cols-3 gap-4 mt-4">
       <!-- First, offers on the left-->
       <div class="bg-slate-100 px-4 py-3 rounded-md">
-        <div v-if="activeDid && isRegistered">
+        <div v-if="activeDid && isRegistered" class="mb-4">
           <div class="text-center">
             <button
               data-testId="offerButton"
@@ -243,13 +243,19 @@
           :project-name="name"
         />
 
-        <h3 class="text-lg font-bold mb-3 mt-4">Offered To This Idea</h3>
+        <h3 class="text-lg font-bold leading-tight mb-3">
+          Offered To This Idea
+        </h3>
 
-        <div v-if="offersToThis.length === 0">
+        <div v-if="offersToThis.length === 0" class="text-sm">
-          (None yet. Wanna
+          (None yet.<span v-if="activeDid && isRegistered">
-          <span class="cursor-pointer text-blue-500" @click="openOfferDialog()"
+            Wanna
-            >offer something... especially if others join you</span
+            <span
-          >?)
+              class="cursor-pointer text-blue-500"
+              @click="openOfferDialog()"
+              >offer something&hellip; especially if others join you</span
+            >?</span
+          >)
         </div>
 
         <ul v-else class="text-sm border-t border-slate-300">
@@ -314,7 +320,7 @@
       <!-- Now, gives TO this project in the middle -->
       <!-- (similar to "FROM" gift display below) -->
       <div class="bg-slate-100 px-4 py-3 rounded-md" data-testId="gives-to">
-        <div v-if="activeDid && isRegistered">
+        <div v-if="activeDid && isRegistered" class="mb-4">
           <div class="text-center">
             <button
               class="block w-full bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-3 py-1.5 text-sm leading-tight rounded-md"
@@ -325,7 +331,9 @@
           </div>
         </div>
 
-        <h3 class="text-lg font-bold mt-4">Given To This Project</h3>
+        <h3 class="text-lg font-bold leading-tight mb-3">
+          Given To This Project
+        </h3>
 
         <div v-if="givesToThis.length === 0" class="text-sm">
           (None yet. If you've seen something, say something by clicking a
@@ -476,7 +484,7 @@
       <!-- Finally, gives FROM this project on the right -->
       <!-- (similar to "TO" gift display above) -->
       <div class="bg-slate-100 px-4 py-3 rounded-md" data-testId="gives-from">
-        <div v-if="activeDid && isRegistered">
+        <div v-if="activeDid && isRegistered" class="mb-4">
           <div class="text-center">
             <button
               class="block w-full bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-3 py-1.5 text-sm leading-tight rounded-md"
@@ -494,11 +502,13 @@
           :is-from-project-view="true"
         />
 
-        <h3 class="text-lg font-bold mb-3 mt-4">
+        <h3 class="text-lg font-bold leading-tight mb-3">
           Benefitted From This Project
         </h3>
 
-        <div v-if="givesProvidedByThis.length === 0">(None yet.)</div>
+        <div v-if="givesProvidedByThis.length === 0" class="text-sm">
+          (None yet.)
+        </div>
 
         <ul v-else class="text-sm border-t border-slate-300">
           <li
@@ -606,11 +616,12 @@ import * as serverUtil from "../libs/endorserServer";
 import { retrieveAccountDids } from "../libs/util";
 import HiddenDidDialog from "../components/HiddenDidDialog.vue";
 import { logger } from "../utils/logger";
-import { useClipboard } from "@vueuse/core";
+import { copyToClipboard } from "../services/ClipboardService";
 import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
 import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
 import { NOTIFY_CONFIRM_CLAIM } from "@/constants/notifications";
 import { APP_SERVER } from "@/constants/app";
+import { UNNAMED_PROJECT } from "@/constants/entities";
 /**
  * Project View Component
  * @author Matthew Raymer
@@ -664,6 +675,13 @@ export default class ProjectViewView extends Vue {
   /** Notification helpers instance */
   notify!: ReturnType<typeof createNotifyHelpers>;
 
+  /**
+   * Get the unnamed project constant
+   */
+  get unnamedProject(): string {
+    return UNNAMED_PROJECT;
+  }
+
   // Account and Settings State
   /** Currently active DID */
   activeDid = "";
@@ -799,7 +817,7 @@ export default class ProjectViewView extends Vue {
     });
   }
 
-  onCopyLinkClick() {
+  async onCopyLinkClick() {
     const shortestProjectId = this.projectId.startsWith(
       serverUtil.ENDORSER_CH_HANDLE_PREFIX,
     )
@@ -807,11 +825,13 @@ export default class ProjectViewView extends Vue {
       : this.projectId;
     // Use production URL for sharing to avoid localhost issues in development
     const deepLink = `${APP_SERVER}/deep-link/project/${shortestProjectId}`;
-    useClipboard()
+    try {
-      .copy(deepLink)
+      await copyToClipboard(deepLink);
-      .then(() => {
+      this.notify.copied("link to this project", TIMEOUTS.SHORT);
-        this.notify.copied("link to this project", TIMEOUTS.SHORT);
+    } catch (error) {
-      });
+      this.$logAndConsole(`Error copying project link: ${error}`, true);
+      this.notify.error("Failed to copy project link.");
+    }
   }
 
   // Isn't there a better way to make this available to the template?

src/views/ProjectsView.vue

@@ -244,7 +244,7 @@
 
             <div class="grow overflow-hidden">
               <h2 class="text-base font-semibold">
-                {{ project.name || "Unnamed Project" }}
+                {{ project.name || unnamedProject }}
               </h2>
               <div class="text-sm truncate">
                 {{ project.description }}
@@ -286,6 +286,7 @@ import {
   NOTIFY_OFFERS_LOAD_ERROR,
   NOTIFY_OFFERS_FETCH_ERROR,
 } from "@/constants/notifications";
+import { UNNAMED_PROJECT } from "@/constants/entities";
 
 /**
  * Projects View Component
@@ -324,6 +325,13 @@ export default class ProjectsView extends Vue {
 
   notify!: ReturnType<typeof createNotifyHelpers>;
 
+  /**
+   * Get the unnamed project constant
+   */
+  get unnamedProject(): string {
+    return UNNAMED_PROJECT;
+  }
+
   // User account state
   activeDid = "";
   allContacts: Array<Contact> = [];

src/views/QuickActionBvcEndView.vue

@@ -69,10 +69,17 @@
     <div v-if="claimCountWithHidden > 0" class="border-b border-slate-300 pb-2">
       <span>
         {{ claimCountWithHiddenText }}
-        so if you expected but do not see details from someone then ask them to
+        If you don't see expected info above for someone, ask them to check that
-        check that their activity is visible to you on their Contacts
+        their activity is visible to you (
-        <font-awesome icon="users" class="text-slate-500" />
+        <font-awesome icon="arrow-up" class="fa-fw" />
-        page.
+        <font-awesome icon="eye" class="fa-fw" />
+        ) on
+        <a
+          class="text-blue-500 underline cursor-pointer"
+          @click="copyContactsLinkToClipboard"
+        >
+          this page </a
+        >.
       </span>
     </div>
     <div v-if="claimCountByUser > 0" class="border-b border-slate-300 pb-2">
@@ -120,10 +127,11 @@ import { DateTime } from "luxon";
 import * as R from "ramda";
 import { Component, Vue } from "vue-facing-decorator";
 import { Router } from "vue-router";
+import { copyToClipboard } from "../services/ClipboardService";
 
 import QuickNav from "../components/QuickNav.vue";
 import TopMessage from "../components/TopMessage.vue";
-import { NotificationIface } from "../constants/app";
+import { NotificationIface, APP_SERVER } from "../constants/app";
 import { Contact } from "../db/tables/contacts";
 import {
   GenericCredWrapper,
@@ -148,6 +156,7 @@ import {
   NOTIFY_ALL_CONFIRMATIONS_ERROR,
   NOTIFY_GIVE_SEND_ERROR,
   NOTIFY_CLAIMS_SEND_ERROR,
+  NOTIFY_COPIED_TO_CLIPBOARD,
   createConfirmationSuccessMessage,
   createCombinedSuccessMessage,
 } from "@/constants/notifications";
@@ -195,8 +204,8 @@ export default class QuickActionBvcEndView extends Vue {
   get claimCountWithHiddenText() {
     if (this.claimCountWithHidden === 0) return "";
     return this.claimCountWithHidden === 1
-      ? "There is 1 other claim with hidden details,"
+      ? "There is 1 other claim with hidden details."
-      : `There are ${this.claimCountWithHidden} other claims with hidden details,`;
+      : `There are ${this.claimCountWithHidden} other claims with hidden details.`;
   }
 
   get claimCountByUserText() {
@@ -239,7 +248,8 @@ export default class QuickActionBvcEndView extends Vue {
     }
     const eventStartDateObj = currentOrPreviousSat
       .set({ weekday: 6 })
-      .set({ hour: 9 })
+      .set({ hour: 8 })
+      .set({ minute: 30 }) // to catch if people put their claims 30 minutes early
       .startOf("hour");
 
     // Hack, but full ISO pushes the length to 340 which crashes verifyJWT!
@@ -295,6 +305,23 @@ export default class QuickActionBvcEndView extends Vue {
     (this.$router as Router).push(route);
   }
 
+  async copyContactsLinkToClipboard() {
+    const deepLinkUrl = `${APP_SERVER}/deep-link/did/${this.activeDid}`;
+    try {
+      await copyToClipboard(deepLinkUrl);
+      this.notify.success(
+        NOTIFY_COPIED_TO_CLIPBOARD.message("Your info link"),
+        TIMEOUTS.SHORT,
+      );
+    } catch (error) {
+      logger.error("Failed to copy to clipboard:", error);
+      this.notify.error(
+        "Failed to copy link to clipboard. Please try again.",
+        TIMEOUTS.SHORT,
+      );
+    }
+  }
+
   async record() {
     try {
       if (this.claimsToConfirmSelected.length > 0) {

src/views/SeedBackupView.vue

@@ -106,7 +106,7 @@
 
 <script lang="ts">
 import { Component, Vue } from "vue-facing-decorator";
-import { useClipboard } from "@vueuse/core";
+import { copyToClipboard } from "../services/ClipboardService";
 
 import QuickNav from "../components/QuickNav.vue";
 import { NotificationIface } from "../constants/app";
@@ -231,9 +231,24 @@ export default class SeedBackupView extends Vue {
   /**
    * Reveals the seed phrase to the user
    * Sets showSeed to true to display the sensitive seed phrase data
+   * Updates the hasBackedUpSeed setting to true to track that user has backed up
    */
-  revealSeed(): void {
+  async revealSeed(): Promise<void> {
     this.showSeed = true;
+
+    // Update the account setting to track that user has backed up their seed
+    try {
+      const settings = await this.$accountSettings();
+      if (settings.activeDid) {
+        await this.$saveUserSettings(settings.activeDid, {
+          hasBackedUpSeed: true,
+        });
+      }
+    } catch (err: unknown) {
+      logger.error("Failed to update hasBackedUpSeed setting:", err);
+      // Don't show error to user as this is not critical to the main functionality
+      // The seed phrase is still revealed, just the tracking won't work
+    }
   }
 
   /**
@@ -264,11 +279,15 @@ export default class SeedBackupView extends Vue {
    * @param text - The text to copy to clipboard
    * @param fn - Callback function to execute for feedback (called twice - immediately and after 2 seconds)
    */
-  doCopyTwoSecRedo(text: string, fn: () => void) {
+  async doCopyTwoSecRedo(text: string, fn: () => void) {
     fn();
-    useClipboard()
+    try {
-      .copy(text)
+      await copyToClipboard(text);
-      .then(() => setTimeout(fn, 2000));
+      setTimeout(fn, 2000);
+    } catch (error) {
+      this.$logAndConsole(`Error copying to clipboard: ${error}`, true);
+      this.notify.error("Failed to copy to clipboard.");
+    }
   }
 }
 </script>

src/views/ShareMyContactInfoView.vue

@@ -54,6 +54,7 @@ import { generateEndorserJwtUrlForAccount } from "../libs/endorserServer";
 import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
 import { Settings } from "@/db/tables/settings";
 import { Account } from "@/db/tables/accounts";
+import { copyToClipboard } from "../services/ClipboardService";
 import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
 
 // Constants for magic numbers
@@ -99,7 +100,7 @@ export default class ShareMyContactInfoView extends Vue {
       }
 
       const message = await this.generateContactMessage(settings, account);
-      await this.copyToClipboard(message);
+      await copyToClipboard(message);
       await this.showSuccessNotifications();
       this.navigateToContacts();
     } catch (error) {
@@ -140,14 +141,6 @@ export default class ShareMyContactInfoView extends Vue {
     );
   }
 
-  /**
-   * Copy the contact message to clipboard
-   */
-  private async copyToClipboard(message: string): Promise<void> {
-    const { copyToClipboard } = await import("../services/ClipboardService");
-    await copyToClipboard(message);
-  }
-
   /**
    * Show success notifications after copying
    */

src/views/StartView.vue

@@ -203,7 +203,7 @@ export default class StartView extends Vue {
       // Load account count for display logic
       this.numAccounts = await retrieveAccountCount();
 
-      logger.info("[StartView] Component mounted", {
+      logger.debug("[StartView] Component mounted", {
         hasGivenName: !!this.givenName,
         accountCount: this.numAccounts,
         passkeysEnabled: this.PASSKEYS_ENABLED,
@@ -221,7 +221,7 @@ export default class StartView extends Vue {
    * Routes user to new identifier creation flow with seed-based approach
    */
   public onClickNewSeed() {
-    logger.info("[StartView] User selected new seed generation");
+    logger.debug("[StartView] User selected new seed generation");
     this.$router.push({ name: "new-identifier" });
   }
 
@@ -235,14 +235,14 @@ export default class StartView extends Vue {
       const keyName =
         AppString.APP_NAME + (this.givenName ? " - " + this.givenName : "");
 
-      logger.info("[StartView] Initiating passkey registration", {
+      logger.debug("[StartView] Initiating passkey registration", {
         keyName,
         hasGivenName: !!this.givenName,
       });
 
       await registerSaveAndActivatePasskey(keyName);
 
-      logger.info("[StartView] Passkey registration successful");
+      logger.debug("[StartView] Passkey registration successful");
       this.$router.push({ name: "account" });
     } catch (error) {
       logger.error("[StartView] Passkey registration failed", error);
@@ -255,7 +255,7 @@ export default class StartView extends Vue {
    * Routes user to account import flow for existing seed phrase
    */
   public onClickNo() {
-    logger.info("[StartView] User selected existing seed import");
+    logger.debug("[StartView] User selected existing seed import");
     this.$router.push({ name: "import-account" });
   }
 
@@ -264,7 +264,7 @@ export default class StartView extends Vue {
    * Routes user to address derivation flow for existing seed
    */
   public onClickDerive() {
-    logger.info("[StartView] User selected address derivation");
+    logger.debug("[StartView] User selected address derivation");
     this.$router.push({ name: "import-derive" });
   }
 }

src/views/TestView.vue

@@ -91,13 +91,95 @@
           name: 'shared-photo',
           query: { fileName },
         }"
-        class="block w-full text-center text-md bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1.5 py-2 rounded-md mb-2 mt-2"
+        class="block w-full text-center text-md bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_rgba(0,0,0,0.5)] text-white px-1.5 py-2 rounded-md mb-2 mt-2"
         data-testId="fileUploadButton"
       >
         Go to Shared Page
       </router-link>
     </div>
 
+    <!-- URL Flow Testing Section -->
+    <div class="mt-8">
+      <h2 class="text-xl font-bold mb-4">URL Flow Testing</h2>
+      <p class="text-sm text-gray-600 mb-3">
+        Test claim and partner server URL flow from initialization to change
+        propagation.
+      </p>
+
+      <div class="space-y-4">
+        <div class="p-4 border border-gray-300 rounded-md bg-gray-50">
+          <h3 class="font-semibold mb-2">Current URL State</h3>
+          <div class="space-y-2 text-sm">
+            <div>
+              <strong>API Server:</strong>
+              <span class="font-mono">{{ apiServer || "Not Set" }}</span>
+            </div>
+            <div>
+              <strong>Partner API Server:</strong>
+              <span class="font-mono">{{ partnerApiServer || "Not Set" }}</span>
+            </div>
+            <div>
+              <strong>Active DID:</strong>
+              <span class="font-mono">{{ activeDid || "Not Set" }}</span>
+            </div>
+            <div>
+              <strong>Platform:</strong>
+              <span class="font-mono">{{ getCurrentPlatform() }}</span>
+            </div>
+          </div>
+        </div>
+
+        <div class="space-y-2">
+          <button
+            :class="primaryButtonClasses"
+            :disabled="isUrlTestRunning"
+            @click="testUrlFlow()"
+          >
+            {{ isUrlTestRunning ? "Testing..." : "Test URL Flow" }}
+          </button>
+
+          <button :class="secondaryButtonClasses" @click="changeApiServer()">
+            Change API Server (Test → Prod)
+          </button>
+
+          <button
+            :class="secondaryButtonClasses"
+            @click="changePartnerApiServer()"
+          >
+            Change Partner API Server (Test → Prod)
+          </button>
+
+          <button :class="warningButtonClasses" @click="resetToDefaults()">
+            Reset to Defaults
+          </button>
+
+          <button :class="secondaryButtonClasses" @click="refreshSettings()">
+            Refresh Settings
+          </button>
+
+          <button
+            :class="secondaryButtonClasses"
+            @click="logEnvironmentState()"
+          >
+            Log Environment State
+          </button>
+        </div>
+
+        <div class="p-4 border border-gray-300 rounded-md bg-gray-50">
+          <h3 class="font-semibold mb-2">URL Flow Test Results</h3>
+          <div class="max-h-64 overflow-y-auto space-y-2">
+            <div
+              v-for="(result, index) in urlTestResults"
+              :key="index"
+              class="p-2 border border-gray-200 rounded text-xs font-mono bg-white"
+            >
+              {{ result }}
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+
     <div class="mt-8">
       <h2 class="text-xl font-bold mb-4">Passkeys</h2>
       See console for results.
@@ -326,6 +408,11 @@ export default class Help extends Vue {
   showEntityGridTest = false;
   showPlatformServiceTest = false;
 
+  // for URL flow testing
+  isUrlTestRunning = false;
+  urlTestResults: string[] = [];
+  partnerApiServer: string | undefined;
+
   /**
    * Computed properties for template streamlining
    * Eliminates repeated classes and logic in template
@@ -534,24 +621,93 @@ export default class Help extends Vue {
   }
 
   /**
-   * Component initialization
-   *
    * Loads user settings and account information for testing interface
    * Uses PlatformServiceMixin for database access
    */
   async mounted() {
-    const settings = await this.$accountSettings();
+    logger.info(
-    this.activeDid = settings.activeDid || "";
+      "[TestView] 🚀 Component mounting - starting URL flow tracking",
-    this.apiServer = settings.apiServer || "";
+    );
-    this.userName = settings.firstName;
 
-    const account = await retrieveAccountMetadata(this.activeDid);
+    // Boot-time logging for initial configuration
-    if (this.activeDid) {
+    logger.info("[TestView] 🌍 Boot-time configuration detected:", {
-      if (account) {
+      platform: process.env.VITE_PLATFORM,
-        this.credIdHex = account.passkeyCredIdHex as string;
+      defaultEndorserApiServer: process.env.VITE_DEFAULT_ENDORSER_API_SERVER,
-      } else {
+      defaultPartnerApiServer: process.env.VITE_DEFAULT_PARTNER_API_SERVER,
-        alert("No account found for DID " + this.activeDid);
+      nodeEnv: process.env.NODE_ENV,
+      timestamp: new Date().toISOString(),
+    });
+
+    try {
+      // Track settings loading
+      logger.info("[TestView] 📥 Loading account settings...");
+      const settings = await this.$accountSettings();
+
+      logger.info("[TestView] 📊 Settings loaded:", {
+        activeDid: settings.activeDid,
+        apiServer: settings.apiServer,
+        partnerApiServer: settings.partnerApiServer,
+        isRegistered: settings.isRegistered,
+        firstName: settings.firstName,
+      });
+
+      // Update component state
+      this.activeDid = settings.activeDid || "";
+      this.apiServer = settings.apiServer || "";
+      this.partnerApiServer = settings.partnerApiServer || "";
+      this.userName = settings.firstName;
+
+      logger.info("[TestView] ✅ Component state updated:", {
+        activeDid: this.activeDid,
+        apiServer: this.apiServer,
+        partnerApiServer: this.partnerApiServer,
+      });
+
+      // Load account metadata
+      if (this.activeDid) {
+        logger.info(
+          "[TestView] 🔍 Loading account metadata for DID:",
+          this.activeDid,
+        );
+        const account = await retrieveAccountMetadata(this.activeDid);
+
+        if (account) {
+          this.credIdHex = account.passkeyCredIdHex as string;
+          logger.info("[TestView] ✅ Account metadata loaded:", {
+            did: account.did,
+            hasPasskey: !!account.passkeyCredIdHex,
+            passkeyId: account.passkeyCredIdHex,
+          });
+        } else {
+          logger.warn(
+            "[TestView] ⚠️ No account found for DID:",
+            this.activeDid,
+          );
+          alert("No account found for DID " + this.activeDid);
+        }
       }
+
+      logger.info("[TestView] 🎯 Component initialization complete:", {
+        activeDid: this.activeDid,
+        apiServer: this.apiServer,
+        partnerApiServer: this.partnerApiServer,
+        hasPasskey: !!this.credIdHex,
+        platform: this.getCurrentPlatform(),
+      });
+    } catch (error) {
+      logger.error(
+        "[TestView] ❌ Error during component initialization:",
+        error,
+      );
+      this.$notify(
+        {
+          group: "error",
+          type: "error",
+          title: "Initialization Error",
+          text: `Failed to initialize component: ${error instanceof Error ? error.message : String(error)}`,
+        },
+        5000,
+      );
     }
   }
 
@@ -824,5 +980,276 @@ export default class Help extends Vue {
       );
     }
   }
+
+  /**
+   * Tests the URL flow from initialization to change propagation.
+   * This simulates the flow where a user's DID is set, and then the
+   * claim and partner server URLs are updated.
+   */
+  public async testUrlFlow() {
+    this.isUrlTestRunning = true;
+    this.urlTestResults = [];
+
+    try {
+      logger.info("[TestView] 🔬 Starting comprehensive URL flow test");
+      this.addUrlTestResult("🚀 Starting URL flow test...");
+
+      // Test 1: Current state
+      this.addUrlTestResult(`📊 Current State:`);
+      this.addUrlTestResult(`  - API Server: ${this.apiServer || "Not Set"}`);
+      this.addUrlTestResult(
+        `  - Partner API Server: ${this.partnerApiServer || "Not Set"}`,
+      );
+      this.addUrlTestResult(`  - Active DID: ${this.activeDid || "Not Set"}`);
+      this.addUrlTestResult(`  - Platform: ${this.getCurrentPlatform()}`);
+
+      // Test 2: Load fresh settings
+      this.addUrlTestResult(`\n📥 Testing Settings Loading:`);
+      const startTime = Date.now();
+      const settings = await this.$accountSettings();
+      const loadTime = Date.now() - startTime;
+
+      this.addUrlTestResult(`  - Settings loaded in ${loadTime}ms`);
+      this.addUrlTestResult(
+        `  - API Server from settings: ${settings.apiServer || "Not Set"}`,
+      );
+      this.addUrlTestResult(
+        `  - Partner API Server from settings: ${settings.partnerApiServer || "Not Set"}`,
+      );
+
+      // Test 3: Database query
+      this.addUrlTestResult(`\n💾 Testing Database Query:`);
+      const dbStartTime = Date.now();
+      const dbResult = await this.$dbQuery(
+        "SELECT apiServer, partnerApiServer, activeDid FROM settings WHERE id = ? OR accountDid = ?",
+        [1, this.activeDid || ""],
+      );
+      const dbTime = Date.now() - dbStartTime;
+
+      if (dbResult?.values) {
+        this.addUrlTestResult(`  - Database query completed in ${dbTime}ms`);
+        this.addUrlTestResult(
+          `  - Raw DB values: ${JSON.stringify(dbResult.values)}`,
+        );
+      } else {
+        this.addUrlTestResult(
+          `  - Database query failed or returned no results`,
+        );
+      }
+
+      // Test 4: Environment variables
+      this.addUrlTestResult(`\n🌍 Testing Environment Variables:`);
+      this.addUrlTestResult(
+        `  - VITE_PLATFORM: ${import.meta.env.VITE_PLATFORM || "Not Set"}`,
+      );
+      this.addUrlTestResult(
+        `  - VITE_DEFAULT_ENDORSER_API_SERVER: ${import.meta.env.VITE_DEFAULT_ENDORSER_API_SERVER || "Not Set"}`,
+      );
+      this.addUrlTestResult(
+        `  - VITE_DEFAULT_PARTNER_API_SERVER: ${import.meta.env.VITE_DEFAULT_PARTNER_API_SERVER || "Not Set"}`,
+      );
+
+      // Test 5: Constants
+      this.addUrlTestResult(`\n📋 Testing App Constants:`);
+      this.addUrlTestResult(
+        `  - PROD_ENDORSER_API_SERVER: ${AppString.PROD_ENDORSER_API_SERVER}`,
+      );
+      this.addUrlTestResult(
+        `  - PROD_PARTNER_API_SERVER: ${AppString.PROD_PARTNER_API_SERVER}`,
+      );
+
+      // Test 6: Change detection
+      this.addUrlTestResult(`\n🔄 Testing Change Detection:`);
+      const originalApiServer = this.apiServer;
+      const originalPartnerServer = this.partnerApiServer;
+
+      // Simulate a change
+      this.addUrlTestResult(`  - Original API Server: ${originalApiServer}`);
+      this.addUrlTestResult(
+        `  - Original Partner Server: ${originalPartnerServer}`,
+      );
+
+      // Test 7: Settings update
+      this.addUrlTestResult(`\n💾 Testing Settings Update:`);
+      const testChanges = {
+        apiServer:
+          originalApiServer === "https://api.endorser.ch"
+            ? "https://test-api.endorser.ch"
+            : "https://api.endorser.ch",
+      };
+
+      this.addUrlTestResult(
+        `  - Attempting to change API Server to: ${testChanges.apiServer}`,
+      );
+      const updateResult = await this.$saveSettings(testChanges);
+      this.addUrlTestResult(
+        `  - Update result: ${updateResult ? "Success" : "Failed"}`,
+      );
+
+      // Test 8: Verify change propagation
+      this.addUrlTestResult(`\n✅ Testing Change Propagation:`);
+      const newSettings = await this.$accountSettings();
+      this.addUrlTestResult(
+        `  - New API Server from settings: ${newSettings.apiServer || "Not Set"}`,
+      );
+      this.addUrlTestResult(
+        `  - Component state API Server: ${this.apiServer || "Not Set"}`,
+      );
+      this.addUrlTestResult(
+        `  - Change propagated: ${newSettings.apiServer === this.apiServer ? "Yes" : "No"}`,
+      );
+
+      // Test 9: Revert changes
+      this.addUrlTestResult(`\n🔄 Reverting Changes:`);
+      const revertResult = await this.$saveSettings({
+        apiServer: originalApiServer,
+      });
+      this.addUrlTestResult(
+        `  - Revert result: ${revertResult ? "Success" : "Failed"}`,
+      );
+
+      // Test 10: Final verification
+      this.addUrlTestResult(`\n🎯 Final Verification:`);
+      const finalSettings = await this.$accountSettings();
+      this.addUrlTestResult(
+        `  - Final API Server: ${finalSettings.apiServer || "Not Set"}`,
+      );
+      this.addUrlTestResult(
+        `  - Matches original: ${finalSettings.apiServer === originalApiServer ? "Yes" : "No"}`,
+      );
+
+      this.addUrlTestResult(`\n✅ URL flow test completed successfully!`);
+      logger.info("[TestView] ✅ URL flow test completed successfully");
+    } catch (error) {
+      const errorMsg = `❌ URL flow test failed: ${error instanceof Error ? error.message : String(error)}`;
+      this.addUrlTestResult(errorMsg);
+      logger.error("[TestView] ❌ URL flow test failed:", error);
+    } finally {
+      this.isUrlTestRunning = false;
+    }
+  }
+
+  /**
+   * Adds a result to the URL test results array.
+   */
+  private addUrlTestResult(message: string) {
+    this.urlTestResults.push(message);
+  }
+
+  /**
+   * Changes the API server to the production URL.
+   */
+  public changeApiServer() {
+    const currentServer = this.apiServer;
+    const newServer =
+      currentServer === "https://api.endorser.ch"
+        ? "https://test-api.endorser.ch"
+        : "https://api.endorser.ch";
+
+    logger.info("[TestView] 🔄 Changing API server:", {
+      from: currentServer,
+      to: newServer,
+    });
+
+    this.apiServer = newServer;
+    this.addUrlTestResult(
+      `API Server changed from ${currentServer} to ${newServer}`,
+    );
+  }
+
+  /**
+   * Changes the partner API server to the production URL.
+   */
+  public changePartnerApiServer() {
+    const currentServer = this.partnerApiServer;
+    const newServer =
+      currentServer === "https://partner-api.endorser.ch"
+        ? "https://test-partner-api.endorser.ch"
+        : "https://partner-api.endorser.ch";
+
+    logger.info("[TestView] 🔄 Changing partner API server:", {
+      from: currentServer,
+      to: newServer,
+    });
+
+    this.partnerApiServer = newServer;
+    this.addUrlTestResult(
+      `Partner API Server changed from ${currentServer} to ${newServer}`,
+    );
+  }
+
+  /**
+   * Resets all URL-related settings to their initial values.
+   */
+  public resetToDefaults() {
+    this.apiServer = AppString.TEST_ENDORSER_API_SERVER;
+    this.partnerApiServer = AppString.TEST_PARTNER_API_SERVER;
+    this.activeDid = "";
+    this.addUrlTestResult("URL Flow Test Results Reset to Defaults.");
+  }
+
+  /**
+   * Refreshes settings from the database to verify changes.
+   */
+  public async refreshSettings() {
+    try {
+      logger.info("[TestView] 🔄 Refreshing settings from database");
+      const settings = await this.$accountSettings();
+
+      // Update component state
+      this.apiServer = settings.apiServer || "";
+      this.partnerApiServer = settings.partnerApiServer || "";
+
+      logger.info("[TestView] ✅ Settings refreshed:", {
+        apiServer: this.apiServer,
+        partnerApiServer: this.partnerApiServer,
+      });
+
+      this.addUrlTestResult(
+        `Settings refreshed - API Server: ${this.apiServer}, Partner API Server: ${this.partnerApiServer}`,
+      );
+    } catch (error) {
+      logger.error("[TestView] ❌ Error refreshing settings:", error);
+      this.addUrlTestResult(
+        `Error refreshing settings: ${error instanceof Error ? error.message : String(error)}`,
+      );
+    }
+  }
+
+  /**
+   * Logs the current environment state to the console.
+   */
+  public logEnvironmentState() {
+    logger.info("[TestView] 🌐 Current Environment State:", {
+      VITE_PLATFORM: import.meta.env.VITE_PLATFORM,
+      VITE_DEFAULT_ENDORSER_API_SERVER: import.meta.env
+        .VITE_DEFAULT_ENDORSER_API_SERVER,
+      VITE_DEFAULT_PARTNER_API_SERVER: import.meta.env
+        .VITE_DEFAULT_PARTNER_API_SERVER,
+      NODE_ENV: process.env.NODE_ENV,
+      activeDid: this.activeDid,
+      apiServer: this.apiServer,
+      partnerApiServer: this.partnerApiServer,
+    });
+    this.$notify({
+      group: "info",
+      type: "info",
+      title: "Environment State Logged",
+      text: "Current environment state logged to console.",
+    });
+  }
+
+  /**
+   * Gets the current platform based on the API server.
+   */
+  public getCurrentPlatform(): string {
+    if (this.apiServer?.includes(AppString.PROD_ENDORSER_API_SERVER)) {
+      return "Production";
+    } else if (this.apiServer?.includes(AppString.TEST_ENDORSER_API_SERVER)) {
+      return "Test";
+    } else {
+      return "Unknown";
+    }
+  }
 }
 </script>

src/views/UserProfileView.vue

@@ -108,7 +108,7 @@ import { didInfo, getHeaders } from "../libs/endorserServer";
 import { UserProfile } from "../libs/partnerServer";
 import { retrieveAccountDids } from "../libs/util";
 import { logger } from "../utils/logger";
-import { useClipboard } from "@vueuse/core";
+import { copyToClipboard } from "../services/ClipboardService";
 import { PlatformServiceMixin } from "@/utils/PlatformServiceMixin";
 import { createNotifyHelpers, TIMEOUTS } from "@/utils/notify";
 import { NOTIFY_PROFILE_LOAD_ERROR } from "@/constants/notifications";
@@ -240,14 +240,16 @@ export default class UserProfileView extends Vue {
    * Creates a deep link to the profile and copies it to the clipboard
    * Shows success notification when completed
    */
-  onCopyLinkClick() {
+  async onCopyLinkClick() {
     // Use production URL for sharing to avoid localhost issues in development
     const deepLink = `${APP_SERVER}/deep-link/user-profile/${this.profile?.rowId}`;
-    useClipboard()
+    try {
-      .copy(deepLink)
+      await copyToClipboard(deepLink);
-      .then(() => {
+      this.notify.copied("profile link", TIMEOUTS.STANDARD);
-        this.notify.copied("profile link", TIMEOUTS.STANDARD);
+    } catch (error) {
-      });
+      this.$logAndConsole(`Error copying profile link: ${error}`, true);
+      this.notify.error("Failed to copy profile link.");
+    }
   }
 
   /**

test-playwright/00-noid-tests.spec.ts

@@ -69,7 +69,8 @@
  */
 
 import { test, expect } from '@playwright/test';
-import { deleteContact, generateAndRegisterEthrUser, importUser } from './testUtils';
+import { createContactName, generateNewEthrUser, importUser, importUserFromAccount } from './testUtils';
+import { NOTIFY_CONTACT_INVALID_DID } from '../src/constants/notifications';
 
 test('Check activity feed - check that server is running', async ({ page }) => {
   // Load app homepage
@@ -169,36 +170,34 @@ test('Confirm test API setting (may fail if you are running your own Time Safari
   await expect(page.locator('#apiServerInput')).toHaveValue(endorserServer);
 });
 
-test('Check User 0 can register a random person', async ({ page }) => {
+test('Check invalid DID shows error and redirects', async ({ page }) => {
   await importUser(page, '00');
-  const newDid = await generateAndRegisterEthrUser(page);
+  
-  expect(newDid).toContain('did:ethr:');
+  // Navigate to an invalid DID URL
-
+  await page.goto('./did/0');
-  await page.goto('./');
+  
-  await page.getByTestId('closeOnboardingAndFinish').click();
+  // Should show error message about invalid DID format
-  await page.getByRole('button', { name: 'Person' }).click();
+  await expect(page.getByText(NOTIFY_CONTACT_INVALID_DID.message)).toBeVisible();
-  await page.getByRole('listitem').filter({ hasText: 'Unnamed' }).locator('svg').click();
+  
-  await page.getByPlaceholder('What was given').fill('Gave me access!');
+  // Should redirect to homepage
-  await page.getByRole('button', { name: 'Sign & Send' }).click();
+  await expect(page).toHaveURL(/.*\/$/);
-  await expect(page.getByText('That gift was recorded.')).toBeVisible();
+});
-  // now ensure that alert goes away
+
-  await page.locator('div[role="alert"] button > svg.fa-xmark').click(); // dismiss alert
+test('Check User 0 can register a random person', async ({ page }) => {
-  await expect(page.getByText('That gift was recorded.')).toBeHidden();
+  const newDid = await generateNewEthrUser(page); // generate a new user
-
+
-  // now delete the contact to test that pages still do reasonable things
+  await importUserFromAccount(page, "00"); // switch to User Zero
-  await deleteContact(page, newDid);
+
-  // go the activity page for this new person
+  // As User Zero, add the new user as a contact
-  await page.goto('./did/' + encodeURIComponent(newDid));
+  await page.goto('./contacts');
-  // maybe replace by: const popupPromise = page.waitForEvent('popup');
+  const contactName = createContactName(newDid);
-  let error;
+  await page.getByPlaceholder('URL or DID, Name, Public Key').fill(`${newDid}, ${contactName}`);
-  try {
+  await expect(page.locator('button > svg.fa-plus')).toBeVisible();
-    await page.waitForSelector('div[role="alert"]', { timeout: 2000 });
+  await page.locator('button > svg.fa-plus').click();
-    error = new Error('Error alert should not show.');
+  await expect(page.locator('div[role="alert"] h4:has-text("Success")')).toBeVisible(); // wait for info alert to be visible…
-  } catch (error) {
+  await page.locator('div[role="alert"] button > svg.fa-xmark').click(); // …and dismiss it
-    // success
+  await expect(page.locator('div[role="alert"] button > svg.fa-xmark')).toBeHidden(); // ensure alert is gone
-  } finally {
+  await page.locator('div[role="alert"] button:text-is("Yes")').click(); // Register new contact
-    if (error) {
+  await page.locator('div[role="alert"] button:text-is("No, Not Now")').click(); // Dismiss export data prompt
-      throw error;
+  await expect(page.locator("li", { hasText: contactName })).toBeVisible();
-    }
-  }
 });