How can we create a list based on several Data sheets


#1

Hi Antti. New challenge I’m facing; How can we create a list based on several data sheets? Is there any example of how to achieve this? In my case the items will be listed by date regardless of which datasheet/fields are presented in the list. Should I use states or simple using a script in the field in React Studio? There are different types of posts which one with their data Sheet. Therefore in this list, there are simple posts, polls, a new recommendation or a new review. All them listed in this feed. Best, Marcos


#2

Hi,

List can have only one data sheet as data source. You need to edit the backend so that it returns one Data sheet with all needed columns. If you are trying to create feed which has many post types then you need to add component inside list item component and change that component’s state based on the post type (e.g. image, text, video etc.).

I’ll make a quick example about this later.


#3

Hey Antti. Makes sense. I took this path yesterday rebuilding the component to turn it based on states. So, depending on what you want to post, a different form will show up. The problem is that each one has its collection, how to do this. Leaving all inside the same collection would be a mess. Looking forward to see you exemple. Thank you


#4

Hi, i think this is a matter of Backend design. You can add each row into different collection but the Feed must contain all posts in one Data sheet if you’re planning to use React Studio’s list element.

Here’s an example: https://neonto.cloud/preview/gzedp55w

In the example I’ve nested component into List item component and I change its state based on the row type (image, status, video).


#5

Hey Antti. Yes, I see and It’s great for posts. I already doing this using states on the row type when it has a photo upload by the user. However, I was considering this was possible based on what you said in this thread - How to access datasheets from javascript functions (about creating the list based on several Data sheets. )

best, Marcos


#6

In that post I meant that it’s probably possible to create list based on many data sheets but it would require huge script hack and wouldn’t make any sense. Even in this case you’d need one Data sheet which is used as data source for the list element. This data sheet would be filled in script based on other Data sheets.

You should create the feed in backend and load it into one Data sheet in studio.


#7

Hello Antti. I’m back to this task trying to show different posts types in my feed project. A have a component with this script that supposedly should work, right?
I have restructured the database and now all posts are using the same data sheet [userPosts] with some shared columns and a field named TypePosts.

Am I missing something? Best, Marcos

var PostType = this.props.PostType
if (PostType == ‘type1’){return 0}
else if (PostType == ‘type2’){return 1}
else if (PostType == ‘type3’){return 2}
else if (PostType == ‘type4’){return 3}
else {return 4}
return input;

}

#8

Looks pretty ok but I’m usually simply referring to input value which in this case contains information about image path. If path exists then we show 1 else 0.


#9

Hi Antti. Yes, that what I am doing. But this is one parte of the picture. As images can say more than words, let me show how is structured…
please take a look. The image got blurred, but I guess you’ll understand.


#10

The image is quite blurry but I’d suggest simply to debug the code and especially what happens in the code when you debug the state script with Developer tools?


#11

Yes, and looking at the console, surprisingly everything looks fine. It turns out, I just realize that none of the managing states scripts, were working. interestingly, I went back to an earlier version and the scripts started working again. Anyway, let’s move on, I get from there, but it seems to be something related to what RS writes and “keeps”.
Example - last week, working another very simple screen, suddenly after some tweaking, it stopped responding as it should. With numerous attempts to fix the problem finally I gave up, threw it away and made a new one. Everything went back to work.

Thank you


#12

Hi, ok great that it works now!

Next time when you suspect this kind of behaviour just try to delete the exported code folder. This way React Studio has to write the whole code again. If it solves the issue then email us the exact details and steps so we can reproduce the issue.