[FE-14] Build /onboarding page — first-time setup guide for new users

[mftee]

Overview

First-time users land on a blank dashboard with no guidance. An onboarding flow explains what SMALDA does, walks users through uploading their first document, and sets expectations about the AI analysis and blockchain verification steps.

Background

File to create: frontend/app/(protected)/onboarding/page.tsx

Structure:

• Step 1: Welcome — what SMALDA does (explain AI risk scoring and Stellar verification in plain language)
• Step 2: Upload your first document — a simplified upload card with a drag-and-drop zone
• Step 3: Understand your results — explain what PENDING, ANALYZING, VERIFIED, FLAGGED statuses mean
• Step 4: Done — redirect to /dashboard

Trigger: Show this page automatically for users whose account was created within the last 24 hours and who have zero documents. Store completion in localStorage or on the user profile so it is never shown twice.

A "Skip" button at any step should mark onboarding as complete and redirect to /dashboard.

Acceptance Criteria

• Onboarding shown automatically to new users with zero documents
• Never shown again after completion or skip
• Step progress indicator shows current step
• Upload card in Step 2 calls the real POST /api/documents/upload endpoint
• Back and Next navigation between steps

[teethaking]

@teethaking has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

Hello may i work ob this please?

ℹ️ Repo Maintainers: To accept this application, review their application or assign @teethaking to this issue.

[Lanhubs]

@Lanhubs has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

I’d love to take this on! I have strong experience implementing these exact patterns and can deliver a clean, production-ready solution that hits all acceptance criteria.

My approach will focus on writing modular, well-documented code with comprehensive test coverage for both success paths and edge cases.

I'm ready to get started immediately. Could you please assign this to me?

ℹ️ Repo Maintainers: To accept this application, review their application or assign @Lanhubs to this issue.

[Faromzy]

@Faromzy has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

I will love to work on this issue,pls 🙏 give me

ℹ️ Repo Maintainers: To accept this application, review their application or assign @Faromzy to this issue.

[mijinummi]

@mijinummi has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

Hello maintainers I'm a full stack developer experience in building scalable systems I can handle this perfectly

ℹ️ Repo Maintainers: To accept this application, review their application or assign @mijinummi to this issue.

[drips-wave]

Congratulations, @mijinummi! 🎉 Your application was accepted by the repo's maintainers, and the issue is due on June 30, 2026.

🧑‍💻 @mijinummi: Please resolve the issue such that the repo's maintainers have enough time to review your contribution before the due date. You'll earn Points for completing the issue on-time, which will make you eligible for a share of the Stellar Wave Program's reward pool.

Warning

When opening a PR, please link it to this issue to ensure it gets tracked accurately. Points are awarded when this issue is marked as completed by the maintainer.

🤠 Repo maintainers: Please keep an eye on the contributor's progress and review their work before the due date. You can manage this issue, including adjusting its complexity and points, here.

🌊 Happy Wave 🌊

[grantfox-oss]

🦊 GrantFox — @mijinummi has been assigned to this issue!

Next steps:

1. Open a Pull Request referencing this issue (e.g., Closes #826)
2. Your PR will be reviewed by the CodeGirlsInc maintainers

Good luck! Track your progress on GrantFox.