Rehydrate and preserve scroll

[DeTechDivus]

For some reason preserving scroll works only after second request. Lets say my page loads, on refresh or from other route and I click on the icon below to submit the form. It would scroll to top, then if I click again it won't scroll top it would stay as it is. If I have multiple icons and on first click it scrolls to the top, while on others it doesn't until I change page. I even try adding @preserveScroll('main') on the base level of splade...

@if (auth()->user() && in_array(auth()->id(), $club->favoriters->pluck('id')->toArray())) 
<x-splade-form method="POST" action="{{ route('favorite.destroy', $club) }}" stay @success="$splade.emit('favorite')" preserve-scroll>
  <font-awesome-icon @click.prevent="form.submit" class="text-xl cursor-pointer text-yellow-600" :icon="['fas', 'star']"/>
</x-splade-form>
@else
<x-splade-form method="POST" action="{{ route('favorite.store', $club) }}" stay @success="$splade.emit('favorite')" preserve-scroll>
  <font-awesome-icon @click.prevent="form.submit" class="text-xl cursor-pointer text-white" :icon="['far', 'star']"/>
</x-splade-form>
@endif

Do you think this is bug and I should switch to vue for this one, or is there a better way to do it? @pascalbaljet

[UPDATE]

I just did this:

<x-splade-rehydrate on="{{ 'favorite-' . $club->id }}">
<x-splade-data :default="['emit' => 'favorite-' . $club->id]">
@if (auth()->user() && in_array(auth()->id(), $club->favoriters->pluck('id')->toArray())) 
<x-splade-form method="POST" action="{{ route('favorite.destroy', $club) }}" stay @success="$splade.emit(data.emit)" preserve-scroll>
  <font-awesome-icon @click.prevent="form.submit" class="text-xl cursor-pointer text-yellow-600" :icon="['fas', 'star']"/>
</x-splade-form>
@else
<x-splade-form method="POST" action="{{ route('favorite.store', $club) }}" stay @success="$splade.emit(data.emit)" preserve-scroll>
  <font-awesome-icon @click.prevent="form.submit" class="text-xl cursor-pointer text-white" :icon="['far', 'star']"/>
</x-splade-form>
@endif
</x-splade-data>
</x-splade-rehydrate>

If you re-create this you can see that like it reloads that part on the first click while on second it just changes the icon.. But its less noticable and doesnt scroll to the top..