[Due for payment 2026-03-19] [$250] Hide the chat history when Concierge is opened up in the right hand pane

[thienlnam]

Goal: Make ConciergeAnywhere feel like a fresh, clean entry point every time it’s opened in the right hand pane:

• Hide existing chat history every time the RHP is opened/re-opened
• Show a canned welcome message (virtual / frontend-only) like “Hi there, I'm Concierge. How can I help?” each time it opens
• Once the user sends their first message, the canned welcome should stop showing (for that open session / view).

After user sends a message

• The canned welcome message disappears (no longer rendered).
• The chat proceeds normally (showing messages that occur after the user starts interacting in that open session).

On open / re-open ConciergeAnywhere (RHP)

• The chat surface should look “new” (no scrollback shown).

• Pressing the show previous messages will just show all the previous messages from the chat

• Edge case:

• If there are no previous messages from the user, we should not show this hidden button

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~022019493293031450348
• Upwork Job ID: 2019493293031450348
• Last Price Increase: 2026-02-05

Issue Owner

Current Issue Owner: @marcaaron

Key Files

• [src/pages/inbox/report/ReportActionsView.tsx](src/pages/inbox/report/ReportActionsView.tsx) - Main report actions container
• [src/pages/inbox/report/ReportActionsList.tsx](src/pages/inbox/report/ReportActionsList.tsx) - Message list rendering
• [src/components/SidePanel/SidePanelContextProvider.tsx](src/components/SidePanel/SidePanelContextProvider.tsx) - Side panel state
• [src/libs/ReportUtils.ts](src/libs/ReportUtils.ts) - isConciergeChatReport() utility
• [src/languages/en.ts](src/languages/en.ts) - Translation strings

Implementation Steps

1. Add Translation Strings

Add new translation key for the virtual welcome message in all language files:

// src/languages/en.ts
concierge: {
    sidePanelGreeting: "Hi there, I'm Concierge. How can I help?",
    showPreviousMessages: 'Show previous messages',
}

2. Create ConciergeSidePanelWelcome Component

Create new component at src/components/ConciergeSidePanelWelcome.tsx:

• Display Concierge avatar
• Show greeting message from translations
• Use existing styling patterns from ReportWelcomeText.tsx
• Conditionally, hide once user sends first message

3. Modify ReportActionsList to Support Hidden History Mode

In src/pages/inbox/report/ReportActionsList.tsx:

• Add new props: isConciergeSidePanel, showHistoryHidden, onShowPreviousMessages
• Track sessionStartTimestamp using useRef - set when component mounts in side panel mode
• Filter sortedVisibleReportActions to only show messages with created > sessionStartTimestamp when showHistoryHidden is true
• Replace ListFooterComponent with "Show previous messages" button when history is hidden

4. Track Side Panel Session State

In src/pages/inbox/report/ReportActionsView.tsx:

• Add state: hasUserSentMessage (boolean)
• Add state: showFullHistory (boolean)
• Determine isConciergeSidePanel using isConciergeChatReport() and isInSidePanel prop
• Pass onMessageSent callback to ReportActionCompose to update hasUserSentMessage
• Reset states when side panel opens (use useEffect with dependency on side panel open state)

5. Conditionally Render Welcome Message

In ReportActionsView.tsx or ReportActionsList.tsx:

• When isConciergeSidePanel && !hasUserSentMessage && !showFullHistory:
  • Render ConciergeSidePanelWelcome component instead of/before the message list
  • Hide the ListFooterComponent skeleton loader
• When hasUserSentMessage:
  • Hide ConciergeSidePanelWelcome
  • Show messages from current session only

6. Implement "Show Previous Messages" Button

Create button component that:

• Appears at the bottom of the list (where footer normally is) when history is hidden
• On press, sets showFullHistory = true and calls loadOlderChats(true)
• Use existing Button component with appropriate styling

7. Pass isInSidePanel Through Component Hierarchy

Ensure isInSidePanel prop flows through:

• ReportScreen → ReportActionsView → ReportActionsList

The isInSidePanel prop already exists in ReportScreen.tsx (line 127) and flows to ReportFooter.

Manual QA

• Opening Concierge in side panel shows welcome message, no history
• Sending first message hides welcome message, shows only that message
• "Show previous messages" button appears and loads full history
• Closing and reopening side panel resets to fresh state
• Normal Concierge chat (not in side panel) works unchanged
• Translations work in all supported languages

Note: Actual proposal might vary - please validate the above for accuracy.

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~022019493293031450348

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @parasharrajat (External)

[Krishna2323]

@thienlnam could you please share the image from the OP? It isn’t loading for me.

[parasharrajat]

No proposal to review here. Krishna will work.

[Harmatta]

Proposal

Please re-state the problem that we are trying to solve in this issue.

When the Concierge chat is opened in the right-hand pane (ConciergeAnywhere), the existing chat scrollback is shown immediately. The goal is to make this RHP experience feel like a fresh entry point every time it is opened/re-opened — hide existing history, show a greeting, and provide a way to reveal previous messages.

What is the root cause of that problem?

The Concierge RHP uses the same ReportActionsView/ReportActionsList rendering as a normal chat view, which always renders all available reportActions for the report. There is no concept of a "side panel session" boundary or UI-only welcome state. The list has no filter to hide actions that happened before the RHP was opened, the open/re-open event does not reset any local state, and there is no synthetic welcome row for an empty/fresh state.

What changes do you think we should make in order to solve the problem?

Implement a ConciergeAnywhere "session" mode that filters what the report actions list renders while the RHP is open:

1. Add translation strings (concierge.sidePanelGreeting, concierge.showPreviousMessages) in src/languages/en.ts and equivalents.
2. Create a ConciergeSidePanelWelcome component (e.g., src/components/ConciergeSidePanelWelcome.tsx) rendering Concierge avatar + greeting.
3. In ReportActionsView.tsx, add local state for sessionStartTimestamp, showFullHistory, and hasUserSentMessage. Detect isConciergeSidePanel via ReportUtils.isConciergeChatReport() and side panel context. Reset state on RHP open/re-open via useEffect.
4. In ReportActionsList.tsx, when isConciergeSidePanel && !showFullHistory, filter sortedVisibleReportActions to only actions after sessionStartTimestamp.
5. Render ConciergeSidePanelWelcome while !hasUserSentMessage. Flip flag when user submits first message.
6. Show "Show previous messages" button when hidden history exists. On press, set showFullHistory = true.

cc: @Harmatta (storefile996@gmail.com / https://www.upwork.com/freelancers/~01184f546f3a74ab48)

[parasharrajat]

Not open for proposals.