mirror of
https://github.com/tiennm99/coolify.git
synced 2026-08-20 06:23:23 +00:00
Andras Bacsai
5b517f21be
Add full-width and centered layout preferences across the app shell and workspaces. Replace page-size selects with dropdowns and add searchable breadcrumb switching.
82 lines
3.7 KiB
PHP
82 lines
3.7 KiB
PHP
<?php
|
|
|
|
it('renders the same compact profile trigger on all breakpoints', function () {
|
|
$menu = file_get_contents(resource_path('views/components/top-user-menu.blade.php'));
|
|
|
|
expect($menu)
|
|
->toContain('{{ $userInitial }}')
|
|
->toContain('aria-label="Account menu for {{ $userName }}"')
|
|
->not->toContain('sm:hidden')
|
|
->not->toContain('hidden sm:block max-w-[9rem]')
|
|
->not->toContain('sm:px-3');
|
|
});
|
|
|
|
it('still shows the user name and email inside the dropdown panel', function () {
|
|
$menu = file_get_contents(resource_path('views/components/top-user-menu.blade.php'));
|
|
|
|
expect($menu)
|
|
->toContain('truncate text-[13px] font-semibold text-black dark:text-fg">{{ $userName }}</div>')
|
|
->toContain('{{ $userEmail }}');
|
|
});
|
|
|
|
it('animates the dropdown panel when the user menu opens', function () {
|
|
$menu = file_get_contents(resource_path('views/components/top-user-menu.blade.php'));
|
|
$stylesheet = file_get_contents(resource_path('css/app.css'));
|
|
|
|
expect($menu)
|
|
->toContain('animate-in fade-in zoom-in-95 duration-150')
|
|
->toContain("'origin-bottom-left' => \$sidebar")
|
|
->toContain("'origin-top-right' => ! \$sidebar");
|
|
|
|
expect($stylesheet)->toContain('@import "tw-animate-css";');
|
|
});
|
|
|
|
it('positions the account menu below the mobile trigger', function () {
|
|
$menu = file_get_contents(resource_path('views/components/top-user-menu.blade.php'));
|
|
$stylesheet = file_get_contents(resource_path('css/app.css'));
|
|
|
|
expect($menu)->toContain('top-user-menu-panel');
|
|
expect($stylesheet)
|
|
->toContain('.listbox-panel.top-user-menu-panel')
|
|
->toContain('top: calc(100% + 0.25rem) !important;')
|
|
->toContain('transform: none !important;')
|
|
->toContain('max-height: calc(100dvh - 4.5rem) !important;');
|
|
});
|
|
|
|
it('changes appearance from a submenu instead of navigating to a separate page', function () {
|
|
$menu = file_get_contents(resource_path('views/components/top-user-menu.blade.php'));
|
|
|
|
expect($menu)
|
|
->toContain('appearanceOpen: false')
|
|
->toContain('@click.outside="open = false; appearanceOpen = false"')
|
|
->toContain("theme: localStorage.getItem('theme') === 'purple' ? 'custom' : (localStorage.getItem('theme') || 'dark')")
|
|
->toContain('setTheme(type, closeMenu = true)')
|
|
->toContain("this.setTheme('custom', false)")
|
|
->not->toContain('@change="appearanceOpen = false; open = false"')
|
|
->toContain('this.appearanceOpen = false;')
|
|
->toContain('this.open = false;')
|
|
->toContain('<div x-show="open" x-cloak @class([')
|
|
->not->toContain('<template x-if="open">')
|
|
->not->toContain('x-show.important="open"')
|
|
->not->toContain('<div x-show="open" x-cloak x-transition.opacity.duration.120ms')
|
|
->toContain("['value' => 'light', 'label' => 'Light'")
|
|
->toContain("['value' => 'system', 'label' => 'System'")
|
|
->toContain("['value' => 'dark', 'label' => 'Dark'")
|
|
->toContain('hover:bg-neutral-200 hover:text-neutral-950')
|
|
->not->toContain("route('profile.appearance')");
|
|
});
|
|
|
|
it('offers page width controls inside the appearance menu', function () {
|
|
$menu = file_get_contents(resource_path('views/components/top-user-menu.blade.php'));
|
|
|
|
expect($menu)
|
|
->toContain("pageWidth: localStorage.getItem('pageWidth') || 'full'")
|
|
->toContain("['value' => 'full', 'label' => 'Full width']")
|
|
->toContain("['value' => 'centered', 'label' => 'Centered']")
|
|
->toContain("@click=\"setWidth('{{ \$option['value'] }}')\"")
|
|
->toContain('Full width')
|
|
->toContain('Centered')
|
|
->toContain("localStorage.setItem('pageWidth', width)")
|
|
->toContain("new CustomEvent('page-width-changed', { detail: width })");
|
|
});
|