Is it possible to create a Repeating Group with the first cell populated by a separate data source?

I have created a Repeating Group that uses a data type as the data source, and this is working properly. However, I would like the first cell in this Repeating Group to display data that is not in the database. Is there a way to customize a single cell in a repeating group?

For some context, and an example… I come from a coding background with a focus in React. Let’s say that I want to create a reusable component that displays a user name and phone number. I can map through the data with this reusable component to create a list of components where each component displays the name and phone number of a single user from the database. However, let’s say that I want the first item in this list to display example data that is not in the database. I would be able to add a copy of the reusable component to the front of this list and populate it separately with my example data. And the whole list would display seamlessly as a single entity even though the first item was created separately from the rest of the list.

Does the Repeating Group in Bubble have anyway to create this kind of behavior?

One solution that I attempted was to create a separate regular Group to be placed in front of my Repeating Group. However, this regular group very stands out as separate from the Repeating Group because the items in the Repeating Group are scroll-able, but the regular Group at the front of the list is not included in this scroll.

RG can have only one Data Type.

You can display some static text elements with sample data same way as a lot of bubble devs used to create “header row” in the same RG. The idea is → when current cell’s index is 1 - show header row (static data). For other cell’s (index 2 and higher) you are showing dynamic data.

P.S. Not sure if this approach is still relevant cause I haven’t built table-like RGs for a long time.

You can add two groups into the cell of the repeating group. Make one of the data type that corresponds with the repeating group and make the other the data type you want. Then add a conditional to the group that corresponds with the repeating group saying that it is visible if current cell index is 1 and isn’t visible if index is not 1. then add the opposite conditionals for the rest of the groups. The only issue with this is that you will either be missing the first or the last item in the repeating group’s list of things. One way to fix this would be to make use the list of numbers plugin to create a list of numbers that is equal to the length of the list of whatever thing you want to show in the repeating group. Then make the data source of the repeating group the list of numbers and just store the list of other things to some custom state. Then you will be able to say in the group corresponding to the list of things that the data source equals custom states list of things item # current cell index - 1. Either way, a group within a repeating group can have whatever data type you want it to regardless of the data type of the repeating group. You just won’t be able to reference with Current Cell’s thing but will have to find work arounds like mentioned before.

1 Like

Hey @anon18381962

Coming from React, are you finding Bubble to be easier?

Thank you all for the responses. I was able to figure out a solution with these recommendations.

Also, @ryanck, no, I did not find Bubble to be easier than React. I can see how Bubble is a helpful alternative for those who do not know how to code, but I did not find it to be an easy or intuitive platform to use.

1 Like