Validation, service form improvements

This commit is contained in:
2025-04-08 22:33:05 +01:00
parent 628d6a14ed
commit d924d418c7
4 changed files with 164 additions and 22 deletions

View File

@@ -2,16 +2,36 @@
namespace App\Http\Controllers;
use App\Enums\ServiceCategory;
use App\Enums\ServiceType;
use App\Models\Server;
use Illuminate\Http\Request;
use Illuminate\Validation\Rule;
class ServiceController extends Controller
{
public function create(Request $request)
{
$server = $request->route('server');
$server = Server::findOrFail($request->route('server'));
return inertia('services/Create', [
'server' => $server,
'services' => config('keystone.services'),
]);
}
public function store(Request $request)
{
// dd($request->all());
$request->validate([
'name' => ['required', 'string', 'max:255'],
'category' => ['required', Rule::enum(ServiceCategory::class)],
'type' => ['required', Rule::enum(ServiceType::class)],
'version' => ['required', 'string', function ($key, $value, $fail) use ($request) {
if (!isset(config('keystone.services')[$request->category][$request->type]['versions'][$value])) {
$fail('The selected version is invalid.');
}
}],
]);
}
}

View File

@@ -1,6 +1,8 @@
<?php
use App\Drivers\Postgres\Postgres17Driver;
use App\Enums\ServiceCategory;
use App\Enums\ServiceType;
return [
'drivers' => [
@@ -9,4 +11,105 @@ return [
],
],
'internal_ip_base' => env('INTERNAL_IP_BASE', '192.168.2.'),
'services' => [
ServiceCategory::DATABASE->value => [
ServiceType::POSTGRES->value => [
'name' => ServiceType::POSTGRES,
'description' => 'PostgreSQL',
'versions' => [
'17' => [
'name' => 'PostgreSQL 17',
'description' => 'PostgreSQL 17',
'image' => 'postgres:17',
],
],
],
ServiceType::MYSQL->value => [
'name' => ServiceType::MYSQL,
'description' => 'MySQL',
'versions' => [
'9.0' => [
'name' => 'MySQL 9.2',
'description' => 'MySQL 9.2',
'image' => 'mysql:9.2'
],
],
],
],
ServiceCategory::GATEWAY->value => [
ServiceType::NGINX->value => [
'name' => ServiceType::NGINX,
'description' => 'Nginx',
'versions' => [
'1.27' => [
'name' => 'Nginx 1.27',
'description' => 'Nginx 1.27',
'image' => 'nginx:1.27',
],
],
],
ServiceType::CADDY->value => [
'name' => ServiceType::CADDY,
'description' => 'Caddy',
'versions' => [
'2.9' => [
'name' => 'Caddy 2.9',
'description' => 'Caddy 2.9',
'image' => 'caddy:2.9'
],
],
],
],
ServiceCategory::APPLICATION->value => [
ServiceType::PHP_FPM->value => [
'name' => ServiceType::PHP_FPM,
'description' => 'PHP-FPM',
'versions' => [
'8.4' => [
'name' => 'PHP 8.4',
'description' => 'PHP 8.4',
'image' => 'serversideup/php:8.4-fpm-nginx',
],
],
],
ServiceType::FRANKENPHP->value => [
'name' => ServiceType::FRANKENPHP,
'description' => 'FrankenPHP',
'versions' => [
'1.5' => [
'name' => 'FrankenPHP 1.5',
'description' => 'FrankenPHP 1.5',
'image' => 'dunglas/frankenphp:1.5-php8.4-bookworm',
],
],
],
],
ServiceCategory::CACHE->value => [
ServiceType::REDIS->value => [
'name' => ServiceType::REDIS,
'description' => 'Redis',
'versions' => [
'7.4' => [
'name' => 'Redis 7.4',
'description' => 'Redis 7.4',
'image' => 'redis:7.4',
],
],
],
ServiceType::VALKEY->value => [
'name' => ServiceType::VALKEY,
'description' => 'Valkey',
'versions' => [
'8.1' => [
'name' => 'Valkey 8.1',
'description' => 'Valkey 8.1',
'image' => 'valkey/valkey:8.1',
],
],
],
],
ServiceCategory::STORAGE->value => [
],
]
];

