Skip to content

Conversation

@devin-ai-integration
Copy link
Contributor

@devin-ai-integration devin-ai-integration bot commented Jan 4, 2026

Add email subscription field with popup in footer

Summary

Adds an email subscription input to the website footer's brand section. When a user enters their email and submits, a popover expands showing checkboxes for subscription preferences:

  • Release Notes: Stable and Beta (beta includes download link)
  • Newsletter: About notetaking, opensource, and AI

The subscription data is sent to Loops with the new preference fields (releaseNotesStable, releaseNotesBeta, newsletter).

Updates since last revision

  • Rebased on latest main (formatting fixes now in main, no longer part of this PR)

Review & Testing Checklist for Human

  • Verify Loops configuration: Confirm that releaseNotesStable, releaseNotesBeta, and newsletter fields exist in your Loops contact schema. If not configured, these values may be silently ignored.
  • Test the full subscription flow: Enter email → submit → popover opens → select at least one checkbox → click Subscribe → verify contact is created in Loops with correct preferences
  • Check mobile responsiveness: The input has max-w-[220px] which may need adjustment on smaller screens
  • Verify popover positioning: Ensure the popover expands correctly from the input region and doesn't get cut off at the bottom of the page

Recommended test plan:

  1. Visit the footer on the website (use Netlify preview: deploy-preview-2797--hyprnote.netlify.app)
  2. Enter a test email and click the arrow button
  3. Verify the popover opens with the three checkbox options
  4. Select at least one option and click Subscribe
  5. Check Loops dashboard to confirm the contact was created with correct preference fields

Notes

  • The implementation uses the existing addContact function from @/functions/loops with extended schema
  • Uses existing UI components (Checkbox, Popover) from @hypr/ui
  • Subscribe button is disabled until at least one preference is selected

Link to Devin run: https://app.devin.ai/sessions/f88d8a8bafa04089ae20a4897504f1e2
Requested by: [email protected] (@ComputelessComputer)

@devin-ai-integration
Copy link
Contributor Author

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

  • Address comments on this PR that start with 'DevinAI' or '@devin'.
  • Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

  • Disable automatic comment and CI monitoring

@netlify
Copy link

netlify bot commented Jan 4, 2026

Deploy Preview for hyprnote-storybook ready!

Name Link
🔨 Latest commit 06cef85
🔍 Latest deploy log https://app.netlify.com/projects/hyprnote-storybook/deploys/695fdc821db9230008e8b25d
😎 Deploy Preview https://deploy-preview-2797--hyprnote-storybook.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@netlify
Copy link

netlify bot commented Jan 4, 2026

Deploy Preview for hyprnote ready!

Name Link
🔨 Latest commit 06cef85
🔍 Latest deploy log https://app.netlify.com/projects/hyprnote/deploys/695fdc8217dbab0008a09def
😎 Deploy Preview https://deploy-preview-2797--hyprnote.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@netlify
Copy link

netlify bot commented Jan 4, 2026

Deploy Preview for howto-fix-macos-audio-selection ready!

Name Link
🔨 Latest commit 06cef85
🔍 Latest deploy log https://app.netlify.com/projects/howto-fix-macos-audio-selection/deploys/695fdc82bdecfc0008dcaf82
😎 Deploy Preview https://deploy-preview-2797--howto-fix-macos-audio-selection.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

Comment on lines 92 to 112
onSuccess: () => {
setPopoverOpen(false);
setEmail("");
setSubscriptions({
releaseNotesStable: false,
releaseNotesBeta: false,
newsletter: false,
});
},
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The form field is not being reset after successful subscription. When setEmail("") is called, it only clears the email state variable, but the form's internal state (field.state.value) is not reset. After a successful subscription, the email input will still display the previously entered email address.

To fix this, reset the form state:

onSuccess: () => {
  setPopoverOpen(false);
  form.reset();
  setEmail("");
  setSubscriptions({
    releaseNotesStable: false,
    releaseNotesBeta: false,
    newsletter: false,
  });
},
Suggested change
onSuccess: () => {
setPopoverOpen(false);
setEmail("");
setSubscriptions({
releaseNotesStable: false,
releaseNotesBeta: false,
newsletter: false,
});
},
onSuccess: () => {
setPopoverOpen(false);
form.reset();
setEmail("");
setSubscriptions({
releaseNotesStable: false,
releaseNotesBeta: false,
newsletter: false,
});
},

Spotted by Graphite Agent

Fix in Graphite


Is this helpful? React 👍 or 👎 to let us know.

@devin-ai-integration devin-ai-integration bot force-pushed the devin/1767528126-footer-email-subscription branch from 4c175db to 3f8ffa3 Compare January 4, 2026 14:46
@ComputelessComputer ComputelessComputer force-pushed the devin/1767528126-footer-email-subscription branch 2 times, most recently from 05ad1b9 to 15e1de4 Compare January 8, 2026 05:18
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

Status: Backlog

Development

Successfully merging this pull request may close these issues.

2 participants