Simplify NAS storage page — let package Connection tab own the UI

Removed the manual connection summary card now that the package widget
has a built-in Connection tab with a live test button and form fields.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
ghassan 2026-05-13 13:46:00 +03:00
parent 69ae56331a
commit 8a00bcecac

View File

@ -4,17 +4,7 @@
@section('extra_styles')
<style>
/* Tailwind-like resets needed for the NAS component (light-theme widget) */
.nas-wrapper * { box-sizing: border-box; }
/* brand-* color mappings for the NAS file manager component */
.nas-wrapper .bg-brand-600, .nas-wrapper .bg-brand-700 { background-color: #e61e1e !important; }
.nas-wrapper .text-brand-600, .nas-wrapper .text-brand-500 { color: #e61e1e !important; }
.nas-wrapper .ring-brand-500 { --tw-ring-color: #e61e1e !important; }
.nas-wrapper .hover\:bg-brand-700:hover { background-color: #c91a1a !important; }
.nas-wrapper .focus\:ring-brand-500:focus { --tw-ring-color: #e61e1e !important; }
.nas-wrapper .hover\:text-brand-600:hover { color: #e61e1e !important; }
.nas-wrapper .hover\:bg-brand-50:hover { background-color: rgba(230,30,30,.08) !important; }
.nas-wrapper .bg-brand-600.text-white { color: #fff !important; }
</style>
@endsection
@ -25,36 +15,6 @@
</h1>
</div>
{{-- Connection config summary --}}
<div class="adm-card" style="margin-bottom:20px;">
<div class="adm-card-header">
<span class="adm-card-title"><i class="bi bi-plug"></i> Connection</span>
<a href="{{ route('admin.settings') }}" class="adm-btn adm-btn-sm">
<i class="bi bi-gear"></i> Settings
</a>
</div>
<div class="adm-card-body" style="display:flex;gap:32px;flex-wrap:wrap;">
@php
$conn = config('nas-file-manager.connection');
$fields = [
'Protocol' => strtoupper($conn['protocol'] ?? '—'),
'Host' => $conn['host'] ?: '—',
'Port' => $conn['port'] ?: '—',
'Share' => $conn['smb_share'] ?: '—',
'Path' => $conn['path'] ?: '—',
'User' => $conn['username'] ?: '—',
];
@endphp
@foreach($fields as $label => $value)
<div>
<div style="font-size:11px;color:var(--text-2);text-transform:uppercase;letter-spacing:.5px;margin-bottom:3px;">{{ $label }}</div>
<div style="font-size:13px;font-weight:600;font-family:monospace;">{{ $value }}</div>
</div>
@endforeach
</div>
</div>
{{-- NAS File Manager component (Alpine.js + Tailwind) --}}
<div class="nas-wrapper">
@include('nas-file-manager::file-manager', [
'nodes' => $nodes,
@ -65,9 +25,7 @@
@endsection
@section('scripts')
<script src="https://cdn.jsdelivr.net/npm/@alpinejs/intersect@3.x.x/dist/cdn.min.js" defer></script>
<script src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js" defer></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/tailwindcss@3.4.1/base.min.css">
<script src="https://cdn.tailwindcss.com"></script>
<script>
tailwind.config = {