implement chat layout

This commit is contained in:
2026-05-01 00:56:34 +03:30
parent cde71d5761
commit ff86141fd6
5 changed files with 36 additions and 3 deletions

View File

@@ -2,3 +2,6 @@
command = "php" command = "php"
args = ["artisan", "boost:mcp"] args = ["artisan", "boost:mcp"]
cwd = "C:\\Users\\meghdad\\PhpstormProjects\\fluent-chat" cwd = "C:\\Users\\meghdad\\PhpstormProjects\\fluent-chat"
[mcp_servers.laravel-boost.tools.search-docs]
approval_mode = "approve"

View File

@@ -6,10 +6,12 @@ use App\Models\Conversation;
use Illuminate\Contracts\View\View; use Illuminate\Contracts\View\View;
use Illuminate\Support\Facades\Auth; use Illuminate\Support\Facades\Auth;
use Illuminate\Support\Facades\Gate; use Illuminate\Support\Facades\Gate;
use Livewire\Attributes\Layout;
use Livewire\Attributes\On; use Livewire\Attributes\On;
use Livewire\Attributes\Title; use Livewire\Attributes\Title;
use Livewire\Component; use Livewire\Component;
#[Layout('layouts::chat')]
#[Title('Chat')] #[Title('Chat')]
class ChatPage extends Component class ChatPage extends Component
{ {

View File

@@ -0,0 +1,26 @@
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}" class="dark">
<head>
@include('partials.head')
</head>
<body class="h-dvh overflow-hidden bg-zinc-100 text-zinc-950 antialiased dark:bg-zinc-950 dark:text-zinc-50">
<a
href="#chat-workspace"
class="sr-only focus:not-sr-only focus:fixed focus:left-4 focus:top-4 focus:z-50 focus:rounded-md focus:bg-white focus:px-3 focus:py-2 focus:text-sm focus:font-medium focus:text-zinc-950 focus:shadow-sm dark:focus:bg-zinc-900 dark:focus:text-white"
>
{{ __('Skip to chat') }}
</a>
<main id="chat-workspace" class="h-dvh p-0 sm:p-3 lg:p-4">
{{ $slot }}
</main>
@persist('toast')
<flux:toast.group>
<flux:toast />
</flux:toast.group>
@endpersist
@fluxScripts
</body>
</html>

View File

@@ -1,4 +1,4 @@
<section class="mx-auto flex h-[calc(100vh-5.5rem)] min-h-[620px] w-full max-w-[1600px] overflow-hidden rounded-lg border border-zinc-200 bg-white shadow-sm dark:border-zinc-700 dark:bg-zinc-950"> <section class="flex h-full min-h-0 w-full overflow-hidden border border-zinc-200 bg-white shadow-sm dark:border-zinc-800 dark:bg-zinc-950 sm:rounded-xl">
<aside <aside
@class([ @class([
'h-full w-full shrink-0 border-zinc-200 bg-zinc-50/80 dark:border-zinc-800 dark:bg-zinc-900/70 md:flex md:w-[22rem] lg:w-96', 'h-full w-full shrink-0 border-zinc-200 bg-zinc-50/80 dark:border-zinc-800 dark:bg-zinc-900/70 md:flex md:w-[22rem] lg:w-96',

View File

@@ -1,8 +1,8 @@
<?php <?php
use App\Livewire\Chat\ConversationList;
use App\Livewire\Chat\ConversationDetailsPanel; use App\Livewire\Chat\ConversationDetailsPanel;
use App\Livewire\Chat\ConversationHeader; use App\Livewire\Chat\ConversationHeader;
use App\Livewire\Chat\ConversationList;
use App\Livewire\Chat\ConversationView; use App\Livewire\Chat\ConversationView;
use App\Livewire\Chat\MessageComposer; use App\Livewire\Chat\MessageComposer;
use App\Models\Conversation; use App\Models\Conversation;
@@ -20,7 +20,9 @@ test('authenticated users can visit the chat dashboard', function () {
$this->actingAs($user) $this->actingAs($user)
->get(route('dashboard')) ->get(route('dashboard'))
->assertOk() ->assertOk()
->assertSee('Inbox'); ->assertSee('Inbox')
->assertDontSee('Repository')
->assertDontSee('Documentation');
}); });
test('conversation list only shows conversations the user participates in', function () { test('conversation list only shows conversations the user participates in', function () {