feat: /health endpoint

[ShubhamPalriwala]

What does this PR do?

/health endpoint checks if the system is running as expected or not! Throws UI + status code (200 or not) accordingly.

Fixes #1840

How should this be tested?

• Test A
• Test B

Checklist

Required

• Filled out the "How to test" section in this PR
• Read How we Code at Formbricks
• Self-reviewed my own code
• Commented on my code in hard-to-understand bits
• Ran pnpm build
• Checked for warnings, there are none
• Removed all console.logs
• Merged the latest changes from main onto my branch with git pull origin main
• My changes don't cause any responsiveness issues
• First PR at Formbricks? Please sign the CLA! Without it we wont be able to merge it 🙏

Appreciated

• If a UI change was made: Added a screen recording or screenshots to this PR
• Updated the Formbricks Docs if changes were necessary

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

2 Ignored Deployments

Name	Status	Preview	Comments	Updated (UTC)
formbricks-cloud	⬜️ Ignored (Inspect)	Visit Preview		Jan 22, 2024 7:35am
formbricks-com	⬜️ Ignored (Inspect)	Visit Preview		Jan 22, 2024 7:35am

[github-actions]

Thank you for following the naming conventions for pull request titles! 🙏

[review-agent-prime]

apps/web/app/health/error.tsx

React components re-render by default whenever their parent component re-renders, even if their props haven't changed. This can lead to unnecessary re-rendering and a performance hit. To avoid this, you can use React.memo to memoize your component. This will make it so your component only re-renders when its props change.
Create Issue
See the diff
Checkout the fix

    export default React.memo(Error);

git fetch origin && git checkout -b ReviewBot/Impro-yg7guhk origin/ReviewBot/Impro-yg7guhk

[review-agent-prime]

Wrapped the Error component with React.memo to prevent unnecessary re-rendering when the props haven't changed, improving performance.

Suggested change

	export default function Error({ error }: { error: Error & { digest?: string } }) {
	return (
	<div className="mx-auto flex h-full max-w-xl flex-col items-center justify-center text-center">
	<XCircleIcon height={40} color="red" />
	<p className="text-md mt-4 font-bold text-zinc-900">Your Formbricks health is degraded</p>
	<p className="text-sm text-zinc-900">{error.message}</p>
	</div>
	);
	}
	export default React.memo(Error);

[mattinannt]

@ShubhamPalriwala thanks a lot for the quick turnaround. Looks great! 😊

[mattinannt]

@ShubhamPalriwala unfortunately we are getting build errors in the pipeline. Can you please take a look :-)