#591 - node

app/Actions/NodeJS/InstallNewNodeJsVersion.php

@@ -1,51 +0,0 @@
-<?php
-
-namespace App\Actions\NodeJS;
-
-use App\Enums\NodeJS;
-use App\Enums\ServiceStatus;
-use App\Models\Server;
-use App\Models\Service;
-use Illuminate\Validation\Rule;
-
-class InstallNewNodeJsVersion
-{
-    /**
-     * @param  array<string, mixed>  $input
-     */
-    public function install(Server $server, array $input): void
-    {
-        $nodejs = new Service([
-            'server_id' => $server->id,
-            'type' => 'nodejs',
-            'type_data' => [],
-            'name' => 'nodejs',
-            'version' => $input['version'],
-            'status' => ServiceStatus::INSTALLING,
-            'is_default' => false,
-        ]);
-        $nodejs->save();
-
-        dispatch(function () use ($nodejs): void {
-            $nodejs->handler()->install();
-            $nodejs->status = ServiceStatus::READY;
-            $nodejs->save();
-        })->catch(function () use ($nodejs): void {
-            $nodejs->delete();
-        })->onConnection('ssh');
-    }
-
-    /**
-     * @return array<string, array<string>>
-     */
-    public static function rules(Server $server): array
-    {
-        return [
-            'version' => [
-                'required',
-                Rule::in(config('core.nodejs_versions')),
-                Rule::notIn(array_merge($server->installedNodejsVersions(), [NodeJS::NONE])),
-            ],
-        ];
-    }
-}

app/Actions/NodeJS/UninstallNodeJS.php

@@ -1,60 +0,0 @@
-<?php
-
-namespace App\Actions\NodeJS;
-
-use App\Enums\ServiceStatus;
-use App\Models\Server;
-use App\Models\Service;
-use Illuminate\Support\Facades\Validator;
-use Illuminate\Validation\ValidationException;
-
-class UninstallNodeJS
-{
-    /**
-     * @param  array<string, mixed>  $input
-     *
-     * @throws ValidationException
-     */
-    public function uninstall(Server $server, array $input): void
-    {
-        $this->validate($server, $input);
-
-        /** @var Service $nodejs */
-        $nodejs = $server->nodejs($input['version']);
-        $nodejs->status = ServiceStatus::UNINSTALLING;
-        $nodejs->save();
-
-        dispatch(function () use ($nodejs): void {
-            $nodejs->handler()->uninstall();
-            $nodejs->delete();
-        })->catch(function () use ($nodejs): void {
-            $nodejs->status = ServiceStatus::FAILED;
-            $nodejs->save();
-        })->onConnection('ssh');
-    }
-
-    /**
-     * @param  array<string, mixed>  $input
-     *
-     * @throws ValidationException
-     */
-    private function validate(Server $server, array $input): void
-    {
-        Validator::make($input, [
-            'version' => 'required|string',
-        ])->validate();
-
-        if (! in_array($input['version'], $server->installedNodejsVersions())) {
-            throw ValidationException::withMessages(
-                ['version' => __('This version is not installed')]
-            );
-        }
-
-        $hasSite = $server->sites()->where('nodejs_version', $input['version'])->first();
-        if ($hasSite) {
-            throw ValidationException::withMessages(
-                ['version' => __('Cannot uninstall this version because some sites are using it!')]
-            );
-        }
-    }
-}

app/Actions/PHP/UninstallPHP.php

