Why IconButton is Not Realtime change color when State is changed

[bobwatcherx]

I want to change the color of the Button icon where when one of the buttons is clicked it will change to what I want and if it is not selected then it will automatically change to the color I set
is there something wrong with me?
my code :

from flet import *

class User(UserControl):
    def __init__(self):
        super().__init__()
        self.index = Text("favorite")

    def updateIndex(self,e):
        location = e.control.icon
        print("location",location)
        self.index.value = location
        self.update()
        print(self.index.value)


    def build(self):
        return Column([
        Container(
            content=Row([
        IconButton(icon="favorite",
        icon_size=30,
        on_click=self.updateIndex,
        selected=True if self.index.value == "favorite" else False,
        style=ButtonStyle(color={"selected": "green400", "": "red300"})
             ),
        IconButton(icon="explore",
        icon_size=30,
        on_click=self.updateIndex,
        selected=True if self.index.value == "explore" else False,
        style=ButtonStyle(color={"selected": "green400", "": "red300"})
      
            ),


                ],alignment="spaceAround")
            )

            ])

        
def main(page:Page):
    page.update()
    user = User()
    page.add(user)
flet.app(target=main)

[asagarshinde]

try below

from flet import *


class User(UserControl):
    def __init__(self):
        super().__init__()
        self.index = Text("favorite")
        self.button1 = IconButton(icon="favorite",
                                  icon_size=30,
                                  on_click=self.updateIndex,
                                  selected=True if self.index.value == "favorite" else False,
                                  style=ButtonStyle(color=colors.GREEN)
                                  )
        self.button2 = IconButton(icon="explore",
                                  icon_size=30,
                                  on_click=self.updateIndex,
                                  selected=True if self.index.value == "explore" else False,
                                  style=ButtonStyle(color=colors.GREEN)

                                  )

    def toggle_button_color(self, button):
        if list(button.style.color.values())[0] == "red":
            button.style = ButtonStyle(color=colors.GREEN)
        else:
            button.style = ButtonStyle(color=colors.RED)

    def updateIndex(self, e):
        location = e.control.icon
        self.index.value = location
        if location == "favorite":
            self.toggle_button_color(self.button1)

        elif location == "explore":
            self.toggle_button_color(self.button2)
        self.update()

    def build(self):
        return Column([
            Container(
                content=Row([
                    self.button1,
                    self.button2
                ], alignment="spaceAround")
            ),
        ])


def main(page: Page):
    page.update()
    user = User()
    page.add(user)


flet.app(target=main)

[bobwatcherx]

can when clicked the color changes. and when another click the color returns to black. or the point is that it only changes color when clicked, other than that it still returns black