feat: add s3 storages

This commit is contained in:
Andras Bacsai
2023-08-07 15:31:42 +02:00
parent 2a7e7e978b
commit f6e888ecf9
24 changed files with 916 additions and 35 deletions

View File

@@ -27,6 +27,10 @@
<a class="{{ request()->routeIs('team.members') ? 'text-white' : '' }}" href="{{ route('team.members') }}">
<button>Members</button>
</a>
<a class="{{ request()->routeIs('team.storages.all') ? 'text-white' : '' }}"
href="{{ route('team.storages.all') }}">
<button>S3 Storages</button>
</a>
<a class="{{ request()->routeIs('team.notifications') ? 'text-white' : '' }}"
href="{{ route('team.notifications') }}">
<button>Notifications</button>

View File

@@ -17,5 +17,12 @@
<div class="stat-value">{{ $resources }}</div>
<div class="stat-desc">Applications, databases, etc...</div>
</div>
<div class="stat">
<div class="stat-title">S3 Storages</div>
<div class="stat-value">{{ $s3s->count() }}</div>
</div>
</div>
@if (isDev())
<livewire:s3-test />
@endif
</x-layout>

View File

@@ -0,0 +1,15 @@
<div>
<h2>S3 Test</h2>
<form wire:submit.prevent="save">
<input type="file" wire:model="file">
@error('file')
<span class="error">{{ $message }}</span>
@enderror
<div wire:loading wire:target="file">Uploading to server...</div>
@if ($file)
<x-forms.button type="submit">Upload file to s3:/files</x-forms.button>
@endif
</form>
<h4>Functions</h4>
<x-forms.button wire:click="get_files">Get s3:/files</x-forms.button>
</div>

View File

@@ -0,0 +1,23 @@
<div>
<h1>Create a new S3 Storage</h1>
<div class="pt-2 pb-10 ">S3 Storage used to save backups / files</div>
<form class="flex flex-col gap-2" wire:submit.prevent='submit'>
<div class="flex gap-2">
<x-forms.input label="Name" id="name" />
<x-forms.input label="Description" id="description" />
</div>
<div class="flex gap-2">
<x-forms.input type="url" label="Endpoint" id="endpoint" />
<x-forms.input required label="Bucket" id="bucket" />
<x-forms.input required label="Region" id="region" />
</div>
<div class="flex gap-2">
<x-forms.input required type="password" label="Access Key" id="key" />
<x-forms.input required type="password" label="Secret Key" id="secret" />
</div>
<x-forms.button type="submit">
Save New S3 Storage
</x-forms.button>
</form>
</div>

View File

@@ -0,0 +1,38 @@
<div>
<x-modal yesOrNo modalId="deleteS3Storage" modalTitle="Delete S3 Storage">
<x-slot:modalBody>
<p>This storage will be deleted. It is not reversible. Your data won't be touched!<br>Please think again..
</p>
</x-slot:modalBody>
</x-modal>
<form class="flex flex-col gap-2 pb-6" wire:submit.prevent='submit'>
<div class="flex items-start gap-2">
<div class="pb-4">
<h2>Storage Details</h2>
<div>{{ $storage->name }}</div>
</div>
<x-forms.button type="submit">
Save
</x-forms.button>
<x-forms.button wire:click="test_s3_connection">
Test Connection
</x-forms.button>
<x-forms.button isError isModal modalId="deleteS3Storage">
Delete
</x-forms.button>
</div>
<div class="flex gap-2">
<x-forms.input label="Name" id="storage.name" />
<x-forms.input label="Description" id="storage.description" />
</div>
<div class="flex gap-2">
<x-forms.input required label="Endpoint" id="storage.endpoint" />
<x-forms.input required label="Bucket" id="storage.bucket" />
<x-forms.input required label="Region" id="storage.region" />
</div>
<div class="flex gap-2">
<x-forms.input required type="password" label="Access Key" id="storage.key" />
<x-forms.input required type="password" label="Secret Key" id="storage.secret" />
</div>
</form>
</div>

View File

@@ -1,6 +1,6 @@
<x-layout>
<x-team.navbar :team="session('currentTeam')" />
<h3>Members</h3>
<h2>Members</h2>
<div class="pt-4 overflow-hidden">
<table>
<thead>

View File

@@ -1,5 +1,6 @@
<x-layout>
<x-team.navbar :team="session('currentTeam')" />
<h2 class="pb-4">Notifications</h2>
<div x-data="{ activeTab: window.location.hash ? window.location.hash.substring(1) : 'email' }" class="flex h-full">
<div class="flex flex-col gap-4 min-w-fit">
<a :class="activeTab === 'email' && 'text-white'"

View File

@@ -0,0 +1,32 @@
<x-layout>
<x-team.navbar :team="session('currentTeam')" />
<div class="flex items-start gap-2">
<h2 class="pb-4">S3 Storages</h2>
<x-forms.button class="btn">
<a class="text-white hover:no-underline" href="/team/storages/new">+ Add</a>
</x-forms.button>
</div>
<div class="grid gap-2 lg:grid-cols-2">
@forelse ($s3 as $storage)
<div x-data x-on:click="goto('{{ $storage->uuid }}')" @class(['gap-2 border cursor-pointer box group border-transparent'])>
<div class="flex flex-col mx-6">
<div class=" group-hover:text-white">
{{ $storage->name }}
</div>
<div class="text-xs group-hover:text-white">
{{ $storage->description }}</div>
</div>
</div>
@empty
<div>
<div>No storage found.</div>
<x-use-magic-bar link="/team/storages/new" />
</div>
@endforelse
</div>
<script>
function goto(uuid) {
window.location.href = '/team/storages/' + uuid;
}
</script>
</x-layout>

View File

@@ -0,0 +1,3 @@
<x-layout>
<livewire:team.storage.create />
</x-layout>

View File

@@ -0,0 +1,4 @@
<x-layout>
<x-team.navbar :team="session('currentTeam')" />
<livewire:team.storage.form :storage="$storage" />
</x-layout>