@@ -1,60 +0,0 @@
-<?php
-
-namespace App\Actions\PHP;
-
-use App\Enums\ServiceStatus;
-use App\Models\Server;
-use App\Models\Service;
-use Illuminate\Support\Facades\Validator;
-use Illuminate\Validation\ValidationException;
-
-class UninstallPHP
-{
-    /**
-     * @param  array<string, mixed>  $input
-     *
-     * @throws ValidationException
-     */
-    public function uninstall(Server $server, array $input): void
-    {
-        $this->validate($server, $input);
-
-        /** @var Service $php */
-        $php = $server->php($input['version']);
-        $php->status = ServiceStatus::UNINSTALLING;
-        $php->save();
-
-        dispatch(function () use ($php): void {
-            $php->handler()->uninstall();
-            $php->delete();
-        })->catch(function () use ($php): void {
-            $php->status = ServiceStatus::FAILED;
-            $php->save();
-        })->onConnection('ssh');
-    }
-
-    /**
-     * @param  array<string, mixed>  $input
-     *
-     * @throws ValidationException
-     */
-    private function validate(Server $server, array $input): void
-    {
-        Validator::make($input, [
-            'version' => 'required|string',
-        ])->validate();
-
-        if (! in_array($input['version'], $server->installedPHPVersions())) {
-            throw ValidationException::withMessages(
-                ['version' => __('This version is not installed')]
-            );
-        }
-
-        $hasSite = $server->sites()->where('php_version', $input['version'])->first();
-        if ($hasSite) {
-            throw ValidationException::withMessages(
-                ['version' => __('Cannot uninstall this version because some sites are using it!')]
-            );
-        }
-    }
-}

app/Http/Controllers/NodeController.php

@@ -0,0 +1,50 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use App\Actions\NodeJS\ChangeDefaultCli;
+use App\Exceptions\SSHError;
+use App\Http\Resources\ServiceResource;
+use App\Models\Server;
+use App\Models\Service;
+use Illuminate\Http\RedirectResponse;
+use Illuminate\Http\Request;
+use Inertia\Inertia;
+use Inertia\Response;
+use Spatie\RouteAttributes\Attributes\Get;
+use Spatie\RouteAttributes\Attributes\Middleware;
+use Spatie\RouteAttributes\Attributes\Post;
+use Spatie\RouteAttributes\Attributes\Prefix;
+
+#[Prefix('servers/{server}/node')]
+#[Middleware(['auth', 'has-project'])]
+class NodeController extends Controller
+{
+    #[Get('/', name: 'node')]
+    public function index(Server $server): Response
+    {
+        $this->authorize('viewAny', [Service::class, $server]);
+
+        $installedVersions = Service::query()
+            ->where('type', 'nodejs')
+            ->where('server_id', $server->id)
+            ->simplePaginate(config('web.pagination_size'));
+
+        return Inertia::render('node/index', [
+            'installedVersions' => ServiceResource::collection($installedVersions),
+        ]);
+    }
+
+    /**
+     * @throws SSHError
+     */
+    #[Post('/{service}/default-cli', name: 'node.default-cli')]
+    public function defaultCli(Request $request, Server $server, Service $service): RedirectResponse
+    {
+        $this->authorize('update', $service);
+
+        app(ChangeDefaultCli::class)->change($server, $request->input());
+
+        return back()->with('success', 'Default Node CLI changed to '.$service->version.'.');
+    }
+}

resources/js/layouts/server/layout.tsx

@@ -102,7 +102,7 @@ export default function ServerLayout({ children }: { children: ReactNode }) {
     },
     {
       title: 'NodeJS',
-      href: '#',
+      href: route('node', { server: page.props.server.id }),
       icon: NodeIcon,
       isDisabled: isMenuDisabled,
     },

resources/js/pages/console/index.tsx

