Add Scroll-To for Message Query Parameter

[JamesonRGrieve]

Add a query parameter on the conversation page ?conversation=id which should scroll to the appropriate message.

[jnelsoncelsys]

@JamesonRGrieve and @waiscodes :

Category: UI/UX

---

User Story:
As a user viewing a conversation page,
I want to include ?conversation=<elementId> where <elementId> is the full DOM id of a message or activity,
So that the page automatically scrolls to that item when loaded.

---

Acceptance Criteria (Checklist):

• Loading the conversation page with a conversation query parameter causes the view to scroll to the corresponding element.
• The scroll is smooth and brings the element into the center of the viewport.
• If no matching element is found, the page does not attempt to scroll or throw errors.

---

Implementation Notes:

• Use Next.js’s useSearchParams() in src/components/Chat/ChatLog.tsx to read the conversation parameter.
• After messages/activities render, call document.getElementById(targetId)?.scrollIntoView({ behavior: 'smooth', block: 'center' }).
• Ensure targetId matches the full DOM IDs from Issue Add ID's to Messages and Activities for Scrolling #9 (e.g. message-<uuid> or activity-<uuid>).

---

Scope Boundaries:

• In-Scope:
  • Modifying only src/components/Chat/ChatLog.tsx.
  • Client-side scroll behavior based on the URL parameter.
• Out-of-Scope:
  • Any server-side routing or API changes.
  • Scroll logic in other parts of the app.

---

Dependencies:

• Component file: src/components/Chat/ChatLog.tsx
• ID attributes: Added in Issue Add ID's to Messages and Activities for Scrolling #9
• Hook: useSearchParams from next/navigation

---

[kuldeep-celestial]

Hey @JamesonRGrieve @jnelsoncelsys
This issue is highly dependent on conversation APIs, they are returning 404 (not found) , this can't be resolved until conversation APIs are not stable.

[jnelsoncelsys]

@JamesonRGrieve we need https://api-dev.aginfrastructure.ai/ but currently it is 404.

@codebykuldeep please update your local environment to point to this fork of the ServerFramework

[kuldeep-celestial]

Hi @JamesonRGrieve @jnelsoncelsys
My local environment points to https://api-dev.aginfrastructure.ai/ and on starting a new conversation , conversation is created in API but not rendering anywhere .
Is there any specific UI branch or environment for this that support listing conversation ?

[kuldeep-celestial]

A new conversation is being created on every message and messages are also not rendering in chat log , Using api-dev- , whether it's a frontend issue or backend ?

[jnelsoncelsys]

@codebykuldeep please use dev branch on AGInfra locally. use the /graphql endpoint. Make a mock conversation object to proceed with your development. The /graphql endpoint can be used to review the messages key and its field.

[yogeshCelestial]

Hi @JamesonRGrieve, @jnelsoncelsys,

To move forward on this issue, chat logs and conversations should work fine, but they do not.
After debugging it, I found we are managing conversations through GraphQL.
But the thing is, conversation queries are not available on https://api-dev.zephyrex.dev/graphql.

Earlier (like 3 days ago) queries was present (I don't know whether they were working or not) also we don't have rest APIs to manage the conversations and chats.
I hope we will get the queries back on server asap.