In laravel 11 / livewire 3 app in Dashboard component in $newsGroupedByNewsCategoryList array
I save groupped data which are read from db and show them in blade file. It works ok, but
now I want with any category group to add button,
clicking on it last 5 news of this group woul be shown below ths button. When I click on this button $newsGroupedByNewsCategoryList array is cleared and I do not understand why?
namespace AppLivewireAdmin;
class Dashboard extends Component
public $newsGroupedByNewsCategoryList;
public string $fetchedNewsCategoryContent = 'default fetchedNewsCategoryContent';
public function boot(LoggedUserInterface $loggedUserService)
$this->loggedUserService = $loggedUserService;
protected function retrieveDbData(): void
$newsTb = (new News)->getTable();
$this->newsGroupedByNewsCategoryList = News
::getByPublished(NewsPublishedEnum::PUBLISHED)
->groupBy('news_category_id')
->select($newsTb . '.news_category_id',
DB::raw('count(' . $newsTb . '.id) as news_count'))
->orderBy('news_count', 'desc')
->map(function ($newsItem) {
$newsCategory = NewsCategory::findOrFail($newsItem->news_category_id);
$newsItem->news_category_name = $newsCategory->name;
$newsItem->news_category_color = $newsCategory->color;
// Method to retrieve news category content
public function getFetchedNewsCategoryContent($newsCategoryId): bool
$this->fetchedNewsCategoryContent = ' getFetchedNewsCategoryContent::' . $newsCategoryId;
Log::info(varDump($this->fetchedNewsCategoryContent, ' -1 getFetchedNewsCategoryContent $this->fetchedNewsCategoryContent::'));
Log::info(varDump($this->newsGroupedByNewsCategoryList, ' -1 getFetchedNewsCategoryContent $this->newsGroupedByNewsCategoryList::'));
// CHECKING LOGS IN METHOD ABOVE I SEE THAT $newsGroupedByNewsCategoryList is empty !!!
public function render(): View
return view('livewire.admin.dashboard')->layout('components.layouts.admin');
// THIS METHOD IS NOT TRIGGERED
public function updated($property, $value)
<code><?php
namespace AppLivewireAdmin;
...
use AppModelsNews;
use LivewireComponent;
class Dashboard extends Component
{
public $newsGroupedByNewsCategoryList;
public string $fetchedNewsCategoryContent = 'default fetchedNewsCategoryContent';
...
public function boot(LoggedUserInterface $loggedUserService)
{
$this->loggedUserService = $loggedUserService;
}
public function mount()
{
$this->retrieveDbData();
}
protected function retrieveDbData(): void
{
$newsTb = (new News)->getTable();
$this->newsGroupedByNewsCategoryList = News
::getByPublished(NewsPublishedEnum::PUBLISHED)
->groupBy('news_category_id')
->select($newsTb . '.news_category_id',
DB::raw('count(' . $newsTb . '.id) as news_count'))
->orderBy('news_count', 'desc')
->get()
->map(function ($newsItem) {
$newsCategory = NewsCategory::findOrFail($newsItem->news_category_id);
$newsItem->news_category_name = $newsCategory->name;
$newsItem->news_category_color = $newsCategory->color;
return $newsItem;
});
}
// Method to retrieve news category content
public function getFetchedNewsCategoryContent($newsCategoryId): bool
{
$this->fetchedNewsCategoryContent = ' getFetchedNewsCategoryContent::' . $newsCategoryId;
Log::info(varDump($this->fetchedNewsCategoryContent, ' -1 getFetchedNewsCategoryContent $this->fetchedNewsCategoryContent::'));
Log::info(varDump($this->newsGroupedByNewsCategoryList, ' -1 getFetchedNewsCategoryContent $this->newsGroupedByNewsCategoryList::'));
return true;
}
// CHECKING LOGS IN METHOD ABOVE I SEE THAT $newsGroupedByNewsCategoryList is empty !!!
public function render(): View
{
return view('livewire.admin.dashboard')->layout('components.layouts.admin');
}
// THIS METHOD IS NOT TRIGGERED
public function updated($property, $value)
{
var_dump($property);
dd($value);
}
</code>
<?php
namespace AppLivewireAdmin;
...
use AppModelsNews;
use LivewireComponent;
class Dashboard extends Component
{
public $newsGroupedByNewsCategoryList;
public string $fetchedNewsCategoryContent = 'default fetchedNewsCategoryContent';
...
public function boot(LoggedUserInterface $loggedUserService)
{
$this->loggedUserService = $loggedUserService;
}
public function mount()
{
$this->retrieveDbData();
}
protected function retrieveDbData(): void
{
$newsTb = (new News)->getTable();
$this->newsGroupedByNewsCategoryList = News
::getByPublished(NewsPublishedEnum::PUBLISHED)
->groupBy('news_category_id')
->select($newsTb . '.news_category_id',
DB::raw('count(' . $newsTb . '.id) as news_count'))
->orderBy('news_count', 'desc')
->get()
->map(function ($newsItem) {
$newsCategory = NewsCategory::findOrFail($newsItem->news_category_id);
$newsItem->news_category_name = $newsCategory->name;
$newsItem->news_category_color = $newsCategory->color;
return $newsItem;
});
}
// Method to retrieve news category content
public function getFetchedNewsCategoryContent($newsCategoryId): bool
{
$this->fetchedNewsCategoryContent = ' getFetchedNewsCategoryContent::' . $newsCategoryId;
Log::info(varDump($this->fetchedNewsCategoryContent, ' -1 getFetchedNewsCategoryContent $this->fetchedNewsCategoryContent::'));
Log::info(varDump($this->newsGroupedByNewsCategoryList, ' -1 getFetchedNewsCategoryContent $this->newsGroupedByNewsCategoryList::'));
return true;
}
// CHECKING LOGS IN METHOD ABOVE I SEE THAT $newsGroupedByNewsCategoryList is empty !!!
public function render(): View
{
return view('livewire.admin.dashboard')->layout('components.layouts.admin');
}
// THIS METHOD IS NOT TRIGGERED
public function updated($property, $value)
{
var_dump($property);
dd($value);
}
In resources/views/livewire/admin/dashboard.blade.php :
<code><div class="grid gap-12 lg:grid-cols-2">
@foreach($newsGroupedByNewsCategoryList as $groupedNewsCategory)
<div class="flex border-{{ $groupedNewsCategory['news_category_color'] }} border-2 rounded-xl m-1 p-1">
<p class="mb-2 font-semibold" >{{ $groupedNewsCategory['news_category_name'] }}</p>
<div class="admin_main_color ">
<div class="flex max-h-9 d1">
<div class="flex flex-grow pl-2">
{{ $groupedNewsCategory['news_count'] }} news
<div class="w-16 align-items-end justify-end align-top m-0 p-1 d2">
<button wire:click="getFetchedNewsCategoryContent({{ $groupedNewsCategory['news_category_id'] }})">
{{ $fetchedNewsCategoryContent }}
<code><div class="grid gap-12 lg:grid-cols-2">
@foreach($newsGroupedByNewsCategoryList as $groupedNewsCategory)
<div class="flex border-{{ $groupedNewsCategory['news_category_color'] }} border-2 rounded-xl m-1 p-1">
<div>
<p class="mb-2 font-semibold" >{{ $groupedNewsCategory['news_category_name'] }}</p>
<div class="admin_main_color ">
<div class="flex max-h-9 d1">
<div class="flex flex-grow pl-2">
{{ $groupedNewsCategory['news_count'] }} news
</div>
<div class="w-16 align-items-end justify-end align-top m-0 p-1 d2">
<span class="d1">
<button wire:click="getFetchedNewsCategoryContent({{ $groupedNewsCategory['news_category_id'] }})">
</button>
</span>
</div>
</div>
{{ $fetchedNewsCategoryContent }}
</div>
</div>
</div>
@endforeach
</div>
</code>
<div class="grid gap-12 lg:grid-cols-2">
@foreach($newsGroupedByNewsCategoryList as $groupedNewsCategory)
<div class="flex border-{{ $groupedNewsCategory['news_category_color'] }} border-2 rounded-xl m-1 p-1">
<div>
<p class="mb-2 font-semibold" >{{ $groupedNewsCategory['news_category_name'] }}</p>
<div class="admin_main_color ">
<div class="flex max-h-9 d1">
<div class="flex flex-grow pl-2">
{{ $groupedNewsCategory['news_count'] }} news
</div>
<div class="w-16 align-items-end justify-end align-top m-0 p-1 d2">
<span class="d1">
<button wire:click="getFetchedNewsCategoryContent({{ $groupedNewsCategory['news_category_id'] }})">
</button>
</span>
</div>
</div>
{{ $fetchedNewsCategoryContent }}
</div>
</div>
</div>
@endforeach
</div>
I load data from mount method and do not understand why calling getFetchedNewsCategoryContent method array newsGroupedByNewsCategoryList becomes empty ?