@@ -241,7 +241,7 @@ export default function Console() {
                   type="text"
                   value={command}
                   onChange={(e) => setCommand(e.target.value)}
-                  className="ml-2 h-auto flex-grow border-0 bg-transparent! p-0 shadow-none ring-0 outline-none focus:ring-0 focus:outline-none focus-visible:ring-0"
+                  className="ml-2 h-auto flex-grow border-0 bg-transparent! px-0 shadow-none ring-0 outline-none focus:ring-0 focus:outline-none focus-visible:ring-0"
                   autoComplete="off"
                   autoFocus
                 />

resources/js/pages/monitoring/index.tsx

@@ -68,16 +68,16 @@ export default function Monitoring() {
             </CardHeader>
             <CardContent>
               <div className="flex items-center justify-between border-b p-4">
-                <span>{page.props.lastMetric ? kbToGb(page.props.lastMetric.memory_used) + ' GB' : 'N/A'}</span>
                 <span>Used</span>
+                <span>{page.props.lastMetric ? kbToGb(page.props.lastMetric.memory_used) + ' GB' : 'N/A'}</span>
               </div>
               <div className="flex items-center justify-between border-b p-4">
-                <span>{page.props.lastMetric ? kbToGb(page.props.lastMetric.memory_free) + ' GB' : 'N/A'}</span>
                 <span>Free</span>
+                <span>{page.props.lastMetric ? kbToGb(page.props.lastMetric.memory_free) + ' GB' : 'N/A'}</span>
               </div>
               <div className="flex items-center justify-between p-4">
-                <span>{page.props.lastMetric ? kbToGb(page.props.lastMetric.memory_total) + ' GB' : 'N/A'}</span>
                 <span>Total</span>
+                <span>{page.props.lastMetric ? kbToGb(page.props.lastMetric.memory_total) + ' GB' : 'N/A'}</span>
               </div>
             </CardContent>
           </Card>
@@ -88,16 +88,16 @@ export default function Monitoring() {
             </CardHeader>
             <CardContent>
               <div className="flex items-center justify-between border-b p-4">
-                <span>{page.props.lastMetric ? mbToGb(page.props.lastMetric.disk_used) + ' GB' : 'N/A'}</span>
                 <span>Used</span>
+                <span>{page.props.lastMetric ? mbToGb(page.props.lastMetric.disk_used) + ' GB' : 'N/A'}</span>
               </div>
               <div className="flex items-center justify-between border-b p-4">
-                <span>{page.props.lastMetric ? mbToGb(page.props.lastMetric.disk_free) + ' GB' : 'N/A'}</span>
                 <span>Free</span>
+                <span>{page.props.lastMetric ? mbToGb(page.props.lastMetric.disk_free) + ' GB' : 'N/A'}</span>
               </div>
               <div className="flex items-center justify-between p-4">
-                <span>{page.props.lastMetric ? mbToGb(page.props.lastMetric.disk_total) + ' GB' : 'N/A'}</span>
                 <span>Total</span>
+                <span>{page.props.lastMetric ? mbToGb(page.props.lastMetric.disk_total) + ' GB' : 'N/A'}</span>
               </div>
             </CardContent>
           </Card>

resources/js/pages/node/components/columns.tsx

@@ -0,0 +1,77 @@
+import { ColumnDef } from '@tanstack/react-table';
+import { DropdownMenu, DropdownMenuContent, DropdownMenuSeparator, DropdownMenuTrigger } from '@/components/ui/dropdown-menu';
+import { Button } from '@/components/ui/button';
+import { MoreVerticalIcon } from 'lucide-react';
+import React from 'react';
+import { Service } from '@/types/service';
+import { Badge } from '@/components/ui/badge';
+import DateTime from '@/components/date-time';
+import Uninstall from '@/pages/services/components/uninstall';
+import { Action } from '@/pages/services/components/action';
+import DefaultCli from '@/pages/node/components/default-cli';
+
+export const columns: ColumnDef<Service>[] = [
+  {
+    accessorKey: 'version',
+    header: 'Version',
+    enableColumnFilter: true,
+    enableSorting: true,
+  },
+  {
+    accessorKey: 'created_at',
+    header: 'Installed at',
+    enableColumnFilter: true,
+    enableSorting: true,
+    cell: ({ row }) => {
+      return <DateTime date={row.original.created_at} />;
+    },
+  },
+  {
+    accessorKey: 'is_default',
+    header: 'Default cli',
+    enableColumnFilter: true,
+    enableSorting: true,
+    cell: ({ row }) => {
+      return <Badge variant={row.original.is_default ? 'default' : 'outline'}>{row.original.is_default ? 'Yes' : 'No'}</Badge>;
+    },
+  },
+  {
+    accessorKey: 'status',
+    header: 'Status',
+    enableColumnFilter: true,
+    enableSorting: true,
+    cell: ({ row }) => {
+      return <Badge variant={row.original.status_color}>{row.original.status}</Badge>;
+    },
+  },
+  {
+    id: 'actions',
+    enableColumnFilter: false,
+    enableSorting: false,
+    cell: ({ row }) => {
+      return (
+        <div className="flex items-center justify-end">
+          <DropdownMenu modal={false}>
+            <DropdownMenuTrigger asChild>
+              <Button variant="ghost" className="h-8 w-8 p-0">
+                <span className="sr-only">Open menu</span>
+                <MoreVerticalIcon />
+              </Button>
+            </DropdownMenuTrigger>
+            <DropdownMenuContent align="end">
+              <DefaultCli service={row.original} />
+              <DropdownMenuSeparator />
+              <Action type="start" service={row.original} />
+              <Action type="stop" service={row.original} />
+              <Action type="restart" service={row.original} />
+              <Action type="enable" service={row.original} />
+              <Action type="disable" service={row.original} />
+              <DropdownMenuSeparator />
+              <Uninstall service={row.original} />
+            </DropdownMenuContent>
+          </DropdownMenu>
+        </div>
+      );
+    },
+  },
+];

resources/js/pages/node/components/default-cli.tsx

@@ -0,0 +1,64 @@
+import { Service } from '@/types/service';
+import React, { FormEvent, useState } from 'react';
+import { useForm } from '@inertiajs/react';
+import {
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from '@/components/ui/dialog';
+import { DropdownMenuItem } from '@/components/ui/dropdown-menu';
+import { Button } from '@/components/ui/button';
+import { LoaderCircleIcon } from 'lucide-react';
+import InputError from '@/components/ui/input-error';
+
+export default function DefaultCli({ service }: { service: Service }) {
+  const [open, setOpen] = useState(false);
+  const form = useForm<{
+    version: string;
+  }>({
+    version: service.version,
+  });
+
+  const submit = (e: FormEvent) => {
+    e.preventDefault();
+    form.post(route('node.default-cli', { server: service.server_id, service: service.id }), {
+      onSuccess: () => {
+        setOpen(false);
+      },
+    });
+  };
+
+  return (
+    <Dialog open={open} onOpenChange={setOpen}>
+      <DialogTrigger asChild>
+        <DropdownMenuItem disabled={service.is_default} onSelect={(e) => e.preventDefault()}>
+          Make default cli
+        </DropdownMenuItem>
+      </DialogTrigger>
+      <DialogContent className="sm:max-w-lg">
+        <DialogHeader>
+          <DialogTitle>Make default cli</DialogTitle>
+          <DialogDescription className="sr-only">Make default cli</DialogDescription>
+        </DialogHeader>
+        <div className="space-y-2 p-4">
+          <p>Are you sure you want to make Nodejs {form.data.version} the default cli?</p>
+          <InputError message={form.errors.version} />
+        </div>
+        <DialogFooter>
+          <DialogClose asChild>
+            <Button variant="outline">Cancel</Button>
+          </DialogClose>
+          <Button form="install-extension-form" disabled={form.processing} onClick={submit} className="ml-2">
+            {form.processing && <LoaderCircleIcon className="animate-spin" />}
+            Save
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+}

resources/js/pages/node/index.tsx

@@ -0,0 +1,42 @@
+import { Head, usePage } from '@inertiajs/react';
+import { Server } from '@/types/server';
+import { PaginatedData } from '@/types';
+import ServerLayout from '@/layouts/server/layout';
+import HeaderContainer from '@/components/header-container';
+import Heading from '@/components/heading';
+import { Button } from '@/components/ui/button';
+import { PlusIcon } from 'lucide-react';
+import Container from '@/components/container';
+import { Service } from '@/types/service';
+import InstallService from '@/pages/services/components/install';
+import { DataTable } from '@/components/data-table';
+import { columns } from '@/pages/node/components/columns';
+
+export default function PHP() {
+  const page = usePage<{
+    server: Server;
+    installedVersions: PaginatedData<Service>;
+  }>();
+
+  return (
+    <ServerLayout>
+      <Head title={`NodeJS - ${page.props.server.name}`} />
+
+      <Container className="max-w-5xl">
+        <HeaderContainer>
+          <Heading title="NodeJS" description="Here you can manage NodeJS" />
+          <div className="flex items-center gap-2">
+            <InstallService name="nodejs">
+              <Button>
+                <PlusIcon />
+                <span className="hidden lg:block">Install</span>
+              </Button>
+            </InstallService>
+          </div>
+        </HeaderContainer>
+
+        <DataTable columns={columns} paginatedData={page.props.installedVersions} />
+      </Container>
+    </ServerLayout>
+  );
+}

resources/js/pages/services/components/uninstall.tsx

@@ -15,6 +15,7 @@ import { DropdownMenuItem } from '@/components/ui/dropdown-menu';
 import { Button } from '@/components/ui/button';
 import { LoaderCircleIcon } from 'lucide-react';
 import FormSuccessful from '@/components/form-successful';
+import InputError from '@/components/ui/input-error';
 
 export default function Uninstall({ service }: { service: Service }) {
   const [open, setOpen] = useState(false);
@@ -39,7 +40,10 @@ export default function Uninstall({ service }: { service: Service }) {
           <DialogTitle>Uninstall service</DialogTitle>
           <DialogDescription className="sr-only">Uninstall service</DialogDescription>
         </DialogHeader>
-        <p className="p-4">Are you sure you want to uninstall this service? This action cannot be undone.</p>
+        <div className="space-y-2 p-4">
+          <p>Are you sure you want to uninstall this service? This action cannot be undone.</p>
+          <InputError message={form.errors.service} />
+        </div>
         <DialogFooter>
           <DialogClose asChild>
             <Button variant="outline">Cancel</Button>

tests/Feature/NodeJSTest.php

@@ -6,64 +6,13 @@
 use App\Enums\ServiceStatus;
 use App\Facades\SSH;
 use App\Models\Service;
-use App\Web\Pages\Servers\NodeJS\Index;
-use App\Web\Pages\Servers\NodeJS\Widgets\NodeJSList;
 use Illuminate\Foundation\Testing\RefreshDatabase;
-use Livewire\Livewire;
 use Tests\TestCase;
 
 class NodeJSTest extends TestCase
 {
     use RefreshDatabase;
 
-    public function test_install_new_nodejs(): void
-    {
-        SSH::fake();
-
-        $this->actingAs($this->user);
-
-        Livewire::test(Index::class, ['server' => $this->server])
-            ->callAction('install', [
-                'version' => NodeJS::V16,
-            ])
-            ->assertSuccessful();
-
-        $this->assertDatabaseHas('services', [
-            'server_id' => $this->server->id,
-            'type' => 'nodejs',
-            'version' => NodeJS::V16,
-            'status' => ServiceStatus::READY,
-        ]);
-    }
-
-    public function test_uninstall_nodejs(): void
-    {
-        SSH::fake();
-
-        $this->actingAs($this->user);
-
-        $php = new Service([
-            'server_id' => $this->server->id,
-            'type' => 'nodejs',
-            'type_data' => [],
-            'name' => 'nodejs',
-            'version' => NodeJS::V16,
-            'status' => ServiceStatus::READY,
-            'is_default' => true,
-        ]);
-        $php->save();
-
-        Livewire::test(NodeJSList::class, [
-            'server' => $this->server,
-        ])
-            ->callTableAction('uninstall', $php->id)
-            ->assertSuccessful();
-
-        $this->assertDatabaseMissing('services', [
-            'id' => $php->id,
-        ]);
-    }
-
     public function test_change_default_nodejs_cli(): void
     {
         SSH::fake();
@@ -81,11 +30,13 @@ public function test_change_default_nodejs_cli(): void
             'is_default' => false,
         ]);
 
-        Livewire::test(NodeJSList::class, [
+        $this->post(route('node.default-cli', [
-            'server' => $this->server,
+            'server' => $this->server->id,
+            'service' => $service->id,
+        ]), [
+            'version' => NodeJS::V16,
         ])
-            ->callTableAction('default-nodejs-cli', $service->id)
+            ->assertSessionDoesntHaveErrors();
-            ->assertSuccessful();
 
         $service->refresh();