[SOLVED] How to work with List of Things in plugin editor? Throws a lot of errors! With link to app, JS code examples and screenshots

[vini_brito]

Hi! Having a lot of trouble working with a List of Things. I already successfully worked with a Thing and a List of Texts, but if I check that blessed “Is a list?” box… all goes haywire.

How can one work with a List of Things feeded into the element action field?

To provide more details, I’ve created an app just to isolate and troubleshoot this issue, here’s the link to it: sdfsfsdfsdf | Bubble Editor

And in this screenshot I show what I mean by working with List of Things in the plugin editor “element actions” section:

In case you’re not opening the app to see what happens and how, I’ve included these other screenshots from the app:

This is a basic and useless workflow that feeds the List of Thing to the plugin’s element action.

And this is the app meltdown shown in the console:

The app also shows the “we ran into temporary issues…” alert.

I’ve met this situation when working with a Thing, took a while to understand how to fully work with them and eventually I made sense of it being then able to properly handle a Thing, but in this case it goes haywire without even typing any code into the element action code box! Like this:

What have I tried so far:

In the plugin I’m working on, using .get() and .listProperties() works fine when I feed a Thing, I do it like this:

let support4 = properties.support4;  

console.log(support4.listProperties());  // Will list stuff for me
console.log(support4.get("Created Date"));  // Will return the date
console.log(support4.get("lista_de_texto_list_text"));  // Will return the list of texts (an array)

And I use this when I want to grab a Thing inside of another Thing’s field:

let getThingCeption = (firstThing, fieldOfTheFirstThing) => {
  	let returnedPropertyValue = firstThing.get(`${fieldOfTheFirstThing}`);
  	console.log(returnedPropertyValue.listProperties());
  	console.log(returnedPropertyValue.get("nome_text"));
	}

getThingCeption(support4, "Created By");   // will return the properties of the thing that is held by this field/property that belongs to the first object, in this example "support4" and also print the specified field. 

How in the world do I do anything with a List of Things?

@NigelG @levon @yusaney1 @jarrad @copilot tagged you guys because you’re my search reference here in the forums when I want to breakthrough an issue that is setting back progress for days!
Shoutout to Salar on Cobubble, or whoever made the plugin course, because that course was an awesome shortcut and skipped me a lot of headache!

[seanhoots]

When i run your demo page and look at the error in the console i see the following like:
Error: could not find plugin Value:list*

I haven’t delved into the issue but does this error message ring a bell for you?

[vini_brito]

Yeah! Actually that was the only message that made sense to me in all the error log.

I made sure that the field had value(s) in it by filling the List of Things with some Things through the Bubble app. Then in the plugin editor I tried to obtain these values using the built-in instructions that shows up in the “documentation” near the code box, to no avail.

Maybe a sample code that successfully works with the List of Things would help me. I tried to find in another open plugins but could not find.

[seanhoots]

For a list of Things, you will have to use the get function, with a start and length parameter as below:

get: function(start, length) - returns an array of objects starting from start (0 is first)

So if you define a property field as fieldly which is a list of any things, you will have to do this to get the values entered by the user.

var fieldy_values    
if(properties.fieldy != null){
        fieldy_values  = properties.fieldy.get(0,1000)
}

This fieldy_values will be a list of whatever type your thing was.

Edit:
You can use the length method to get the length of the field. e.g.

properties.fieldy.length

[vini_brito]

I think I’m a bit of a door today. I still can’t get it, even tried the code you supplied and tried modifying it but got the same issue. I thought we were supposed to work with a List of Things in the same way we work with a List of Texts.

Edit:
I can’t even get this to work:

var fieldy_values;
  
if(properties.fieldy != null){
        fieldy_values  = properties.fieldy.length();
  		console.log(fieldy_values);
}

It would show a number.

Wish I could just share an edit or view link to the plugin editor. The buttons to add someone as editor are greyed out, maybe because the test plugin is unpublished.

[seanhoots]

Ok i did some test for you and this is what i found.
Yes you’re right. Bubble always throws an error when you define a field of type List of any thing.
I haven’t really used the any thing type before so maybe i’m missing something.

But even if you don’t have any code at all in your action function, you will still get that error.
Try this.
Just create a field and make the type list of any thing. Don’t add any code at all.
In you test app just add a button and call that function. You will get the same error.

Unless someone knows whats going on i’m inclined to say this may be some bug.
Because when you use the get function as i explained above with any other list types like date, text ,etc it works.

So maybe consider filling a bug report if no one comes up with an explanation.

[vini_brito]

Thank you for your time! I initially filled this as a bug report, then got asked to bring it here first and if no solution arised, to bring it back to them so they could take another look. Will bring it back to them with a link to this thread and see what happens.

[levon]

@vini_brito you should definitely add @seanhoots and @mishav to the list of your search references when it comes to plugin building or anything else that is complex

[neerja]

Pushed a fix. Let us know if it helps.

[vini_brito]

It works just as expected! For more details:

console.log(properties.fieldy.length()); Successfully returned the number.

console.log(properties.fieldy.get(0, properties.fieldy.length())); Successfully returned an array containing an object linked to every item.

And…

let listOfThings = properties.fieldy.get(0, properties.fieldy.length());

let processOnEachItem = (element, index, array) => {
  			console.log(element.get("thing_name_text"))
}  
  
listOfThings.forEach(processOnEachItem);  

Successfully retrieved a field value within every and each Thing in the List of Things.

Now I can continue working on the plugin, thanks for the attention!
I’ll leave this thread as it is, maybe will be useful for new visitors.

And @levon thanks for the new references! I totally added them now!

[vini_pereira]

Bubble’s Plugin API has been updated to version 4, which is now using Node 18. This update means that the functions, including the built-in .length and .get methods, will now return values using promises instead of returning them directly.

As a result, the solution provided in this thread requires a minor modification to work properly. Both methods now need to use the await keyword to wait for a response:

console.log(await properties.fieldy.length());
console.log(await properties.fieldy.get(0, properties.fieldy.length()));

Reference: Updating to Plugin API v4 - Bubble Docs