Skip to content

feat(walkthrough): end guided tour on chat page with pre-seeded welcome message#1287

Merged
senamakel merged 1 commit intotinyhumansai:mainfrom
graycyrus:feat/guided-tour-chat-welcome
May 6, 2026
Merged

feat(walkthrough): end guided tour on chat page with pre-seeded welcome message#1287
senamakel merged 1 commit intotinyhumansai:mainfrom
graycyrus:feat/guided-tour-chat-welcome

Conversation

@graycyrus
Copy link
Copy Markdown
Contributor

@graycyrus graycyrus commented May 6, 2026

Summary

  • The final tour step now navigates to /chat and seeds a welcome message from the AI assistant into a new thread
  • Users land on a warm first conversation instead of an empty chat page after completing the guided tour
  • Graceful degradation: if thread creation fails, the tour still navigates to /chat

Changes

File Change
app/src/constants/onboardingChat.ts Added TOUR_WELCOME_MESSAGE constant
app/src/components/walkthrough/walkthroughSteps.ts Replaced final step — navigates to /chat with before hook that creates thread + seeds agent message
app/src/components/walkthrough/__tests__/AppWalkthrough.test.tsx Updated step target tests, added seeding + degradation tests

Test plan

  • pnpm typecheck — clean
  • pnpm lint — clean (0 errors)
  • pnpm format:check — clean
  • pnpm build — succeeds
  • All 46 walkthrough tests pass
  • Manual: complete guided tour → verify welcome message appears in chat

Closes #1217

Summary by CodeRabbit

  • New Features

    • Enhanced onboarding walkthrough with an additional step that automatically creates a chat thread, delivers a personalized welcome message, and seamlessly transitions users to the chat interface.
  • Tests

    • Updated walkthrough test suite to validate the new onboarding step, including thread creation, message seeding, and proper navigation behavior.

…me message

The final tour step now navigates to /chat and seeds a welcome message
from the AI assistant into a new thread, so users land on a warm first
conversation instead of an empty chat page.

Closes tinyhumansai#1217
@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented May 6, 2026

📝 Walkthrough

Walkthrough

The guided walkthrough is extended from 9 to 10 steps, adding a final step that creates a new chat thread with a pre-seeded welcome message from the AI assistant, then navigates to the chat page. Redux mocks and comprehensive tests verify the thread creation, message seeding, and navigation behavior.

Changes

Guided Tour Final Step with Welcome Message

Layer / File(s) Summary
Welcome Message Constant
app/src/constants/onboardingChat.ts
New constant TOUR_WELCOME_MESSAGE exported with the warmly-phrased AI greeting for tour completion.
Final Step Implementation
app/src/components/walkthrough/walkthroughSteps.ts
Step 9 expanded to create a new thread, construct and dispatch a welcome message, select the thread, navigate to /chat, and handle thread-creation failures with fallback navigation and target-waiting logic.
Step Definition Updates
app/src/components/walkthrough/walkthroughSteps.ts
Walkthrough extended from 9-step to 10-step sequence; last-step target changed to chat-agent-panel; step indices for cross-page and home-only steps adjusted to reflect new layout.
Redux Store Mocks & Tests
app/src/components/walkthrough/__tests__/AppWalkthrough.test.tsx
Store and threadSlice mocks added; test assertions updated for last-step target; new tests added for Step 9 target and before-hook behavior—including success (thread created, message seeded, navigation) and failure (thread creation fails, navigation to /chat still occurs) scenarios.

Sequence Diagram

sequenceDiagram
    participant User as User / Tour Step
    participant Store as Redux Store
    participant ThreadSlice as threadSlice Actions
    participant Nav as Navigation
    participant Chat as Chat Page

    User->>Store: dispatch createNewThread()
    Store->>ThreadSlice: createNewThread (async)
    ThreadSlice-->>Store: unwrap() → thread.id
    
    User->>ThreadSlice: addMessageLocal(threadId, welcomeMessage)
    ThreadSlice-->>Store: message added to cache
    
    User->>ThreadSlice: setSelectedThread(threadId)
    ThreadSlice-->>Store: thread selected
    
    User->>Nav: navigate("/chat")
    Nav-->>Chat: route to chat page
    Chat->>Chat: display thread with pre-seeded message

    alt Thread creation fails
        Store-->>User: dispatch rejects
        User->>Nav: navigate("/chat") fallback
        Nav-->>Chat: route to chat page (empty or existing)
    end
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related issues

Possibly related PRs

  • tinyhumansai/openhuman#1218 — Extends walkthrough step logic by adding a new step that pre-creates a chat thread and seeds a welcome message before navigating to /chat, building on multi-page walkthrough refactoring.
  • tinyhumansai/openhuman#1116 — Adds onboarding welcome-thread behavior and pre-created welcome-message selection logic in the onboarding flow.

