@extends('components.layouts.app')

@section('content')
<div class="">
    <main>
        <div class="w-full px-4 pb-60">
            <div
                class="grid items-start max-w-2xl grid-cols-1 grid-rows-1 gap-4 mx-auto lg:mx-0 lg:max-w-none lg:grid-cols-2">

                <div class="grid gap-4 col-span-1">
                    <div class="grid gap-6 p-4 bg-white rounded-lg shadow ring-1 ring-stone-300">
                        <div>
                            <h2 class="flex justify-between leading-6 text-stone-700">
                                <div class="flex items-center mb-2 text-sm leading-6 text-stone-400">
                                    Haberler
                                </div>
                            </h2>
                            <div class="flex flex-wrap gap-2">
                                <!-- EDİTÖR MASASI -->
                                <x-main-button name="EDİTÖR MASASI"
                                    count="{{ $publishedNewsCount + $draftNewsCount + $archivedNewsCount }}"
                                    route="{{ route('editors-desk') }}" icon="desk" color="stone" unit="HABER"
                                    data="HABERLER İÇİN TÜM EDİTORYAL İŞLEMLERİ GERÇEKLEŞTİRİN" w='60' class='' />
                                <!-- YAYINDA -->
                                <x-main-button name="YAYINDA" count="{{ $publishedNewsCount }}"
                                    route="{{ route('published-news') }}" icon="done_all" color="teal" unit="HABER"
                                    data="TÜM YAYINLANAN HABERLERİ LİSTELEYİN" w='60' class='' />
                                <!-- BEKLEYENLER -->
                                <x-main-button name="BEKLİYOR" count="{{ $draftNewsCount }}" route="#" icon="pause"
                                    color="amber" unit="HABER" data="" w='60' class='' />
                                <!-- ARŞİVLENEN -->
                                <x-main-button name="ARŞİVLENDİ" count="{{ $archivedNewsCount }}" route="#"
                                    icon="archive" color="rose" unit="HABER" data="" w='60' class='' />
                            </div>
                        </div>

                        <div>
                            <h2 class="flex justify-between leading-6 text-stone-700">
                                <div class="flex items-center mb-2 text-sm leading-6 text-stone-400">
                                    Entegrasyonlar
                                </div>
                            </h2>
                            <div class="flex flex-wrap gap-2">
                                <x-main-button name="ENTEGRASYONLAR" count="" route="#" icon="electrical_services"
                                    color="stone" unit="GÖZ AT" data="ENTEGRASYON AYARLARI" w='60' class='' />
                            </div>
                        </div>

                        <div>
                            <h2 class="flex justify-between leading-6 text-stone-700">
                                <div class="flex items-center mb-2 text-sm leading-6 text-stone-400">
                                    Yapay Zeka
                                </div>
                            </h2>
                            <div class="flex flex-wrap gap-2">
                                <x-main-button name="PLANLANMIŞ" count="" route="{{ route('planned-commands') }}"
                                    icon="automation" color="stone" unit="GÖZ AT" data="KOMUTLAR" w='60' class='' />
                            </div>
                        </div>

                    </div>
                </div>

                <div class="grid gap-4 col-span-1">

                    <div class="p-4 bg-white rounded-lg shadow ring-1 ring-stone-300">
                        <div class="">
                            <ul role="list w-full">
                                <livewire:news-card />
                            </ul>
                        </div>
                    </div>

                </div>
            </div>
    </main>
</div>
@endsection

@section('scripts')
@endsection