Skip to content

[FEAT]: Show live recording duration timer in the popup UI #104

Closed as not planned
Closed as not planned
[FEAT]: Show live recording duration timer in the popup UI#104
Assignees
mikel110
Labels
component:backgroundComponent: Background service workercomponent:popupComponent: Popup UIgood first issueGood for newcomersgssocOfficial GSSoC contribution issuegssoc:approvedGSSoC: PR approved and scoredlevel:beginnerDifficulty level: Beginner (20 pts)staletype:featureType: New Featureui

Description

@shouri123
shouri123
opened on May 28, 2026

Description

The popup UI currently provides no visual indication of how long the current recording session has been active. Users have to guess whether they've been recording for 5 minutes or 50 minutes, which is important for API cost awareness.

Task

  1. Add a live timer display in popup.html that shows HH:MM:SS elapsed recording time
  2. Start the timer when recording begins (listen for state changes from background.ts)
  3. Stop and reset the timer when recording stops
  4. Style the timer to match the existing monochrome design system
  5. Use setInterval with proper cleanup to avoid memory leaks

Files Affected

  • src/popup.ts
  • src/popup.html

Acceptance Criteria

  • Timer displays in the popup when recording is active
  • Timer shows accurate elapsed time in HH:MM:SS format
  • Timer stops cleanly when recording ends
  • npm run type-check and npm run lint pass
  • Matches existing UI design language

Difficulty

🟢 Beginner — Good first issue

Activity

  1. github-actions
    added
    ui
    on May 28, 2026
  2. shouri123
    added
    good first issueGood for newcomers
    gssocOfficial GSSoC contribution issue
    type:featureType: New Feature
    level:beginnerDifficulty level: Beginner (20 pts)
    on May 28, 2026

  3. mikel110 commented on May 28, 2026

    @mikel110
    mikel110
    on May 28, 2026
    Contributor

    @shouri123 I can work on this issue.

  4. shouri123 commented on May 28, 2026

    @shouri123
    shouri123
    on May 28, 2026
    OwnerAuthor

    @mikel110 chose anyone

  5. mikel110 commented on May 28, 2026

    @mikel110
    mikel110
    on May 28, 2026
    Contributor

    @shouri123 I will work on this one, I will remove my comments on the other ones. Kindly assign this to me

  6. github-actions
    assigned
    mikel110
    on May 28, 2026

  7. github-actions commented on May 28, 2026

    @github-actions
    github-actionsbot
    on May 28, 2026 – with GitHub Actions
    Contributor

    Hello @mikel110! You have been assigned to this issue. 🚀

    Please make sure you have read our contribution guidelines. Happy coding!

    Please consider starring the repository ⭐ to show your support!

  8. shouri123
    added
    component:backgroundComponent: Background service worker
    component:popupComponent: Popup UI
    on May 30, 2026

  9. gaurav123-4 commented on May 31, 2026

    @gaurav123-4
    gaurav123-4
    on May 31, 2026
    Contributor

    @shouri123 Assign me the issue so that i can start working on it.

  10. github-actions commented on May 31, 2026

    @github-actions
    github-actionsbot
    on May 31, 2026 – with GitHub Actions
    Contributor

    Hi @gaurav123-4! This issue is already assigned to @mikel110. Please look for other unassigned issues to work on. 🚀

    Please consider starring the repository ⭐ to show your support!

  11. shouri123
    added
    gssoc:approvedGSSoC: PR approved and scored
    on Jun 1, 2026

  12. mikel110 commented on Jun 7, 2026

    @mikel110
    mikel110
    on Jun 7, 2026
    Contributor

    @shouri123 This is a stale issue and can be closed since the timer is already present.

  13. navyamittal2245 commented on Jun 15, 2026

    @navyamittal2245
    navyamittal2245
    on Jun 15, 2026

    /assign

  14. github-actions commented on Jun 15, 2026

    @github-actions
    github-actionsbot
    on Jun 15, 2026 – with GitHub Actions
    Contributor

    Hi @navyamittal2245! This issue is already assigned to @mikel110. Please look for other unassigned issues to work on. 🚀

    Please consider starring the repository ⭐ to show your support!

  15. github-actions commented on Jun 30, 2026

    @github-actions
    github-actionsbot
    on Jun 30, 2026 – with GitHub Actions
    Contributor

    This issue has been marked as stale due to inactivity.

  16. github-actions
    added
    stale
    on Jun 30, 2026
  17. github-actions
    closed this as not plannedon Sep 11, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Labels

component:backgroundComponent: Background service workercomponent:popupComponent: Popup UIgood first issueGood for newcomersgssocOfficial GSSoC contribution issuegssoc:approvedGSSoC: PR approved and scoredlevel:beginnerDifficulty level: Beginner (20 pts)staletype:featureType: New Featureui

Projects

No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions