mkrieger/byos_laravel
1
0
Fork 0
mirror of https://github.com/usetrmnl/byos_laravel.git synced 2026-01-13 15:07:49 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

feat: add recipe preview

Browse source 
wip

wip

feat: render preview
This commit is contained in:
Benjamin Nussbaum 2025-05-22 16:43:55 +03:00
parent f187cabcd9
commit 2906dd9071
1 changed files with 48 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

50
resources/views/livewire/plugins/recipe.blade.php
View file

@ -2,6 +2,7 @@
use App\Models\Plugin;
use Livewire\Volt\Component;
use Illuminate\Support\Facades\Blade;
new class extends Component {
public Plugin $plugin;
@ -11,7 +12,7 @@ new class extends Component {
public string $name;
public int $data_stale_minutes;
public string $data_strategy;
public string $polling_url;
public string|null $polling_url;
public string $polling_verb;
public string|null $polling_header;
public $data_payload;
@ -72,7 +73,7 @@ new class extends Component {
'name' => 'required|string|max:255',
'data_stale_minutes' => 'required|integer|min:1',
'data_strategy' => 'required|string|in:polling,webhook',
'polling_url' => 'required|url',
'polling_url' => 'required_if:data_strategy,polling|nullable|url',
'polling_verb' => 'required|string|in:get,post',
'polling_header' => 'nullable|string|max:255',
'blade_code' => 'nullable|string',
@ -199,6 +200,22 @@ HTML;
HTML;
}
public function renderPreview(): void
{
abort_unless(auth()->user()->plugins->contains($this->plugin), 403);
try {
if ($this->plugin->render_markup_view) {
$previewMarkup = view($this->plugin->render_markup_view, ['data' => $this->plugin->data_payload])->render();
} else {
$previewMarkup = Blade::render($this->plugin->render_markup, ['data' => $this->plugin->data_payload]);
}
$this->dispatch('preview-updated', preview: $previewMarkup);
} catch (\Exception $e) {
$this->dispatch('preview-error', message: $e->getMessage());
}
}
public function deletePlugin(): void
{
abort_unless(auth()->user()->plugins->contains($this->plugin), 403);
@ -217,6 +234,9 @@ HTML;
</h2>
<flux:button.group>
<flux:modal.trigger name="preview-plugin">
<flux:button icon="eye" wire:click="renderPreview">Preview</flux:button>
</flux:modal.trigger>
<flux:modal.trigger name="add-to-playlist">
<flux:button icon="play" variant="primary">Add to Playlist</flux:button>
</flux:modal.trigger>
@ -309,6 +329,16 @@ HTML;
</div>
</flux:modal>
<flux:modal name="preview-plugin" class="min-w-[850px] min-h-[480px] space-y-6">
<div>
<flux:heading size="lg">Preview {{ $plugin->name }}</flux:heading>
</div>
<div class="bg-white dark:bg-zinc-900 rounded-lg overflow-hidden">
<iframe id="preview-frame" class="w-full h-[480px] border-0"></iframe>
</div>
</flux:modal>
<div class="mt-5 mb-5">
<h3 class="text-xl font-semibold dark:text-gray-100">Settings</h3>
</div>
@ -442,3 +472,19 @@ HTML;
@endif
</div>
</div>
@script
<script>
$wire.on('preview-updated', ({ preview }) => {
const frame = document.getElementById('preview-frame');
const frameDoc = frame.contentDocument || frame.contentWindow.document;
frameDoc.open();
frameDoc.write(preview);
frameDoc.close();
});
$wire.on('preview-error', ({ message }) => {
alert('Preview Error: ' + message);
});
</script>
@endscript