Changing one thing in a custom state list

[chrismilleratx]

Hi everyone,

I can’t work this out and need a little help.

I have a multifile uploader that creates a list of files custom state as its output. I present those file names to the user so they have an option to change the file names before they are saved to the DB.

The RG group’s data source in the screenshot is the custom state. If/when a user changes the name of a file, I’d like to replace that file name in the custom state with the new edited file name. I’m out of ideas. IDs aren’t available, find and replace is a bust. I’m flummoxed:-)

Thanks, fam.

[chrismilleratx]

I’m close with find and replace but not quite there. This solution wipes out the file URLS for some reason.

[keith]

Right. Puzzlingly, the Expression Builder has no syntax for changing a value in a list. We can read a specific value at a specific index, using the :item # operator, but cannot write a new value there. We could build some complicated expressions to split the list at the nth value, :plus item a new value on the first part of the list and then :merge the split lists back together, but this is sort of crazy. Note also that doing this will remove any duplicate values in the list, which is not helpful if we’re dealing with something like a list of numbers.

That’s why I have features that do let you do this in some of my plugins. For example in List Shifter, the Custom List state and PROCESS List action allow you to do things like this. (Though this isn’t super easy to use).

So my Floppy plugin has a state called Floppy’s RAM List and all the associated actions you need to randomly access the list. Here’s a point in one of my videos about this where you can see the “Change RAM List” action being used to increment a specific value in a list:

Floppy Plugin for Bubble - Demo 5: Thoughts on RGs, List Math, Change RAM List Value and more.

Floppy thread here:

FLOPPY: Plugin for localStorage, sessionStorage, IndexedDB storage, List Creation/Manipulation, Iteration, and More! Now with even more video docs!

Hello Bubblers, it’s your old pal @keith back with a new plugin called Floppy… so of course, there’s a long, talky video that gives a basic overview. (Hooray, I guess?) Floppy is now available in the plugin store! Floppy plugin page here. Floppy is a multi-purpose plugin for reading and writing values to the browser’s storage, using the localStorage, sessionStorage, or IndexedDB interfaces (IndexedDB support leverages the localForage library). Unlike other storage plugins, Floppy supports near…

[chrismilleratx]

Awesome. Thanks, Keith! I recently began using LiftShifter and absolutely love it.

[chrismilleratx]

@keith I just bought Floppy. Is LiftShifter still needed? The product description for Floppy reads like it’s the paid version of LS plus a bunch of other stuff.

[keith]

Hey @chrismilleratx - first, thanks! Second: Well, while the Floppy element’s “RAM List” feature gives you access to some of the same list manipulation features as are implemented in List Shifter (in some cases they use exactly the same algorithms), they are pretty different beasts.

Floppy (again I’m talking about the RAM List feature) is simpler to use as it directly implements actions for adding, removing and changing items in the RAM List. You’d have to use List Shifter’s PROCESS List action to roll your own in List Shifter, and it’s not exactly easy to use PROCESS List. But conversely, there’s nothing like PROCESS List in Floppy.

The Floppy element has a different method for iterating with Bubble workflows (and I talk about how it’s different from List Shifter in the demo video about the various iteration features in Floppy).

There are also things in the Floppy collection like “Floppy Expression Watcher” which is a replacement for one of the most simple uses cases of List Shifter – the application where we just want to watch some list or scalar expression for changes by just reacting to the Initialized/Updated event that is triggered when field values change – well that’s all it does, it doesn’t have any of the other List Shifter stuff, so it’s far less code and more efficient.

But there’s stuff that List Shifter does that is more appropriate for List Shifter rather than Floppy (and vice-versa). Also there’s not a generic SORT function in Floppy (but there is a specialized one in the “Count Fields/Sort Action”). Edit: I guess I should also say, someday there might be a generic sort feature in Floppy (the plugin collection), but I really don’t want to do that until it’s possible in a client-side action which is really where such a capability belongs.

So they are just different things, but Floppy incorporates a lot of ideas from List Shifter and basically makes them easier to use for the most common applications.

As I say in the very first intro video, Floppy is not exactly “List Shifter Pro”, but depending on how you use List Shifter it might be perceived this way.

[chrismilleratx]

@keith I’m absolutely stuck and need your help, please. I viewed your video on changing to increment, but I’m not clear on how to swap/change something on a list.

My use case is the first post. Images come with file names and URLs. I have those in a RAM list. Before saving to the DB, I give users a chance to rename the files. If someone renames, I want to replace the original item in the list with the new named item in the list. For example:

1. Apple
2. Banana
3. Pear

User wants to rename Pear to Orange. How do I do this in a RAM list?

I think I want to use the Change RAM list action as you’ve indicated above, but I don’t understand how I identify the thing that needs to be changed in the Change RAM action and then replace it with the new edited thing.

Although I manage to change the file name, I can’t stop it from changing the URL to the file name. These need to be isolated. The original URL needs to be left alone. and the file name needs to be changed and reinserted back in the RAM list.

File should be a URL:

I’m sure this is something really simple that I’m overlooking.

Thanks

[keith]

Hi @chrismilleratx … oh boy… I think you misunderstand something about arrays in general and Bubble datatypes in particular.

