feat: templating blade dan mengubah overview attr

app/Livewire/Studio/Dashboard/Overview.php

@@ -2,12 +2,10 @@
 
 namespace App\Livewire\Studio\Dashboard;
 
-use Livewire\Attributes\Layout;
+use Livewire\Attributes\Title;
 use Livewire\Component;
 
-#[Layout('components.layouts.auth', [
-    'title' => 'Ringkasan',
-])]
+#[Title('Ringkasan')]
 class Overview extends Component
 {
     public function render()

resources/views/components/partials/studio/_header.blade.php

@@ -0,0 +1,34 @@
+<flux:header class="bg-zinc-50 dark:bg-zinc-900 border-b border-zinc-200 dark:border-zinc-700">
+    <flux:sidebar.toggle class="lg:hidden" icon="bars-2" />
+    <flux:brand href="javascript:void(0)" logo="{{ asset('assets/images/logo.png') }}" name="Yadi Parfum"
+        class="max-lg:hidden dark:hidden" />
+    <flux:brand href="javascript:void(0)" logo="{{ asset('assets/images/dark-logo.png') }}" name="Yadi Parfum"
+        class="max-lg:hidden! hidden dark:flex" />
+    <flux:spacer />
+    <flux:navbar class="me-4">
+        <flux:navbar.item icon="bell" href="javascript:void(0)" label="Notifikasi" />
+        <flux:navbar.item x-data x-on:click="$flux.dark = ! $flux.dark" href="javascript:void(0)">
+            <template x-if="$flux.dark">
+                <div class="flex items-center gap-2">
+                    <flux:icon name="sun" class="w-5 h-5" />
+                </div>
+            </template>
+
+            <template x-if="!$flux.dark">
+                <div class="flex items-center gap-2">
+                    <flux:icon name="moon" class="w-5 h-5" />
+                </div>
+            </template>
+        </flux:navbar.item>
+    </flux:navbar>
+    <flux:dropdown position="top" align="end">
+        <flux:avatar circle size="sm" src="https://unavatar.io/x/calebporzio" as="button" />
+        <flux:navmenu>
+            <flux:navmenu.item href="#" icon="cog">Pengaturan</flux:navmenu.item>
+            <flux:navmenu.item href="#" icon="paint-brush">Tema</flux:navmenu.item>
+            <flux:navmenu.item href="#" icon="chart-bar">Statistik</flux:navmenu.item>
+            <flux:menu.separator />
+            <flux:navmenu.item href="#" icon="arrow-right-start-on-rectangle">Keluar</flux:navmenu.item>
+        </flux:navmenu>
+    </flux:dropdown>
+</flux:header>

resources/views/components/partials/studio/_sidebar.blade.php

@@ -0,0 +1,19 @@
+<flux:sidebar sticky stashable
+    class="bg-zinc-50 dark:bg-zinc-900 border-r rtl:border-r-0 rtl:border-l border-zinc-200 dark:border-zinc-700">
+    <flux:sidebar.toggle class="lg:hidden" icon="x-mark" />
+    <flux:brand href="javascript:void(0)" logo="{{ asset('assets/images/logo.png') }}" name="Yadi Parfum"
+        class="px-2 dark:hidden" />
+    <flux:brand href="javascript:void(0)" logo="{{ asset('assets/images/dark-logo.png') }}" name="Yadi Parfum"
+        class="px-2 hidden dark:flex" />
+    <flux:navlist variant="outline">
+        <flux:navlist.item icon="squares-plus" href="{{ route('studio.dashboard.overview') }}"
+            :current="request()->routeIs('studio.dashboard.overview')" wire:navigate.hover>
+            Ringkasan</flux:navlist.item>
+        <flux:navlist.item icon="inbox" badge="12" href="#">Inbox</flux:navlist.item>
+        <flux:navlist.group expandable heading="Favorites" class="hidden lg:grid">
+            <flux:navlist.item href="#">Marketing site</flux:navlist.item>
+            <flux:navlist.item href="#">Android app</flux:navlist.item>
+            <flux:navlist.item href="#">Brand guidelines</flux:navlist.item>
+        </flux:navlist.group>
+    </flux:navlist>
+</flux:sidebar>

resources/views/livewire/studio/dashboard/overview.blade.php

@@ -1,3 +1,5 @@
-<div>
-    {{-- Care about people's approval and you will be their prisoner. --}}
-</div>
+<flux:main>
+    <flux:heading size="xl" level="1">Haloo, {{ auth()->user()?->employee?->full_name }}</flux:heading>
+    <flux:text class="mb-6 mt-2 text-base">Selamat datang di Studio Yadi Parfum.</flux:text>
+    <flux:separator variant="subtle" />
+</flux:main>