Load last X items in a repeating group / scroll to last item

Tips
1

Hi forum community - I’ve seen a number of threads w/r/t load issues and/or “scroll to last item” when using a repeating group in a chat. That is, a repeating group in a chat is set to scroll to last item when loaded but gets stuck because it takes too long to load every message. I used a workaround to load the last 5 messages within a chat (shoutout to @eve for the help). Here’s how it looks.

  1. Each new message is indexed in a message data table (i.e. assigned a number), I call this messageIndex. Looks like this:
    image
  2. Create a custom state on the page or an invisible group for an index number, like this:
    image
  3. When page loads or button is clicked to load chat messages set state for your index number as the fifth last messageIndex (from your message data table). I do this by searching first my Chat data table for the relevant chat (defined by the current user and the “chat with” user), then the messages within that chat, and pull the last items messageIndex number minus 5. Like this:
    image
  4. Lastly, I set the data source for my RG to pull only the last 5 messages of the loaded chat by using “items from #” and the index set in step 3. Looks like this:
    image

The result is that my RG only loads the last 5 messages in a chat.

5 Likes
2

Hi!

cheers man for that.
A bit to fast for me. Can you just tell me where to find the fields in the first 2 screenshots ?

  • Where to write messageIndex ?
  • Where is the Element Inspector ?
    Sorry for those question, I’m a really new beginner :slightly_smiling_face:

Thx
Philippe

3

Hey @seeyu.pro

  1. messageIndex is a field when you create a new message. I have a custom event that creates a new message. Looks like this:
    image
    image1503×810 78.5 KB

    By creating a custom event you can then trigger a new message with various workflows on your page (i.e. give you flexibility).
  2. Element inspector is the “i” button here:
    image
4

that is nice but the user can’t scroll to see the older messages there would need to be “show older messages” text only visible at the top message. Is the ux workaround for this?

there is a brilliant plugin from @lottemint.md. Works with scroll and all that.

1 Like
5

But I still use the old way (scroll to last item) for my mobile chat (because of the lack of RG height responsiveness) so maybe this is the way to go

I have recreated @pwallmurray solution here for those interested

6

Thanks @bartek.dev you’re right and I should have added it initially. A “load previous messages” button is super simple with this approach:

  1. Create a button that is visible when the message:count is greater than X number (I set mine to 5).
    image
    image686×935 45.8 KB
  2. When button is clicked recalculate the index state (setup in step #2 above) as index - 5 (i.e. the previous index value, which is the 5th last message, minus 5) resulting in the 10th last message. Clicking the button resets this until you are at the first message in the chat.
    image
    image1115×661 42.9 KB
2 Likes
7

this is great, but the only caveat is if your chat is less than 5 messages…you need to apply another condition, I applied it in the conditional and change datasource if messagecount >10

1 Like