Remounting when LiveComponent is called inside stateless component LiveView

Questions & Help Questions
,
1

Hello, based on my understanding, the order of calling module in LiveView should be like this:

Live → Live Component → Stateless Component

I have a LiveView module that call a stateless component which has a Live Component inside itself; after changing parent state I mean LiveView module the Live Component mount is being reloaded instead of update function.

Is there any chance to force it not to load mount function?

Phoenix LiveView: 0.18.18
Phoenix: 1.7.0

Before seeing code, I have nested components in my project something like this:

<dashboard> // state less
  <layout>  // state less
    <setting> // state less
      <LiveComponentA>....</LiveComponentA> // LiveComponent
    </setting>
  </layout>
</dashboard>

LiveView module:

https://github.com/mishka-group/mishka_template_creator/blob/master/lib/mishka_template_creator_web/live/template_creator_live.ex#L6-L15

Stateless component

https://github.com/mishka-group/mishka_template_creator/blob/master/lib/mishka_template_creator/components/mishka_core_component.ex#L31-L36

And:

https://github.com/mishka-group/mishka_template_creator/blob/master/lib/mishka_template_creator/components/blocks/content.ex#L29-L37

And:

https://github.com/mishka-group/mishka_template_creator/blob/master/lib/mishka_template_creator/components/elements/layout.ex#L32

Live Component

https://github.com/mishka-group/mishka_template_creator/blob/master/lib/mishka_template_creator/components/blocks/settings.ex#L137-L141

Thank you in advance

2

The live component will always remount when its id is changed. You’re giving it a random ID, which means it remounts whenever the parent updates.

3

What a mistake I made, thinking that when the state changes, the component that generates random IDs is not called upon.
Many thanks

4

Taking a bullet for the rest of us. We are doing God’s work for developers not even born yet. :joy: