namespace App\Http\Controllers;

use App\Services\GraphqlService;

class ProductController extends Controller
{
    protected $graphqlService;

    public function __construct(GraphqlService $graphqlService)
    {
        $this->graphqlService = $graphqlService;
    }

    public function index()
    {
        $query = <<<GQL
            query {
              products {
                name
                description
                slug
                availability
                imageUrl
              }
            }
            GQL;

        $data = $this->graphqlService->query($query);

        // Pass the data to your Blade view
        return view('products.index', ['products' => $data['data']['products']]);
    }
}

{{-- resources/views/products/index.blade.php --}}

@extends('layouts.app')

@section('content')
  <div class="container">
    @if (count($products) > 0)
      <div class="row">
        @foreach ($products as $product)
          <div class="col-md-4">
            <div class="card mb-4 shadow-sm">
              <img class="card-img-top" src="{{ $product['imageUrl'] }}" alt="{{ $product['name'] }}">
              <div class="card-body">
                <h5 class="card-title">{{ $product['name'] }}</h5>
                <p class="card-text">{{ $product['description'] }}</p>
                <div class="d-flex justify-content-between align-items-center">
                  <small class="text-muted">{{ $product['availability'] ? 'Available' : 'Not Available' }}</small>
                  <a href="{{ url('/products/' . $product['slug']) }}" class="btn btn-primary">View Product</a>
                </div>
              </div>
            </div>
          </div>
        @endforeach
      </div>
    @else
      <p>No products found.</p>
    @endif
  </div>
@endsection