feat: Add welcome card

[KapadiaNaitik]

What does this PR do?

Fixes #1055

Type of change

• Bug fix (non-breaking change which fixes an issue)
• Chore (refactoring code, technical debt, workflow improvements)
• Enhancement (small improvements)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• This change adds a new database migration
• This change requires a documentation update

How should this be tested?

• Test A
• Test B

Checklist

Required

Will Update During Final Review

• 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

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]

@KapadiaNaitik is attempting to deploy a commit to the formbricks Team on Vercel.

A member of the Team first needs to authorize it.

[github-actions]

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

[jobenjada]

Hey @KapadiaNaitik how is it? Is this ready for review as discussed on Discord? :) Would love to release the other upload related issues today which would reuse some of your code, so this should get merged today :pray

[jobenjada]

Hey @KapadiaNaitik how is it? Is this ready for review as discussed on Discord? :) Would love to release the other upload related issues today which would reuse some of your code, so this should get merged today :pray

[KapadiaNaitik]

Hey, @jobenjada it's done except for the Lucide Icon for enter and I was facing some issues with types/react and Lucide icon. I have already talked to and informed @pandeymangg and he had a look(it was a weird dependency issue afaik). I will follow up once again with him and get this done as soon as possible. Sorry for the delay

[pandeymangg]

Thanks a lot @KapadiaNaitik for this PR! looks and works great! 🥳
I have left some comments, please go through them. For using the Image component from next/image, you'll need to modify the images.remotePatterns field in the next.config.mjs file under apps/web. Please add the following at the end of that array:

{
  protocol: "http",
  hostname: "localhost",
},
{
  protocol: "https",
  hostname: "app.formbricks.com",
},

[pandeymangg]

Please use the Image component from next/image here 🙏

[KapadiaNaitik]

next/Image not working for some reason

[KapadiaNaitik]

@jobenjada I have pushed the required tweaks

[pandeymangg]

LGTM! 🥳

[KapadiaNaitik]

Hey @mattinannt looks like I and you both pushed our commits so welcomeCard got duplicated in clientSettings😅

[sentry-io]

Suspect Issues

This pull request was deployed and Sentry observed the following issues:

• ‼️ Error: Upload failed with status: 401 uploadFile(chunks/app/(app)/environments/[envir... View Issue
• ‼️ Error: Upload failed with status: 400 uploadFile(chunks/app/(app)/environments/[envir... View Issue

_{Did you find this useful? React with a 👍 or 👎}