View File

@@ -1,7 +1,7 @@
// This is a generated file.
export default {
"UNINSTALLED": "uninstalled",
"NOT_INSTALLED": "not-installed",
"INSTALLED": "installed",
"FAILED": "failed",
"REMOVED": "removed"

View File

@@ -1,20 +1,23 @@
<script setup>
import InputError from '@/components/InputError.vue';
import RadioButton from '@/components/RadioButton.vue';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { Label } from '@/components/ui/label';
import ServiceCategory, { DescriptionMap as serviceCategoryDescriptions } from '@/enums/ServiceCategory';
import AppLayout from '@/layouts/AppLayout.vue';
import { Head, useForm } from '@inertiajs/vue3';
import { Label } from '@/components/ui/label';
import { Input } from '@/components/ui/input';
import InputError from '@/components/InputError.vue';
import ServiceCategory, { DescriptionMap as serviceCategoryDescriptions } from '@/enums/ServiceCategory';
import RadioButton from '@/components/RadioButton.vue';
import { AppWindowIcon, ArchiveIcon, DatabaseIcon, DatabaseZapIcon, DoorOpenIcon } from 'lucide-vue-next';
const props = defineProps({});
const props = defineProps({
services: Object,
});
const form = useForm({
name: null,
category: null,
type: null,
service: null,
version: null,
});
function getIcon(category) {
@@ -55,38 +58,54 @@ function getIcon(category) {
]"
>
<div class="flex h-full flex-1 flex-col gap-4 rounded-xl p-4">
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-2">
<div class="grid gap-2 md:grid-cols-2 lg:grid-cols-3">
<RadioButton
v-for="(category, categoryKey) in ServiceCategory"
v-model="form.category"
:value="category"
name="category"
class="py-3 flex gap-3"
class="flex gap-3 py-3"
>
<component :is="getIcon(category)" class="size-5" />
<div>
<h4 class="text-lg font-semibold tracking-tighter leading-none mb-1">{{ category }}</h4>
<h4 class="mb-1 text-lg font-semibold leading-none tracking-tighter">{{ category }}</h4>
<p class="text-sm">{{ serviceCategoryDescriptions[categoryKey] }}</p>
</div>
</RadioButton>
</div>
<div v-if="form.category" class="grid gap-2 md:grid-cols-2 lg:grid-cols-3">
<RadioButton
v-for="service in services[form.category]"
v-model="form.service"
:value="service.name"
name="service"
class="py-3"
>
<h4 class="mb-1 text-lg font-semibold leading-none tracking-tighter">{{ service.name }}</h4>
</RadioButton>
</div>
<div v-if="form.service" class="grid gap-2 md:grid-cols-2 lg:grid-cols-3">
<RadioButton
v-for="version in services[form.category][form.service].versions"
v-model="form.version"
:value="version.name"
name="version"
class="py-3"
>
<h4 class="mb-1 text-lg font-semibold leading-none tracking-tighter">{{ version.name }}</h4>
</RadioButton>
</div>
<div class="grid gap-2">
<Label for="name">Name</Label>
<Input
id="name"
type="text"
required
autofocus
:tabindex="1"
v-model="form.name"
placeholder="postgres-db"
/>
<Input id="name" type="text" required autofocus :tabindex="1" v-model="form.name" placeholder="postgres-db" />
<InputError :message="form.errors.name" />
</div>
<div class="flex items-center justify-end">
<Button @click="form.post(route('servers.store', { organisation: $page.props.organisation.id }))">Submit</Button>
<Button @click="form.post(route('services.store', { organisation: $page.props.organisation.id, server: $page.props.server.id }))">Submit</Button>
</div>
</div>
</AppLayout>