fix: Auto-close country codes dropdown when clicking outside the component

[UdaySagar-Git]

Proposed Changes

• Fixes #7557

@coronasafe/care-fe-code-reviewers @coronasafe/code-reviewers

Merge Checklist

• [ ] Add specs that demonstrate bug / test a new feature.
• [ ] Update product documentation.
• [ ] Ensure that UI text is kept in I18n files.
• [ ] Prep screenshot or demo video for changelog entry, and attach it to issue.
• [ ] Request for Peer Reviews
• [ ] Completion of QA

[vercel[bot]]

@UdaySagar-Git is attempting to deploy a commit to the Open Healthcare Network Team on Vercel.

A member of the Team first needs to authorize it.

[netlify[bot]]

✅ Deploy Preview for care-egov-staging ready!

Name	Link
🔨 Latest commit	065c86955a6426614ba4e05512f35e5bb117bde4
🔍 Latest deploy log	https://app.netlify.com/sites/care-egov-staging/deploys/6627bbd103fa980008097205
😎 Deploy Preview	https://deploy-preview-7561--care-egov-staging.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

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

[nihal467]

LGTM

[UdaySagar-Git]

Would it be possible to use one of the headlessui component to handle the dropdown/popover? So that we won't need a custom hook to handle click outside to begin with?

will give it a try

[nihal467]

LGTM

[github-actions[bot]]

@UdaySagar-Git Your efforts have helped advance digital healthcare and TeleICU systems. :rocket: Thank you for taking the time out to make CARE better. We hope you continue to innovate and contribute; your impact is immense! :raised_hands: