Filament•2mo ago

Sending updates to livewire elements on database change

I've built a cart element using livewire that is attached to my top menu bar and am attempting to send real-time updates to the element to show when items are added or removed from the cart. My current method of deploying the element to the layout is with a render hook

->renderHook(
  PanelsRenderHook::USER_MENU_BEFORE, function () {
    $cart = Cart::get()->where('users_id', auth()->user()->id)->first();
    $user = User::get()->where('id', auth()->user()->id)->first();
    $count = !empty($cart) ? $cart->quantity : 0;
    if($user->can('create_payment::method'))
      return view('components.cart-icon', [
        'cartItems' => $cart->cartItems,
        'itemCount' => $count
      ]);
    return '';
})

->renderHook(
  PanelsRenderHook::USER_MENU_BEFORE, function () {
    $cart = Cart::get()->where('users_id', auth()->user()->id)->first();
    $user = User::get()->where('id', auth()->user()->id)->first();
    $count = !empty($cart) ? $cart->quantity : 0;
    if($user->can('create_payment::method'))
      return view('components.cart-icon', [
        'cartItems' => $cart->cartItems,
        'itemCount' => $count
      ]);
    return '';
})

This works for displaying items in the cart, but any changes from an action or from the cart itself do not display real-time changes, I'd like to change this behavior if I can. What is my best move forward? Thank you for your time

Solution:

Thank you for the comment, sorry for the delay, been a very busy week! I figured it out. I was already emitting updates, but it turns out my render function was not passing the updated variable (see below) in the livewire function. Adding it there fixed it immediately. Thanks for your feedback! ```public function render()...

Jump to solution

4 Replies

Dennis Koch•2mo ago

You could make this a Livewire component and then dispatch a Livewire event to fetch some updates when you update data related to the cart

Steve_OH•2mo ago

I’ve attempted that, was not successful. Can you provide a good resource to look at for this? My efforts don’t seem to be successful

Dennis Koch•2mo ago

I’ve attempted that, was not successful

Maybe share some code and tell us what didn't work. I mean for real time changes you need something like Websockets. Do you really need this? I think it's enough to update the cart when the current users updates stuff, right?

Solution

Steve_OH•2mo ago

public function render()
    {
        return view('livewire.cart', [
            'cart'      => $this->getCart(), // THIS WAS WHERE THE 
            'itemCount' => $this->itemCount  // ISSUE WAS
        ]);
    }

public function render()
    {
        return view('livewire.cart', [
            'cart'      => $this->getCart(), // THIS WAS WHERE THE 
            'itemCount' => $this->itemCount  // ISSUE WAS
        ]);
    }

Gaming

Programming

Sending updates to livewire elements on database change