ershisan99/coolify
1
0
Fork 0
mirror of https://github.com/ershisan99/coolify.git synced 2025-12-31 12:34:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

Componentization of /servers and /sources

Browse Source
This commit is contained in:
Gabriel Engel
2022-11-23 08:17:03 -03:00
parent c2d72ad309
commit 91c558ec83
9 changed files with 228 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
apps/ui/src/routes/servers/index.svelte
View File

@@ -5,11 +5,10 @@
import type { Load } from '@sveltejs/kit';
export const load: Load = async ({}) => {
try {
const { servers } = await get('/servers');
const {servers} = await get('/servers');
const {destinations} = await get('/resources');
return {
props: {
servers
}
props: { servers, destinations }
};
} catch (error: any) {
return {
@@ -22,16 +21,25 @@
<script lang="ts">
export let servers: any;
export let destinations:any;
import { appSession } from '$lib/store';
import { goto } from '$app/navigation';
import ContextMenu from '$lib/components/ContextMenu.svelte';
import LocalDockerIcon from '$lib/components/svg/servers/LocalDockerIcon.svelte';
import RemoteDockerIcon from '$lib/components/svg/servers/RemoteDockerIcon.svelte';
import PublicBadge from '$lib/components/badges/PublicBadge.svelte';
import TeamsBadge from '$lib/components/badges/TeamsBadge.svelte';
import Grid3 from '$lib/components/grids/Grid3.svelte';
if ($appSession.teamId !== '0') {
goto('/');
}
</script>
<div class="header">
<h1 class="text-2xl font-bold">Servers</h1>
</div>
<ContextMenu>
<h1 class="title">Servers</h1>
</ContextMenu>
<div class="container lg:mx-auto lg:p-0 px-8 p-5">
{#if servers.length > 0}
<div class="grid grid-col gap-8 auto-cols-max grid-cols-1 p-4">
@@ -49,3 +57,45 @@
<h1 class="text-center text-xs">Nothing here.</h1>
{/if}
</div>
<div class="flex items-center mt-10">
<h1 class="title lg:text-3xl">Destinations</h1>
</div>
{#if destinations.length > 0}
<div class="divider" />
<Grid3>
{#if destinations.length > 0}
{#each destinations as destination}
<a class="no-underline mb-5" href={`/destinations/${destination.id}`}>
<div
class="w-full rounded p-5 bg-coolgray-200 hover:bg-destinations indicator duration-150"
>
<div class="w-full flex flex-row">
<div class="absolute top-0 left-0 -m-5 h-10 w-10">
<LocalDockerIcon/>
{#if destination.remoteEngine}
<RemoteDockerIcon/>
{/if}
</div>
<div class="w-full flex flex-col">
<h1 class="font-bold text-base truncate">{destination.name}</h1>
<div class="h-10 text-xs">
{#if $appSession.teamId === '0' && destination.remoteVerified === false && destination.remoteEngine}
<h2 class="text-red-500">Not verified yet</h2>
{/if}
{#if destination.remoteEngine && !destination.sshKeyId}
<h2 class="text-red-500">SSH key missing</h2>
{/if}
<TeamsBadge teams={destination.teams} thing={destination}/>
</div>
</div>
</div>
</div>
</a>
{/each}
{:else}
<h1 class="">Nothing here.</h1>
{/if}
</Grid3>
{/if}