Skip to content

Commit e55871c

Browse files
committed
Init custom navigation maker
1 parent 79e5ece commit e55871c

24 files changed

+1378
-142
lines changed
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,118 @@
1+
<?php
2+
3+
namespace App\Http\Controllers\Admin\Settings;
4+
5+
use App\Http\Controllers\Controller;
6+
use App\Models\CustomPage;
7+
use App\Settings\NavigationSettings;
8+
use Illuminate\Http\Request;
9+
use Inertia\Inertia;
10+
11+
class NavigationSettingController extends Controller
12+
{
13+
public function __construct()
14+
{
15+
$this->middleware(['can:update settings']);
16+
}
17+
18+
public function show(NavigationSettings $settings)
19+
{
20+
// All public routes which we want to show in the navigation
21+
$availableNavItems = [
22+
[
23+
'type' => 'route',
24+
'name' => 'Home',
25+
'title' => 'Home',
26+
'route' => 'home',
27+
'key' => 'home',
28+
],
29+
[
30+
'type' => 'component',
31+
'name' => 'Search Box',
32+
'title' => 'Search Box',
33+
'component' => 'Search',
34+
'key' => 'search',
35+
],
36+
[
37+
'type' => 'component',
38+
'name' => 'App Icon',
39+
'title' => 'App Icon',
40+
'component' => 'AppIcon',
41+
'key' => 'app-icon',
42+
],
43+
[
44+
'type' => 'component',
45+
'name' => 'Theme Switcher',
46+
'title' => 'Theme Switcher',
47+
'component' => 'ThemeSwitcher',
48+
'key' => 'theme-switcher',
49+
],
50+
[
51+
'type' => 'component',
52+
'name' => 'Profile Section',
53+
'title' => 'Profile Section',
54+
'component' => 'ProfileSection',
55+
'key' => 'profile-section',
56+
],
57+
[
58+
'type' => 'dropdown',
59+
'name' => 'Dropdown',
60+
'title' => 'Dropdown',
61+
'key' => 'dropdown',
62+
'children' => []
63+
]
64+
];
65+
66+
// Custom pages
67+
$customPageItems = CustomPage::select(['id', 'title', 'path'])->get();
68+
foreach ($customPageItems as $item) {
69+
$availableNavItems[] = [
70+
'type' => 'custom-page',
71+
'name' => $item->title,
72+
'title' => $item->title,
73+
'id' => $item->id,
74+
'route' => 'custom-page.show',
75+
'route_params' => [
76+
'path' => $item->path,
77+
],
78+
'key' => 'custom-page-' . $item->id,
79+
];
80+
}
81+
82+
return Inertia::render('Admin/Setting/NavigationSetting', [
83+
'settings' => $settings->toArray(),
84+
'availableNavItems' => $availableNavItems,
85+
]);
86+
}
87+
88+
public function update(Request $request, NavigationSettings $settings)
89+
{
90+
$request->validate([
91+
'enable_custom_navbar' => 'required|boolean',
92+
'custom_navbar_data' => 'nullable|array',
93+
]);
94+
95+
$navbarData = $request->input('custom_navbar_data');
96+
97+
// Check in array if we have a dropdown type inside of a dropdown type then we give error
98+
foreach ($navbarData as $sideList) {
99+
foreach ($sideList as $item) {
100+
if ($item['type'] === 'dropdown') {
101+
foreach ($item['children'] as $child) {
102+
if ($child['type'] === 'dropdown') {
103+
return redirect()->back()
104+
->with(['toast' => ['type' => 'error', 'title' => __('You can not add a dropdown inside of a dropdown')]]);
105+
}
106+
}
107+
}
108+
}
109+
}
110+
111+
112+
$settings->enable_custom_navbar = $request->input('enable_custom_navbar');
113+
$settings->custom_navbar_data = $navbarData;
114+
$settings->save();
115+
return redirect()->back()
116+
->with(['toast' => ['type' => 'success', 'title' => __('Navigation Settings Updated Successfully')]]);
117+
}
118+
}

Diff for: app/Settings/NavigationSettings.php

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<?php
2+
3+
namespace App\Settings;
4+
5+
use Spatie\LaravelSettings\Settings;
6+
7+
class NavigationSettings extends Settings
8+
{
9+
public bool $enable_custom_navbar;
10+
public array $custom_navbar_data;
11+
12+
public static function group(): string
13+
{
14+
return 'navigation';
15+
}
16+
}

Diff for: app/View/Components/PhpVarsToJsTransformer.php

+16-1
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@
22

33
namespace App\View\Components;
44

5+
use App\Models\CustomPage;
6+
use App\Settings\NavigationSettings;
57
use Illuminate\View\Component;
68

79
class PhpVarsToJsTransformer extends Component
@@ -20,8 +22,21 @@ public function render()
2022
"VITE_PUSHER_APP_CLUSTER" => config("broadcasting.connections.pusher._pusher_app_cluster"),
2123
];
2224

