@extends('layouts.public')

@section('title', 'Currently Supported Versions — SYSTRONICS')
@section('meta_description', 'Currently supported SYSTRONICS product versions for Sage 300, listed by product with compatible Sage 300 releases.')

@section('content')
    <nav class="crumbs" aria-label="Breadcrumb">
        <a href="{{ route('public.home') }}">Home</a><span>/</span>
        <a href="{{ route('public.products.index') }}">Products</a><span>/</span>
        <strong>Currently Supported Versions</strong>
    </nav>

    <div class="phead">
        <span class="eyebrow">Products</span>
        <h1>Currently Supported Versions</h1>
        <p class="lede">These are the SYSTRONICS shipping versions currently marked as supported. Each line shows the product code, product version, and the compatible Sage 300 version.</p>
    </div>

    <div class="toolstrip">
        <a class="tool" href="{{ route('public.products.index') }}">
            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" aria-hidden="true"><path d="M4 6h16M4 12h16M4 18h10"></path></svg>
            Product list
        </a>
        <a class="tool tool--active" href="{{ route('public.shipping-versions') }}" aria-current="page">
            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" aria-hidden="true"><path d="M8 6h13M8 12h13M8 18h13M3.5 6h.01M3.5 12h.01M3.5 18h.01"></path></svg>
            Supported versions
        </a>
        <a class="tool" href="{{ route('public.releases.index') }}">
            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" aria-hidden="true"><path d="M6 3.5h8L18 7.5v13H6V3.5Z"></path><path d="M13.6 3.5V8H18"></path></svg>
            Version releases
        </a>
    </div>

    <section class="section" id="supported">
        <div class="section-head section-head--ruled">
            <div>
                <span class="eyebrow">{{ $entries->count() }} {{ $entries->count() === 1 ? 'product' : 'products' }}</span>
                <h2 class="section-title">Supported shipping versions</h2>
            </div>
            <div class="section-links">
                <a href="{{ route('public.products.index') }}">All products →</a>
                <a href="{{ route('public.releases.index') }}">Version releases →</a>
            </div>
        </div>

        <div class="ship-head" aria-hidden="true">
            <span>Product</span>
            <span>Supported versions</span>
        </div>

        <div class="catalog catalog--list catalog--ship" style="margin-top:4px">
            @forelse ($entries as $entry)
                @php
                    $product = $entry['product'];
                    $code = strtolower($product->code);
                    $slogan = $productSlogans[$code] ?? '';
                    $title = \App\Domain\Catalog\Support\ProductMarketingCopy::catalogTitle($product->code, $product->name);
                    $href = route('public.products.show', $product).'#versions';
                @endphp
                <article class="cat-item ship-item">
                    <span class="icon-tile">
                        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#0F62FE" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3.5" y="4.5" width="17" height="15" rx="2"></rect><path d="M3.5 9h17M8 19.5V9"></path></svg>
                    </span>
                    <div class="ship-item-body">
                        <div>
                            <div class="cat-head">
                                <a class="cat-name" href="{{ $href }}">{{ $title }}</a>
                                <span class="badge">{{ strtoupper($product->code) }}</span>
                            </div>
                            @if ($slogan !== '')
                                <p class="cat-desc">{{ $slogan }}</p>
                            @endif
                        </div>
                        <ul class="ship-vers">
                            @foreach ($entry['versions'] as $row)
                                <li>{{ $row->shippingCode() }}</li>
                            @endforeach
                        </ul>
                    </div>
                </article>
            @empty
                <p class="lede" style="margin-top:18px">No currently supported versions are published yet.</p>
            @endforelse
        </div>
    </section>
@endsection