First, what is a file in Bubble? A file in Bubble is represented by a string that represents where the file is located (the file’s URL). There is an object some_file whose location (URL) we know as some_file's URL.

For example (these are images and not files, but they are the same thing), here are some Sinatra’s that have an image on them (buried several levels down). The image’s URL are shown in this repeating group (highlighted):

Original Sinatra’s image is located at //s3.amazonaws.com/appforest/... etc. For reasons that don’t make much sense, Bubble omits the protocol, but Bubble will be Bubble. The fully-qualified URL to this image is https://s3.amazonaws.com/appforest/... etc. Now, please note, I can’t “change” that URL. It’s not writeable. It simply tells me where that image lives.

Second, can you “move” the file or image to some new URL by changing that string? No. That’s not a writeable property. The file is found where the file might be found.

If you were (and I’m not saying this is impossible) to be able to move a file to some different location, well, that would not be the same file. It would be a different file object, in vanilla Bubble.

Now, in your example (an array of strings, known in Bubble as a List of “texts”), we have three strings (["Apple", "Banana", "Pear"]). We can change these things because a text is mutable. If I do this, I’m not “changing its name”, I’m literally replacing it with a new string. This is what the Change RAM List action does – it changes (ex-changes or replaces some List item with another).

So, let’s say that Floppy’s RAM List is of type text and contains Apple, Banana, and Pear and I want to change the string “Banana” to “Keith”. Well, I can use the Change RAM List to either (1) change the item at index 2 (“Banana”) to the new string (“Keith”) using “Change by Index” or (2) find (all, first, last) instances of “Banana” and change them to “Keith” by changing the items “by value”. (That is, find all instances of Banana and change them to Keith, or change the first instance of Banana to Keith, or change the last instance of Banana to Keith), depending upon the Action’s settings.

Now, if my list is of a complex type, like a Thing or a file or an image or a date range or a numeric range or an Option, or an API response object, etc. my options are exactly the same: Replace (change) the item at some index by some other item of the same type, OR replace (all, first, last) item with some item of the same type.

For example, let’s say our list is a list of Favorite Things (a custom data type from my app), well, I can (1) take the Favorite Thing at some index and replace it with a different Favorite Thing, OR I can search for a given Favorite Thing and replace it with some other Favorite Thing “by value”, meaning that we scan the list for all occurrences of the Favorite Thing in question (the Thing we want to change), and then replace the first, all, or last instances of that Thing with the replacement value.

By doing this, we are not executing “Make Changes to a Thing”, we are just taking one Thing and changing it to another Thing.

Same would go for file objects: Replace the file located at “blah blah blah” with the file located at “yah yah yah”.

If I understand your question correctly (as @mikeloc would say). You can’t just change the URL of a file object. We can of course, substitute one file for another (using Change RAM List), but we can’t actually move a file by simply changing its URL field.

Now, it’s possible (though unlikely) that your file uploader element allows you to change filenames. However, in this case, you’d be holding a list of strings (texts) in Floppy’s RAM List and, if you changed one of these strings (using Change RAM List) you would then need to execute another step, which is: Tell your file uploader element that the user desires to change the filename previously known as [old_string_value] to [new_string_value].

And, if this were something possible (again, I don’t know that it is or isn’t in your case), we’d probably do it like: (1) tell the uploader thingy that old_string_value has changed to new_string_value and then (2) execute “Change RAM List Value(s)” to reflect that change in the Floppy’s RAM List (change the string old_string_value to the new string new_string_value].

This is a very long way of saying, none of this is magic. (Well, it is sort of magic compared to stupid vanilla Bubble where we can’t say, “take the value at the fifth index and change it to some new value” or “change all instances of ‘banana’ to ‘keith’”.) All we are we are doing is replacing some known value by some other known value. The replacement of the value doesn’t change the underlying item at the old location(s). We are simply saying, “change item_x to item_y”. Replacing item_x with item_y does not cause any fundamental change to item_x or item_y. It merely replaces them the one with the other.

I hope this makes sense.

[chrismilleratx]

Thanks, man. I totally get it, and I just realized everything you wrote not 15 minutes before you wrote it. I realized that files and images are saved as a long URL and file/image names are the tail end of that URL e.g. a friendlier version of tikimug.png in the first Sinatra pic.

I don’t actually want to change or move the Thing. I just wanted to change what it’s called. The same functionality that we have when we save a document to our computers and rename it before we hit save and tuck it into a folder. It’s the same image/file, you just maybe removed the extension or changed it from %tiki&mug.jpg to tikimug.jpg or tikimug.

I was hoping that I could use floppy to - in the Sinantra example - change the end of the long URL where the filename resides with something new - see above.

It seems like this would be possible, though. It seems like you could programmatically say that:

1. longurl/%tiki%mug.jpg has 12 characters from the first % to the g in jpg. Remove that and replace it with (new name) tikimug, giving you an end result of longurl/tikimug

Once I realized that the task was beyond me, I immediately hacked together another solution that is ugly, yet straightforward, and chalked it all up to learning.

I ended up adding a rename button in the RG, which I hate. I wonder if iterate could work here? (Learning about it)

The workflow then became:

I’ll tell you what, I know a hell of a lot about Floppy now. I went through all 300+ posts and several hours worth of videos at 2x speed:-) I have several other uses for it.

@keith