25+
$navbar = $this->generateCustomNavbarData();
26+
2327
return view('components.php-vars-to-js-transformer', [
24-
'pusher' => $pusher
28+
'pusher' => $pusher,
29+
'customnav' => $navbar
2530
]);
2631
}
32+
33+
private function generateCustomNavbarData()
34+
{
35+
$navbarSettings = app(NavigationSettings::class);
36+
$customNavbarEnabled = $navbarSettings->enable_custom_navbar;
37+
return [
38+
'enabled' => $customNavbarEnabled,
39+
'data' => $customNavbarEnabled ? $navbarSettings->custom_navbar_data : [],
40+
];
41+
}
2742
}

Diff for: config/settings.php

+2-1
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
\App\Settings\PluginSettings::class,
1212
\App\Settings\ThemeSettings::class,
1313
\App\Settings\PlayerSettings::class,
14+
\App\Settings\NavigationSettings::class,
1415
],
1516

1617
/*
@@ -59,7 +60,7 @@
5960
'global_casts' => [
6061
DateTimeInterface::class => Spatie\LaravelSettings\SettingsCasts\DateTimeInterfaceCast::class,
6162
DateTimeZone::class => Spatie\LaravelSettings\SettingsCasts\DateTimeZoneCast::class,
62-
Spatie\DataTransferObject\DataTransferObject::class => Spatie\LaravelSettings\SettingsCasts\DtoCast::class,
63+
// Spatie\DataTransferObject\DataTransferObject::class => Spatie\LaravelSettings\SettingsCasts\DtoCast::class,
6364
],
6465

6566
/*
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<?php
2+
3+
use Spatie\LaravelSettings\Migrations\SettingsMigration;
4+
5+
class CreateNavigationSettings extends SettingsMigration
6+
{
7+
public function up(): void
8+
{
9+
$this->migrator->add('navigation.enable_custom_navbar', false);
10+
$this->migrator->add('navigation.custom_navbar_data', []);
11+
}
12+
}

Diff for: docker-compose.yml

+2-2
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,11 @@ version: '3'
33
services:
44
laravel.test:
55
build:
6-
context: ./vendor/laravel/sail/runtimes/8.0
6+
context: ./vendor/laravel/sail/runtimes/8.1
77
dockerfile: Dockerfile
88
args:
99
WWWGROUP: '${WWWGROUP}'
10-
image: sail-8.0/app
10+
image: sail-8.1/app
1111
ports:
1212
- '${APP_PORT:-80}:80'
1313
environment:

Diff for: package-lock.json

+34
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

Diff for: package.json

+1
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,7 @@
4242
"vue-datepicker-next": "^1.0.2",
4343
"vue-multiselect": "^3.0.0-alpha.2",
4444
"vue-tippy": "^6.0.0-alpha.63",
45+
"vuedraggable": "^4.1.0",
4546
"xterm": "^4.19.0",
4647
"xterm-addon-attach": "^0.6.0",
4748
"xterm-addon-fit": "^0.5.0",

Diff for: resources/js/Components/Navigation/AppLogoMark.vue

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
<template>
2+
<div class="flex items-center flex-shrink-0">
3+
<InertiaLink :href="route('home')">
4+
<JetApplicationMark class="block w-auto h-9" />
5+
</InertiaLink>
6+
<button
7+
v-if="canShowAdminSidebar"
8+
v-tippy
9+
:title="__('Administration Section')"
10+
aria-label="Open Menu"
11+
class="ml-2 focus:outline-none"
12+
@click="emit('open-admin-sidebar')"
13+
>
14+
<Icon
15+
name="cog"
16+
class="w-6 h-6 text-gray-400 dark:text-gray-500 hover:animate-spin"
17+
/>
18+
</button>
19+
</div>
20+
</template>
21+
22+
<script setup>
23+
import { defineProps } from 'vue';
24+
import JetApplicationMark from '@/Jetstream/ApplicationMark.vue';
25+
import Icon from '@/Components/Icon.vue';
26+
import { InertiaLink } from '@inertiajs/inertia-vue3';
27+
28+
const emit = defineEmits(['open-admin-sidebar']);
29+
30+
defineProps({
31+
canShowAdminSidebar: {
32+
type: Boolean,
33+
default: false,
34+
},
35+
});
36+
</script>
+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<template>
2+
<ColorThemeToggle
3+
v-if="$page.props.user"
4+
class="items-center justify-center hidden space-x-8 md:ml-8 md:flex"
5+
/>
6+
</template>
7+
8+
<script>
9+
import ColorThemeToggle from '@/Components/ColorThemeToggle.vue';
10+
11+
export default {
12+
components: {ColorThemeToggle}
13+
};
14+
</script>
15+

0 commit comments

Comments
 (0)