Merge pull request #1587 from hydephp/refactor-sidebar-data-handling

[2.x] Refactor sidebar data handling

Author: emmadesilva

_ide_helper.php

@@ -22,6 +22,11 @@
 /** @var string $routeKey The route key for the page being compiled/previewed */
 $routeKey = \Hyde\Support\Facades\Render::getRouteKey();
 
+// Variables available only to some page types
+
+/** @var \Hyde\Framework\Features\Navigation\DocumentationSidebar $sidebar */
+$sidebar = app('navigation.sidebar');
+
 // Facades (aliased in app/config.php)
 
 /** @mixin \Hyde\Foundation\HydeKernel */

config/docs.php

@@ -30,9 +30,8 @@
         // When using a grouped sidebar, should the groups be collapsible?
         'collapsible' => true,
 
-        // Should the sidebar footer be shown? You can also set this to a string
-        // of Markdown to show in the footer. Set to `false` to disable.
-        'footer' => true,
+        // A string of Markdown to show in the footer. Set to `false` to disable.
+        'footer' => '[Back to home page](../)',
 
         /*
         |--------------------------------------------------------------------------

packages/framework/resources/views/components/docs/sidebar-brand.blade.php

@@ -2,10 +2,10 @@
     <strong class="px-2">
         @if(DocumentationPage::home())
             <a href="{{ DocumentationPage::home() }}">
-                {{ config('docs.sidebar.header', 'Documentation') }}
+                {{  $sidebar->getHeader() }}
             </a>
         @else
-            {{ config('docs.sidebar.header', 'Documentation') }}
+            {{ $sidebar->getHeader() }}
         @endif
     </strong>
     <x-hyde::navigation.theme-toggle-button class="opacity-75 hover:opacity-100"/>

packages/framework/resources/views/components/docs/sidebar-footer-text.blade.php

@@ -1,7 +1 @@
-<p>
-    @if(is_bool(config('docs.sidebar.footer', true)))
-        <a href="{{ Hyde::relativeLink('index.html') }}">Back to home page</a>
-    @else
-        {{ Hyde::markdown(config('docs.sidebar.footer')) }}
-    @endif
-</p>
+{{ Hyde::markdown($sidebar->getFooter()) }}

packages/framework/resources/views/components/docs/sidebar-item.blade.php

@@ -1,4 +1,3 @@
-@php /** @var \Hyde\Framework\Features\Navigation\NavItem $item */ @endphp
 @props(['grouped' => false])
 <li @class(['sidebar-item -ml-4 pl-4', $grouped
         ? 'active -ml-8 pl-8 bg-black/5 dark:bg-black/10'
@@ -14,7 +13,7 @@
 
         @if(config('docs.sidebar.table_of_contents.enabled', true))
             <span class="sr-only">Table of contents</span>
-            {!! ($page->getTableOfContents()) !!}
+            {!! $page->getTableOfContents() !!}
         @endif
     @else
         <a href="{{ $item->getDestination() }}" @class([$grouped

packages/framework/resources/views/components/docs/sidebar-items.blade.php

@@ -1,4 +1,3 @@
-@php /** @var \Hyde\Framework\Features\Navigation\DocumentationSidebar $sidebar */ @endphp
 @if(! $sidebar->hasGroups())
     <ul id="sidebar-items" role="list" class="pl-2">
         @foreach ($sidebar->getItems() as $item)
@@ -7,16 +6,15 @@
     </ul>
 @else
     <ul id="sidebar-items" role="list">
-        @php ($collapsible = config('docs.sidebar.collapsible', true))
         @foreach ($sidebar->getItems() as $group)
-            <li class="sidebar-group" role="listitem" @if($collapsible) x-data="{ groupOpen: {{ $sidebar->isGroupActive($group->getIdentifier()) ? 'true' : 'false' }} }" @endif>
-                <header @class(['sidebar-group-header p-2 px-4 -ml-2 flex justify-between items-center', 'group hover:bg-black/10' => $collapsible]) @if($collapsible) @click="groupOpen = ! groupOpen" @endif>
-                    <h4 @class(['sidebar-group-heading text-base font-semibold', 'cursor-pointer dark:group-hover:text-white' => $collapsible])>{{ $group->getLabel() }}</h4>
-                    @if($collapsible)
+            <li class="sidebar-group" role="listitem" @if($sidebar->isCollapsible()) x-data="{ groupOpen: {{ $sidebar->isGroupActive($group->getIdentifier()) ? 'true' : 'false' }} }" @endif>
+                <header @class(['sidebar-group-header p-2 px-4 -ml-2 flex justify-between items-center', 'group hover:bg-black/10' => $sidebar->isCollapsible()]) @if($sidebar->isCollapsible()) @click="groupOpen = ! groupOpen" @endif>
+                    <h4 @class(['sidebar-group-heading text-base font-semibold', 'cursor-pointer dark:group-hover:text-white' => $sidebar->isCollapsible()])>{{ $group->getLabel() }}</h4>
+                    @if($sidebar->isCollapsible())
                         @include('hyde::components.docs.sidebar-group-toggle-button')
                     @endif
                 </header>
-                <ul class="sidebar-group-items ml-4 px-2 mb-2" role="list" @if($collapsible) x-show="groupOpen" @endif>
+                <ul class="sidebar-group-items ml-4 px-2 mb-2" role="list" @if($sidebar->isCollapsible()) x-show="groupOpen" @endif>
                     @foreach ($group->getChildren() as $item)
                         @include('hyde::components.docs.sidebar-item', ['grouped' => true])
                     @endforeach

packages/framework/resources/views/components/docs/sidebar.blade.php

@@ -3,11 +3,9 @@
         @include('hyde::components.docs.sidebar-brand')
     </header>
     <nav id="sidebar-navigation" class="p-2 overflow-y-auto border-y border-gray-300 dark:border-[#1b2533] h-full">
-        @include('hyde::components.docs.sidebar-items', [
-            'sidebar' => app('navigation.sidebar'),
-        ])
+        @include('hyde::components.docs.sidebar-items')
     </nav>
-    @if(config('docs.sidebar.footer', true) !== false)
+    @if($sidebar->hasFooter())
         <footer id="sidebar-footer" class="h-16 p-4 w-full bottom-0 left-0 text-center leading-8">
             @include('hyde::components.docs.sidebar-footer-text')
         </footer>

packages/framework/resources/views/layouts/docs.blade.php

@@ -8,7 +8,7 @@
 
     @include('hyde::components.skip-to-content-button')
     @include('hyde::components.docs.mobile-navigation')
-    @include('hyde::components.docs.sidebar')
+    @include('hyde::components.docs.sidebar', ['sidebar' => app('navigation.sidebar')])
 
     <main id="content" class="dark:bg-gray-900 min-h-screen bg-gray-50 md:bg-white absolute top-16 md:top-0 w-screen md:left-64 md:w-[calc(100vw_-_16rem)]">
         @include('hyde::components.docs.documentation-article')

packages/framework/src/Framework/Features/Navigation/DocumentationSidebar.php

@@ -4,11 +4,14 @@
 
 namespace Hyde\Framework\Features\Navigation;
 
+use Hyde\Facades\Config;
 use Hyde\Pages\DocumentationPage;
 use Hyde\Support\Facades\Render;
+use Illuminate\Contracts\Support\Arrayable;
 use Illuminate\Support\Str;
 
 use function app;
+use function is_string;
 
 class DocumentationSidebar extends NavigationMenu
 {
@@ -20,6 +23,42 @@ public static function get(): static
         return app('navigation.sidebar');
     }
 
+    public function __construct(Arrayable|array $items = [])
+    {
+        parent::__construct($items);
+    }
+
+    public function getHeader(): string
+    {
+        return Config::get('docs.sidebar.header', 'Documentation');
+    }
+
+    public function getFooter(): ?string
+    {
+        $option = Config::get('docs.sidebar.footer', '[Back to home page](../)');
+
+        if (is_string($option)) {
+            return $option;
+        }
+
+        if ($option === true) {
+            /** @deprecated Backwards compatibility */
+            return '[Back to home page](../)';
+        }
+
+        return null;
+    }
+
+    public function hasFooter(): bool
+    {
+        return $this->getFooter() !== null;
+    }
+
+    public function isCollapsible(): bool
+    {
+        return Config::getBool('docs.sidebar.collapsible', true);
+    }
+
     public function hasGroups(): bool
     {
         return $this->getItems()->contains(fn (NavItem $item): bool => $item->hasChildren());

packages/framework/src/Framework/Features/Navigation/NavItem.php

@@ -199,13 +199,17 @@ public function isCurrent(): bool
     /**
      * Add a navigation item to the children of the navigation item.
      */
-    public function addChild(NavItem $item): void
+    public function addChild(NavItem $item): static
     {
         // Todo: Ensure that the item has a group identifier by creating it from the label if it doesn't exist?
 
         $this->children[] = $item;
+
+        return $this;
     }
 
+    // Todo add method to add multiple children at once?
+
     protected static function normalizeGroupKey(?string $group): ?string
     {
         return $group ? Str::slug($group) : null;