Poem

🐰 A whispered welcome in the chat,
Ten steps complete—the tour's done with that!
A thread springs forth, a message waits,
Our guided friend now sees the gates,
And hops with joy to talk and play!

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Linked Issues check ⚠️ Warning The PR implements all primary coding requirements from #1217: navigating to /chat on final step, creating a thread, seeding a warm welcome message, gracefully handling thread creation failures, and adding comprehensive tests. However, cleanup of commented-out #1123 remnants was not completed. Remove commented-out welcome-agent/welcome-lock code from Conversations.tsx, threadSlice.ts, coreState/store.ts, and BottomTabBar.tsx as specified in issue #1217 acceptance criteria.
✅ Passed checks (4 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title clearly and accurately describes the main change: adding end-of-tour navigation to the chat page with a pre-seeded welcome message, matching the core objective of the PR.
Out of Scope Changes check ✅ Passed All changes are properly scoped to implementing the guided tour improvements: constants for welcome messages, final step logic in walkthrough, and comprehensive test updates for the new behavior. No unrelated changes detected.
Docstring Coverage ✅ Passed Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.


Comment @coderabbitai help to get the list of available commands and usage tips.

@graycyrus graycyrus marked this pull request as ready for review May 6, 2026 10:57
@graycyrus graycyrus requested a review from a team May 6, 2026 10:57
Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

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

🧹 Nitpick comments (1)
app/src/components/walkthrough/__tests__/AppWalkthrough.test.tsx (1)

613-616: ⚡ Quick win

Assert the seeded message payload here, not just that the helper ran.

This still passes if the wrong content or sender is dispatched. Lock the feature down by checking the addMessageLocal payload includes the new thread id plus the expected assistant message.

Example assertion upgrade
       expect(store.dispatch).toHaveBeenCalled();
       expect(createNewThread).toHaveBeenCalled();
-      expect(addMessageLocal).toHaveBeenCalled();
+      expect(addMessageLocal).toHaveBeenCalledWith(
+        expect.objectContaining({
+          threadId: 'thread-welcome-123',
+          message: expect.objectContaining({
+            content: TOUR_WELCOME_MESSAGE,
+            sender: 'agent',
+          }),
+        })
+      );
       expect(setSelectedThread).toHaveBeenCalledWith('thread-welcome-123');
       expect(navigate).toHaveBeenCalledWith('/chat');

You'd also need to import TOUR_WELCOME_MESSAGE into this test file. As per coding guidelines, "Prefer testing behavior over implementation details."

🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@app/src/components/walkthrough/__tests__/AppWalkthrough.test.tsx` around
lines 613 - 616, Update the test to assert the actual seeded message payload
instead of only that addMessageLocal ran: import TOUR_WELCOME_MESSAGE into the
test, and replace or augment the existing expectation on addMessageLocal by
checking it was called with an object whose threadId equals 'thread-welcome-123'
(or contains that id) and whose message content/sender matches
TOUR_WELCOME_MESSAGE (assistant content and correct sender), while keeping the
existing assertions for createNewThread and setSelectedThread; reference the
addMessageLocal, createNewThread, setSelectedThread, and TOUR_WELCOME_MESSAGE
symbols when making these assertions.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Nitpick comments:
In `@app/src/components/walkthrough/__tests__/AppWalkthrough.test.tsx`:
- Around line 613-616: Update the test to assert the actual seeded message
payload instead of only that addMessageLocal ran: import TOUR_WELCOME_MESSAGE
into the test, and replace or augment the existing expectation on
addMessageLocal by checking it was called with an object whose threadId equals
'thread-welcome-123' (or contains that id) and whose message content/sender
matches TOUR_WELCOME_MESSAGE (assistant content and correct sender), while
keeping the existing assertions for createNewThread and setSelectedThread;
reference the addMessageLocal, createNewThread, setSelectedThread, and
TOUR_WELCOME_MESSAGE symbols when making these assertions.

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: f6dfa137-2d39-4654-8688-dbb027aa8dc5

📥 Commits

Reviewing files that changed from the base of the PR and between a3a1843 and 112c7e3.

📒 Files selected for processing (3)
  • app/src/components/walkthrough/__tests__/AppWalkthrough.test.tsx
  • app/src/components/walkthrough/walkthroughSteps.ts
  • app/src/constants/onboardingChat.ts

@senamakel senamakel merged commit 791438f into tinyhumansai:main May 6, 2026
22 of 23 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

End guided tour on chat page with a pre-seeded welcome message from the AI

2 participants