I am new to the PHP and Laravel community, I am coming from Python and React :-). I have an issue here, I am trying to use the poll function dynamically, but this doesn't seem to be possible. I am using PHP 8.2.12 and Laravel 10.28.0.
Basically, what I want to do, I want to call the getAvailability function, on mount with timeInterval 180s. Then when I call the handleRebuildClick function, I want to reduce the poll time to 6s, Lastly when the $rebuildProgress is 100, I want to increase the poll time to 180s again.
Currently, when I call the function in mount, it works fine, then I click handleRebuildClick function and it reduces the time to 6s, but when the rebuildProgress is at 100, it correctly updates the $timeInterval variable, but the poll keeps running every 6s instead of the new 180s.
This is what I've tried: In my blade template:
<div>
<div class="flex content-between mb-4">
<button wire:click="handleSyncClick" class="bg-primary text-white text-xs w-1/2 py-2 rounded uppercase mr-2">
Sync Products
</button>
<div wire:poll.{{$timeInterval}}s='getAvailability' class="w-1/2">
@if ($rebuildAvailability || $rebuildProgress == 100)
<button wire:click="handleRebuildClick"
class="bg-primary text-white text-xs w-full py-2 rounded uppercase" id="rebuildButton">
Rebuild Feeds
</button>
@else
<button class="relative bg-gray-300 text-white py-2 px-4 w-full rounded">
<div class="overflow-hidden h-full text-xs flex rounded bg-gray-300 animate-progress">
<div style="width:50%;"
class="shadow-none flex flex-col text-center whitespace-nowrap text-white justify-center bg-gray-300 transition-all duration-500 ease-in-out">
<span>REBUILDING {{ $rebuildProgress }}%</span>
</div>
</div>
</button>
@endif
</div>
</div>
</div>
Then in my Component:
<?php
namespace App\Livewire;
use App\Common\Api;
class SyncButtons extends MyComponent
{
public $timeInterval = 180;
public $pollTime = "long";
public $loginStatus;
public $syncAvailablity = 1;
public $syncProgress = 0;
public $rebuildAvailability = true;
public $rebuildProgress = 0;
public function getAvailability()
{
if ($this->pollTime === "short" && $this->timeInterval === 6) {
$loginStatusResponse = Api::curl('user/get');
$syncAvailabilityResponse = Api::curl('store/get-sync-availability');
$rebuildAvailabilityResponse = Api::curl('store/get-rebuild-feeds-availability');
$this->loginStatus = $loginStatusResponse['code'];
$this->rebuildAvailability = $rebuildAvailabilityResponse['data']['available'];
$this->syncAvailablity = $syncAvailabilityResponse['data']['available'];
$this->rebuildProgress = $rebuildAvailabilityResponse['data']['percentage'];
if ($this->rebuildProgress == 100) {
$this->timeInterval = 180;
}
}
if ($this->pollTime === "long" && $this->timeInterval === 180) {
$loginStatusResponse = Api::curl('user/get');
$syncAvailabilityResponse = Api::curl('store/get-sync-availability');
$rebuildAvailabilityResponse = Api::curl('store/get-rebuild-feeds-availability');
$this->loginStatus = $loginStatusResponse['code'];
$this->rebuildAvailability = $rebuildAvailabilityResponse['data']['available'];
$this->syncAvailablity = $syncAvailabilityResponse['data']['available'];
$this->rebuildProgress = $rebuildAvailabilityResponse['data']['percentage'];
}
}
public function mount()
{
parent::mount();
$this->getAvailability();
}
public function handleRebuildClick()
{
if ($this->rebuildAvailability && $this->loginStatus == 1) {
$this->pollTime = "short";
$this->timeInterval = 6;
$this->rebuildProgress = 0;
$startRebuildResponse = Api::curl("store/start-rebuild-feeds");
$this->rebuildAvailability = $startRebuildResponse['data']['available'];
$this->rebuildProgress = $startRebuildResponse['data']['percentage'];
}
}
public function render()
{
return view('livewire.sync-buttons');
}
}
I have also attempted to use JS, but I am getting an infinite loop.