Laravel - How to post data variables from 2 separate livewire components to a single blade file for CRUD functionality?

[sahebyuvrajs]

Hey peeps, I wanted to post the variables initiated in the MenuItemList.php and SubCategoryList.php located in the App/Http/Livewire directory to a single blade file i.e. menu-item.blade.php . So I can further use the CRUD functionality for the above said tables i.e. menu-items and sub-categories from a single view, i.e. menu-item.blade.php .

When I run it through the different routes with separate views, it works flawlessly, but as soon as I try to combine them into one and try to view it all, in a single blade file, it gives me all sort of errors. Here is my source code. Please help me. Thanks already!

App\Models\MenuItem.php

<?php

namespace App\Models;

use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;

//Post
//MasterMenu
class MenuItem extends Model
{
    use HasFactory;

    protected $table = "menu_items";
    protected $fillable = ['sub_category_id', 'item_name', 'item_description'];
}

App\Http\Livewire\MenuItemList.php

<?php

namespace App\Http\Livewire;

use Livewire\Component;
use Livewire\WithPagination;
use App\Models\MenuItem;

class MenuItemList extends Component
{
    use WithPagination;

    public $search;
    public $itemId,$sub_category_id,$item_name,$item_description;
    public $isOpen = 0;

    public function render()
    {       
        $searchParams = '%'.$this->search.'%';

        return view('livewire.menu-item', [
            'menuitemlist' => MenuItem::where('item_name','like', $searchParams)->latest()->paginate(5)
        ]);
    }

    public function showModal() {
        $this->isOpen = true;
    }

    public function hideModal() {
        $this->isOpen = false;
    }

    public function store(){
        $this->validate(
            [   
                'sub_category_id' => 'required',
                'item_name' => 'required',
            ]
        );

        MenuItem::updateOrCreate(['id' => $this->itemId], [
            'sub_category_id' => $this->sub_category_id,
            'item_name' => $this->item_name,
            'item_description' => $this->item_description
        ]);

        $this->hideModal();

        session()->flash('info', $this->itemId ? 'Post Update Successfully' : 'Post Created Successfully' );

        $this->itemId = '';
        $this->sub_category_id = '';
        $this->item_name = '';
        $this->item_description = '';
    }

    public function edit($id){
        $menuitem = MenuItem::findOrFail($id);
        $this->itemId = $id;
        $this->sub_category_id = $menuitem->sub_category_id;
        $this->item_name = $menuitem->item_name;
        $this->item_description = $menuitem->item_description;

        $this->showModal();
    }

    public function delete($id){
        MenuItem::find($id)->delete();
        session()->flash('delete','Post Successfully Deleted');
    }
}

App\Models\SubCategory.php

<?php

namespace App\Models;

use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;

class SubCategory extends Model
{
    use HasFactory;

    protected $table = "sub_categories";
    protected $fillable = ['category_id', 'sub_category_name'];
}

App\Http\Livewire\SubCategoryList.php

<?php

namespace App\Http\Livewire;

use Livewire\Component;
use Livewire\WithPagination;
use App\Models\SubCategory;

class SubCategoryList extends Component
{
    use WithPagination;

    public $search;
    public $itemId,$category_id,$sub_category_name;
    public $isOpen = 0;

    public function render()
    {       
        $searchParams = '%'.$this->search.'%';

        return view('livewire.sub-category', [
            'subcategorylist' => SubCategory::where('sub_category_name','like', $searchParams)->latest()->paginate(5)
        ]);
    }

    public function showModal() {
        $this->isOpen = true;
    }

    public function hideModal() {
        $this->isOpen = false;
    }

    public function store(){
        $this->validate(
            [   
                'category_id' => 'required',
                'sub_category_name' => 'required',
            ]
        );

        SubCategory::updateOrCreate(['id' => $this->itemId], [
            'category_id' => $this->category_id,
            'sub_category_name' => $this->sub_category_name
        ]);

        $this->hideModal();

        session()->flash('info', $this->itemId ? 'Post Update Successfully' : 'Post Created Successfully' );

        $this->itemId = '';
        $this->category_id = '';
        $this->sub_category_name = '';
    }

    public function edit($id){
        $subcategory = SubCategory::findOrFail($id);
        $this->itemId = $id;
        $this->category_id = $subcategory->category_id;
        $this->sub_category_name = $subcategory->sub_category_name;

        $this->showModal();
    }

    public function delete($id){
        SubCategory::find($id)->delete();
        session()->flash('delete','Post Successfully Deleted');
    }
}

Routes\Web.php

<?php

use Illuminate\Support\Facades\Route;
use App\Http\Livewire\MenuItemList;
use App\Http\Livewire\SubCategoryList;

/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/

Route::get('/', function () {
    return view('welcome');
});

Route::get('/menu-item', MenuItemlist::class);
Route::get('/sub-category', SubCategorylist::class);

Route::middleware(['auth:sanctum', 'verified'])->get('/dashboard', function () {
    return view('dashboard');
})->name('dashboard');