How to create a separate Favorite button system for each Category in Kodular?

Hello everyone, :folded_hands:

I’m facing an issue in my app, and I need your help.

My app has 10 categories — for example: data1, data2, data3, etc.

When I click on any category, it opens the Show screen where all items (shayari/data) of that category are displayed in a ListView.

Each item has a Favorite (Heart) button below it.
When I click on that button, the button color changes from blue to red, and it gets saved in TinyDB — this part works fine.

But the problem is —
If I open data1 and favorite a few items, then go back and open data2,
the buttons at the same positions in data2 also appear red automatically :cross_mark: even though I didn’t click them.

I don’t want this behavior.

Here’s what I actually want:

  1. Each category should have its own separate Favorite data.

  2. Only the items I favorite inside a particular category should appear red.

  3. When I open another category, all buttons should remain default (blue) until I manually click them.

  4. When I reopen the same category’s Show screen, the previously saved Favorites from TinyDB should appear red again.

I’m currently using these events:

Screen Initialize

On Bind View

Favorite Button Click

I want to know:

How to save category-wise Favorite data in TinyDB (how should I name the tags)?

Which variables should be used to keep Favorite states separate for each category?

And how to restore the Favorite state properly when reopening the Show screen?

If anyone can explain with example blocks or a short demo, it would be really helpful :folded_hands:

Thanks in advance :heart:

Hi,

I’d recommend using a single dictionary with the category names as keys and the favorites list as values.

blocks (11)

Alternatively, if you plan to include other information inside it, create a key called favourites and place the list there.

If the data is structured correctly, during the list generation with the RecyclerList, only the favorite items will be changed to red.

The answer from point 2 still applies if the data is structured and retrieved correctly, it would work exactly like that.

Well, if you follow my advice, you’d just need to save the dictionary in TinyDB every time something is added/removed from the favorites.

Can you share the .aia file? Or would you rather not?

1 Like

marathi charoli.aia (689.6 KB)

Perfect.
If you don’t want to completely change your data structure, I recommend using the raw timestamp (e.g., 1760000606000) to save the list keys.

This way, you can use it as a unique key (or generate one yourself) and store it in TinyDB when an item is added to the favorites.
Then, when you create the list, you can check whether that key is present in the favorites and color it red.

If the app doesn’t have much traffic, you could also just save the key (the formatted date) in a list (in tinyDB) and then check in OnBindView whether it’s present.

1 Like

Currently the app is in development, so the data is not saved, my goal is that when I click on a category, and go inside, that is, to another screen, after clicking on the button in the list, that button should become red, then when I go inside that category again, the color of that button should appear red instead of black, and the button should be red in the same text, under the text on which I clicked the button, if I click on a new category, I don’t want the button in that position to be red, until I click on it

So, when you click the save button, store the item’s timestamp in a list in TinyDB, and when the list is generated in OnBindView, check if that timestamp is present (if in list set bgColor to red).
Sorry, I’m not sure how detailed I should be, do you need a more specific explanation?

Yes, more comprehensive.

To avoid drastically changing your data structure, I tried to keep as much of what you had done as possible.
Let me know if you need an explanation or if it’s already clear on its own.

marathi_charoli.aia (688.8 KB)

1 Like

Thanks for solving a complicated problem, you are most welcome :smiling_face_with_three_hearts::smiling_face_with_three_hearts::smiling_face_with_three_hearts::smiling_face_with_three_hearts:

Well im glad :partying_face:!

Have a nice day!

2 Likes

There seems to be a problem, where to add this block?

What data do you need to save to the clipboard?
The text that was added to favorites?

Because I am going to add more buttons to it, copy button, share button, how to remove the text from the list for that,

It would be optimal to do a replace all mappings as soon as you get the data from Firebase, so that you can then work with already cleaned data.

1 Like

click the red cross and read the errorr message

the local variable id is not valid here
Taifun

1 Like