Skip to content

feat(shell): add three-column application shell#30

Merged
ibourgeois merged 1 commit into
mainfrom
codex/4-app-shell
Apr 10, 2026
Merged

feat(shell): add three-column application shell#30
ibourgeois merged 1 commit into
mainfrom
codex/4-app-shell

Conversation

@ibourgeois
Copy link
Copy Markdown
Contributor

Summary

  • replace the default welcome page with a shared shell preview
  • add a reusable Blade layout component for toolbar, context nav, and main content
  • cover shell rendering with a focused feature test

Issue

Scope Check

  • This PR is limited to the issue scope
  • Unrelated changes were intentionally excluded

Validation

  • Tests added or updated when needed
  • Local verification completed

Notes

  • This establishes the shell only; theme tokens and shared UI primitives stay in later issues
  • The mobile behavior currently collapses into a stacked flow without interactive drawer logic yet

Copilot AI review requested due to automatic review settings April 10, 2026 05:24
@ibourgeois ibourgeois merged commit c60ae21 into main Apr 10, 2026
1 check passed
@ibourgeois ibourgeois deleted the codex/4-app-shell branch April 10, 2026 05:26
Copy link
Copy Markdown

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Introduces a reusable three-column “application shell” layout and replaces the default welcome page with a shell preview, establishing the baseline navigation/frame future apps will render inside.

Changes:

  • Swapped the root route to render a new home view and named it home.
  • Added a reusable Blade layout component (app-shell) implementing toolbar, context navigation, and main content regions.
  • Added a focused feature test to verify the shell preview renders.

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 5 comments.

File Description
routes/web.php Routes / to the new home shell preview and names it home.
resources/views/home.blade.php Adds a shell preview page with example toolbar/context items and placeholder content.
resources/views/components/layouts/app-shell.blade.php Implements the shared 3-column application shell layout component.
tests/Feature/Shell/HomeShellTest.php Adds feature coverage asserting the shell preview renders expected regions/items.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment on lines +15 to +19
<link rel="preconnect" href="https://fonts.bunny.net">
<link href="https://fonts.bunny.net/css?family=instrument-sans:400,500,600" rel="stylesheet" />

@if (file_exists(public_path('build/manifest.json')) || file_exists(public_path('hot')))
@vite(['resources/css/app.css', 'resources/js/app.js'])
Comment on lines +54 to +58
'bg-white/12 text-white' => $item['current'] ?? false,
'text-gray-300 hover:bg-white/8 hover:text-white' => ! ($item['current'] ?? false),
])
>
<span class="flex size-9 items-center justify-center rounded-lg bg-white/8">
Comment on lines +41 to +42
class="flex size-10 items-center justify-center rounded-lg bg-white/10 text-white lg:hidden"
aria-label="Open navigation"
Comment on lines +48 to +60
<nav aria-label="Applications" class="mt-4 flex gap-2 overflow-x-auto lg:mt-0 lg:flex-1 lg:flex-col lg:items-center">
@foreach ($toolbarItems as $item)
<a
href="{{ $item['href'] ?? '#' }}"
@class([
'flex min-w-16 flex-col items-center gap-2 rounded-lg px-2 py-3 text-center text-[0.7rem] transition-colors',
'bg-white/12 text-white' => $item['current'] ?? false,
'text-gray-300 hover:bg-white/8 hover:text-white' => ! ($item['current'] ?? false),
])
>
<span class="flex size-9 items-center justify-center rounded-lg bg-white/8">
<x-dynamic-component :component="$item['icon']" class="size-5" />
</span>
Comment on lines +83 to +95
@foreach ($contextItems as $item)
<li>
<a
href="{{ $item['href'] ?? '#' }}"
@class([
'flex items-center gap-3 rounded-lg px-3 py-2.5 text-sm transition-colors',
'bg-gray-100 font-medium text-gray-950 dark:bg-gray-800 dark:text-white' => $item['current'] ?? false,
'text-gray-600 hover:bg-gray-100 hover:text-gray-950 dark:text-gray-300 dark:hover:bg-gray-800 dark:hover:text-white' => ! ($item['current'] ?? false),
])
>
<span class="flex size-8 items-center justify-center rounded-lg bg-gray-100 text-gray-500 dark:bg-gray-800 dark:text-gray-300">
<x-dynamic-component :component="$item['icon']" class="size-4" />
</span>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

feat(shell): create application shell and navigation architecture

2 participants