the RunwareAI Plugin is working now

app/Api/Plugins/ApiPluginInterface.php

@@ -11,6 +11,5 @@ interface ApiPluginInterface
     public function disable(): bool;
     public function getStatus(string $imageUUID): array;
     public function getProgress(string $imageUUID): array;
-    public function upload(string $imagePath): array;
+    public function processImageStyleChange(string $imagePath, string $prompt, string $modelId, ?string $parameters = null): array;
-    public function styleChangeRequest(string $prompt, string $seedImageUUID): array;
 }

app/Api/Plugins/RunwareAIPlugin.php

@@ -1,106 +0,0 @@
-<?php
-
-namespace App\Api\Plugins;
-
-use GuzzleHttp\Client;
-use GuzzleHttp\Exception\RequestException;
-
-class RunwareAIPlugin implements ApiPluginInterface
-{
-    protected $client;
-    protected $apiUrl;
-    protected $apiKey;
-
-    public function __construct()
-    {
-        // Hier müssten die API-URL und der API-Schlüssel aus der Datenbank oder Konfiguration geladen werden.
-        // Fürs Erste hardcodiere ich sie als Platzhalter.
-        $this->apiUrl = env('RUNWARE_AI_API_URL', 'https://api.runware.ai/v1');
-        $this->apiKey = env('RUNWARE_AI_API_KEY', 'YOUR_RUNWARE_AI_API_KEY');
-
-        $this->client = new Client([
-            'base_uri' => $this->apiUrl,
-            'headers' => [
-                'Authorization' => 'Bearer ' . $this->apiKey,
-                'Accept' => 'application/json',
-            ],
-        ]);
-    }
-
-    public function getIdentifier(): string
-    {
-        return 'runware-ai';
-    }
-
-    public function getName(): string
-    {
-        return 'Runware AI';
-    }
-
-    public function isEnabled(): bool
-    {
-        // Implementieren Sie hier die Logik, um zu prüfen, ob das Plugin aktiviert ist
-        return true;
-    }
-
-    public function enable(): bool
-    {
-        // Implementieren Sie hier die Logik zum Aktivieren des Plugins
-        return true;
-    }
-
-    public function disable(): bool
-    {
-        // Implementieren Sie hier die Logik zum Deaktivieren des Plugins
-        return true;
-    }
-
-    public function getStatus(string $imageUUID): array
-    {
-        try {
-            $response = $this->client->get("image-inference/status/{$imageUUID}");
-            return json_decode($response->getBody()->getContents(), true);
-        } catch (RequestException $e) {
-            return ['error' => $e->getMessage()];
-        }
-    }
-
-    public function getProgress(string $imageUUID): array
-    {
-        // Runware AI hat keine separate Progress-API, Status enthält den Fortschritt
-        return $this->getStatus($imageUUID);
-    }
-
-    public function upload(string $imagePath): array
-    {
-        try {
-            $response = $this->client->post('image-inference/upload', [
-                'multipart' => [
-                    [
-                        'name'     => 'image',
-                        'contents' => fopen($imagePath, 'r'),
-                        'filename' => basename($imagePath),
-                    ],
-                ],
-            ]);
-            return json_decode($response->getBody()->getContents(), true);
-        } catch (RequestException $e) {
-            return ['error' => $e->getMessage()];
-        }
-    }
-
-    public function styleChangeRequest(string $prompt, string $seedImageUUID): array
-    {
-        try {
-            $response = $this->client->post('image-inference/image-to-image', [
-                'json' => [
-                    'prompt' => $prompt,
-                    'seed_image_uuid' => $seedImageUUID,
-                ],
-            ]);
-            return json_decode($response->getBody()->getContents(), true);
-        } catch (RequestException $e) {
-            return ['error' => $e->getMessage()];
-        }
-    }
-}

app/Api/Plugins/RunwareAi.php

@@ -71,7 +71,27 @@ class RunwareAi implements ApiPluginInterface
         return ['progress' => 0];
     }
 
-    public function upload(string $imagePath): array
+    public function processImageStyleChange(string $imagePath, string $prompt, string $modelId, ?string $parameters = null): array
+    {
+        // Step 1: Upload the original image
+        $uploadResult = $this->upload($imagePath);
+
+        if (!isset($uploadResult['data'][0]['imageUUID'])) {
+            throw new \Exception('Image upload to AI service failed or returned no UUID.');
+        }
+        $seedImageUUID = $uploadResult['data'][0]['imageUUID'];
+
+        // Step 2: Request style change using the uploaded image's UUID
+        $result = $this->styleChangeRequest($prompt, $seedImageUUID, $modelId, $parameters);
+
+        if (!isset($result['base64Data'])) {
+            throw new \Exception('AI service did not return base64 image data.');
+        }
+
+        return $result;
+    }
+
+    private function upload(string $imagePath): array
     {
         $this->logInfo('Attempting to upload image to RunwareAI.', ['image_path' => $imagePath]);
         if (!$this->apiProvider->api_url || !$this->apiProvider->token) {
@@ -83,15 +103,19 @@ class RunwareAi implements ApiPluginInterface
         $token = $this->apiProvider->token;
         $taskUUID = (string) Str::uuid();
 
+        $imageData = 'data:image/png;base64,' . base64_encode(file_get_contents($imagePath));
+
         try {
             $response = Http::withHeaders([
                 'Authorization' => 'Bearer ' . $token,
                 'Accept' => 'application/json',
-            ])->attach(
+                'Content-Type' => 'application/json',
-                'image', file_get_contents($imagePath), basename($imagePath)
+            ])->post($apiUrl, [
-            )->post($apiUrl, [
+                [
                     'taskType' => 'imageUpload',
                     'taskUUID' => $taskUUID,
+                    'image' => $imageData,
+                ]
             ]);
 
             $response->throw();
@@ -103,7 +127,7 @@ class RunwareAi implements ApiPluginInterface
         }
     }
 
-    public function styleChangeRequest(string $prompt, string $seedImageUUID, ?string $parameters = null): array
+    private function styleChangeRequest(string $prompt, string $seedImageUUID, string $modelId, ?string $parameters = null): array
     {
         $this->logInfo('Attempting style change request to RunwareAI.', ['prompt' => $prompt, 'seed_image_uuid' => $seedImageUUID]);
         if (!$this->apiProvider->api_url || !$this->apiProvider->token) {
@@ -121,6 +145,7 @@ class RunwareAi implements ApiPluginInterface
             'positivePrompt' => $prompt,
             'seedImage' => $seedImageUUID,
             'outputType' => 'base64Data',
+            'model' => $modelId,
         ];
 
         $decodedParameters = json_decode($parameters, true) ?? [];
@@ -132,13 +157,28 @@ class RunwareAi implements ApiPluginInterface
             $response = Http::withHeaders([
                 'Authorization' => 'Bearer ' . $token,
                 'Accept' => 'application/json',
-            ])->post($apiUrl, $data);
+            ])->post($apiUrl, [
+                $data
+            ]);
 
             $response->throw();
-            $this->logInfo('Style change request successful to RunwareAI.', ['task_uuid' => $taskUUID, 'response' => $response->json()]);
+            $responseData = $response->json();
-            return $response->json();
+
+            if (!isset($responseData['data'][0]['imageBase64Data'])) {
+                throw new \Exception('AI service did not return base64 image data.');
+            }
+
+            $base64Image = $responseData['data'][0]['imageBase64Data'];
+
+            $this->logInfo('Style change request successful to RunwareAI.', ['task_uuid' => $taskUUID, 'response' => $responseData]);
+            return ['base64Data' => $base64Image];
         } catch (\Exception $e) {
-            $this->logError('Style change request to RunwareAI failed.', ['error' => $e->getMessage(), 'task_uuid' => $taskUUID]);
+            $errorData = [];
+            /*if ($e instanceof \Illuminate\Http\Client\RequestException && $e->response) {
+                $errorData['response_body'] = $e->response->body();
+                $errorData['response_status'] = $e->response->status();
+            }*/
+            $this->logError('Style change request to RunwareAI failed.', ['error' => $e->getMessage(), 'task_uuid' => $taskUUID] + $errorData);
             throw $e;
         }
     }

app/Filament/Pages/InstallPluginPage.php

@@ -18,7 +18,7 @@ class InstallPluginPage extends Page implements HasForms
 
     protected static string $view = 'filament.pages.install-plugin-page';
 
-    protected static ?string $navigationGroup = 'Settings';
+    protected static ?string $navigationGroup = 'Plugins';
 
     protected static ?string $title = 'Install Plugin';
 

app/Filament/Pages/ListPlugins.php

@@ -24,7 +24,7 @@ class ListPlugins extends Page implements HasTable
 
     protected static string $view = 'filament.pages.list-plugins';
 
-    protected static ?string $navigationGroup = 'Settings';
+    protected static ?string $navigationGroup = 'Plugins';
 
     protected static ?string $title = 'Plugins';
 

app/Filament/Resources/AiModelResource.php

@@ -35,12 +35,16 @@ class AiModelResource extends Resource
                     ->required()
                     ->maxLength(255),
                 TextInput::make('model_type')
-                    ->label(__('filament.resource.ai_model.form.model_type'))
                     ->nullable()
                     ->maxLength(255),
+                Forms\Components\Toggle::make('enabled')
+                    ->label(__('filament.resource.ai_model.form.enabled'))
+                    ->default(true),
                 Select::make('apiProviders')
                     ->relationship('apiProviders', 'name')
                     ->multiple()
+                    ->preload()
+                    ->searchable(false)
                     ->label(__('filament.resource.ai_model.form.api_providers')),
             ]);
     }
@@ -52,6 +56,9 @@ class AiModelResource extends Resource
                 TextColumn::make('name')->label(__('filament.resource.ai_model.table.name'))->searchable()->sortable(),
                 TextColumn::make('model_id')->label(__('filament.resource.ai_model.table.model_id'))->searchable()->sortable(),
                 TextColumn::make('model_type')->label(__('filament.resource.ai_model.table.model_type'))->searchable()->sortable(),
+                Tables\Columns\IconColumn::make('enabled')
+                    ->label(__('filament.resource.ai_model.table.enabled'))
+                    ->boolean(),
                 TextColumn::make('apiProviders.name')->label(__('filament.resource.ai_model.table.api_providers'))->searchable()->sortable(),
             ])
             ->filters([

app/Filament/Resources/SettingResource.php

@@ -0,0 +1,67 @@
+<?php
+
+namespace App\Filament\Resources;
+
+use App\Filament\Resources\SettingResource\Pages;
+use App\Filament\Resources\SettingResource\RelationManagers;
+use App\Models\Setting;
+use Filament\Forms;
+use Filament\Forms\Form;
+use Filament\Resources\Resource;
+use Filament\Tables;
+use Filament\Tables\Table;
+use Illuminate\Database\Eloquent\Builder;
+use Illuminate\Database\Eloquent\SoftDeletingScope;
+
+class SettingResource extends Resource
+{
+    protected static ?string $model = Setting::class;
+
+    protected static ?string $navigationIcon = 'heroicon-o-rectangle-stack';
+
+    public static function form(Form $form): Form
+    {
+        return $form
+            ->schema([
+                //
+            ]);
+    }
+
+    public static function table(Table $table): Table
+    {
+        return $table
+            ->columns([
+                //
+            ])
+            ->filters([
+                //
+            ])
+            ->actions([
+                Tables\Actions\EditAction::make(),
+            ])
+            ->bulkActions([
+                Tables\Actions\BulkActionGroup::make([
+                    Tables\Actions\DeleteBulkAction::make(),
+                ]),
+            ])
+            ->emptyStateActions([
+                Tables\Actions\CreateAction::make(),
+            ]);
+    }
+    
+    public static function getRelations(): array
+    {
+        return [
+            //
+        ];
+    }
+    
+    public static function getPages(): array
+    {
+        return [
+            'index' => Pages\ListSettings::route('/'),
+            'create' => Pages\CreateSetting::route('/create'),
+            'edit' => Pages\EditSetting::route('/{record}/edit'),
+        ];
+    }    
+}

app/Filament/Resources/SettingResource/Pages/CreateSetting.php

@@ -0,0 +1,12 @@
+<?php
+
+namespace App\Filament\Resources\SettingResource\Pages;
+
+use App\Filament\Resources\SettingResource;
+use Filament\Actions;
+use Filament\Resources\Pages\CreateRecord;
+
+class CreateSetting extends CreateRecord
+{
+    protected static string $resource = SettingResource::class;
+}

app/Filament/Resources/SettingResource/Pages/EditSetting.php

@@ -0,0 +1,19 @@
+<?php
+
+namespace App\Filament\Resources\SettingResource\Pages;
+
+use App\Filament\Resources\SettingResource;
+use Filament\Actions;
+use Filament\Resources\Pages\EditRecord;
+
+class EditSetting extends EditRecord
+{
+    protected static string $resource = SettingResource::class;
+
+    protected function getHeaderActions(): array
+    {
+        return [
+            Actions\DeleteAction::make(),
+        ];
+    }
+}

app/Filament/Resources/SettingResource/Pages/ListSettings.php

@@ -0,0 +1,19 @@
+<?php
+
+namespace App\Filament\Resources\SettingResource\Pages;
+
+use App\Filament\Resources\SettingResource;
+use Filament\Actions;
+use Filament\Resources\Pages\ListRecords;
+
+class ListSettings extends ListRecords
+{
+    protected static string $resource = SettingResource::class;
+
+    protected function getHeaderActions(): array
+    {
+        return [
+            Actions\CreateAction::make(),
+        ];
+    }
+}

app/Filament/Resources/SettingResource/Pages/Settings.php

@@ -0,0 +1,64 @@
+<?php
+
+namespace App\Filament\Resources\SettingResource\Pages;
+
+use App\Filament\Resources\SettingResource;
+use App\Models\Setting;
+use Filament\Forms\Components\TextInput;
+use Filament\Forms\Concerns\InteractsWithForms;
+use Filament\Forms\Contracts\HasForms;
+use Filament\Forms\Form;
+use Filament\Notifications\Notification;
+use Filament\Pages\Page;
+use Illuminate\Database\Eloquent\Model;
+
+class Settings extends Page implements HasForms
+{
+    use InteractsWithForms;
+
+    protected static string $resource = SettingResource::class;
+
+    protected static ?string $navigationIcon = 'heroicon-o-cog';
+
+    protected static ?string $navigationGroup = 'Settings';
+
+    protected static ?string $navigationLabel = 'Global Settings';
+
+    protected static ?string $slug = 'global-settings';
+
+    protected static string $view = 'filament.resources.setting-resource.pages.settings';
+
+    public ?array $data = [];
+
+    public function mount(): void
+    {
+        $this->form->fill(
+            collect(Setting::all())
+                ->mapWithKeys(fn (Setting $setting) => [$setting->key => $setting->value])
+                ->all()
+        );
+    }
+
+    public function form(Form $form): Form
+    {
+        return $form
+            ->schema([
+                TextInput::make('gallery_heading')
+                    ->label(__('settings.gallery_heading')),
+            ])
+            ->statePath('data')
+            ->model(Setting::class);
+    }
+
+    public function submit(): void
+    {
+        foreach ($this->form->getState() as $key => $value) {
+            Setting::updateOrCreate(['key' => $key], ['value' => $value]);
+        }
+
+        Notification::make()
+            ->title(__('settings.saved_successfully'))
+            ->success()
+            ->send();
+    }
+}

app/Http/Controllers/Api/ImageController.php

@@ -8,18 +8,48 @@ use App\Api\Plugins\PluginLoader;
 use App\Models\ApiProvider;
 use App\Models\Style;
 use App\Models\Image;
-use Illuminate\Support\Facades\Storage;
+use Illuminate\Support\Facades\File;
 
 class ImageController extends Controller
 {
     public function index()
     {
-        $images = Storage::disk('public')->files('uploads');
+        $publicUploadsPath = public_path('storage/uploads');
+        
+        // Ensure the directory exists
+        if (!File::exists($publicUploadsPath)) {
+            File::makeDirectory($publicUploadsPath, 0755, true);
+        }
+
+        // Get files from the public/storage/uploads directory
+        $diskFiles = File::files($publicUploadsPath);
+        $diskImagePaths = [];
+        foreach ($diskFiles as $file) {
+            // Store path relative to public/storage/
+            $diskImagePaths[] = 'uploads/' . $file->getFilename();
+        }
+
+        $dbImagePaths = Image::pluck('path')->toArray();
+
+        // Add images from disk that are not in the database
+        $imagesToAdd = array_diff($diskImagePaths, $dbImagePaths);
+        foreach ($imagesToAdd as $path) {
+            Image::create(['path' => $path]);
+        }
+
+        // Remove images from database that are not on disk
+        $imagesToRemove = array_diff($dbImagePaths, $diskImagePaths);
+        Image::whereIn('path', $imagesToRemove)->delete();
+
+        // Fetch all images from the database after synchronization
+        $images = Image::orderBy('updated_at', 'desc')->get();
         $formattedImages = [];
         foreach ($images as $image) {
             $formattedImages[] = [
-                'path' => Storage::url($image),
+                'image_id' => $image->id,
-                'name' => basename($image),
+                'path' => asset('storage/' . $image->path),
+                'name' => basename($image->path),
+                'is_temp' => (bool) $image->is_temp,
             ];
         }
         return response()->json($formattedImages);
@@ -31,21 +61,39 @@ class ImageController extends Controller
             'image' => 'required|image|max:10240', // Max 10MB
         ]);
 
-        $path = $request->file('image')->store('uploads', 'public');
+        $file = $request->file('image');
+        $fileName = uniqid() . '.' . $file->getClientOriginalExtension();
+        $destinationPath = public_path('storage/uploads');
+
+        // Ensure the directory exists
+        if (!File::exists($destinationPath)) {
+            File::makeDirectory($destinationPath, 0755, true);
+        }
+
+        $file->move($destinationPath, $fileName);
+        $relativePath = 'uploads/' . $fileName; // Path relative to public/storage/
 
         $image = Image::create([
-            'path' => $path,
+            'path' => $relativePath,
         ]);
 
         return response()->json([
             'message' => __('api.image_uploaded_successfully'),
             'image_id' => $image->id,
-            'path' => Storage::url($path),
+            'path' => asset('storage/' . $relativePath),
         ]);
     }
 
     public function styleChangeRequest(Request $request)
     {
+        // Same-origin check
+        $appUrl = config('app.url');
+        $referer = $request->headers->get('referer');
+
+        if ($referer && parse_url($referer, PHP_URL_HOST) !== parse_url($appUrl, PHP_URL_HOST)) {
+            return response()->json(['error' => 'Unauthorized: Request must originate from the same domain.'], 403);
+        }
+
         $request->validate([
             'image_id' => 'required|exists:images,id',
             'style_id' => 'required|exists:styles,id',
@@ -69,32 +117,29 @@ class ImageController extends Controller
             }
             $plugin = PluginLoader::getPlugin($apiProvider->plugin, $apiProvider);
 
-            // Step 1: Upload the original image
+            $result = $plugin->processImageStyleChange(
-            $originalImagePath = Storage::disk('public')->path($image->path);
+                public_path('storage/' . $image->path),
-            $uploadResult = $plugin->upload($originalImagePath);
+                $style->prompt,
-
+                $style->aiModel->model_id,
-            if (!isset($uploadResult['imageUUID'])) {
+                $style->parameters
-                throw new \Exception('Image upload to AI service failed or returned no UUID.');
+            );
-            }
-            $seedImageUUID = $uploadResult['imageUUID'];
-
-            // Step 2: Request style change using the uploaded image's UUID
-            $result = $plugin->styleChangeRequest($style->prompt, $seedImageUUID, $style->parameters);
-
-            if (!isset($result['base64Data'])) {
-                throw new \Exception('AI service did not return base64 image data.');
-            }
 
             $base64Image = $result['base64Data'];
             $decodedImage = base64_decode(preg_replace('#^data:image/\w+;base64, #i', '', $base64Image));
 
             $newImageName = 'styled_' . uniqid() . '.png'; // Assuming PNG for now
-            $newImagePath = 'uploads/' . $newImageName;
+            $newImagePathRelative = 'uploads/' . $newImageName; // Path relative to public/storage/
+            $newImageFullPath = public_path('storage/' . $newImagePathRelative); // Full path to save
 
-            Storage::disk('public')->put($newImagePath, $decodedImage);
+            // Ensure the directory exists
+            if (!File::exists(public_path('storage/uploads'))) {
+                File::makeDirectory(public_path('storage/uploads'), 0755, true);
+            }
+
+            File::put($newImageFullPath, $decodedImage); // Save using File facade
 
             $newImage = Image::create([
-                'path' => $newImagePath,
+                'path' => $newImagePathRelative, // Store relative path
                 'original_image_id' => $image->id, // Link to original image
                 'style_id' => $style->id, // Link to applied style
                 'is_temp' => true, // Mark as temporary until user keeps it
@@ -104,7 +149,7 @@ class ImageController extends Controller
                 'message' => 'Style change successful',
                 'styled_image' => [
                     'id' => $newImage->id,
-                    'path' => Storage::url($newImage->path),
+                    'path' => asset('storage/' . $newImage->path),
                     'is_temp' => $newImage->is_temp,
                 ],
             ]);
@@ -133,44 +178,9 @@ class ImageController extends Controller
 
     public function deleteImage(Image $image)
     {
-        // Ensure the image is temporary or belongs to the authenticated user if not temporary
-        // For simplicity, we'll allow deletion of any image passed for now.
-        // In a real app, you'd add authorization checks here.
-
         try {
-            Storage::disk('public')->delete($image->path);
+            // Delete from the public/storage directory
-            $image->delete();
+            File::delete(public_path('storage/' . $image->path));
-            return response()->json(['message' => __('api.image_deleted_successfully')]);
-        } catch (\Exception $e) {
-            return response()->json(['error' => $e->getMessage()], 500);
-        }
-    }
-
-    public function keepImage(Request $request)
-    {
-        $request->validate([
-            'image_id' => 'required|exists:images,id',
-        ]);
-
-        $image = Image::find($request->image_id);
-
-        if (!$image) {
-            return response()->json(['error' => __('api.image_not_found')], 404);
-        }
-
-        try {
-            $image->is_temp = false;
-            $image->save();
-            return response()->json(['message' => __('api.image_kept_successfully')]);
-        } catch (\Exception $e) {
-            return response()->json(['error' => $e->getMessage()], 500);
-        }
-    }
-
-    public function deleteImage(Image $image)
-    {
-        try {
-            Storage::disk('public')->delete($image->path);
             $image->delete();
             return response()->json(['message' => __('api.image_deleted_successfully')]);
         } catch (\Exception $e) {
@@ -222,4 +232,5 @@ class ImageController extends Controller
         } catch (\Exception $e) {
             return response()->json(['error' => $e->getMessage()], 500);
         }
+    }
 }

app/Http/Controllers/Api/StyleController.php

@@ -10,7 +10,8 @@ class StyleController extends Controller
 {
     public function index()
     {
-        $styles = Style::where('enabled', true)
+        $styles = Style::with(['aiModel.apiProviders'])
+            ->where('enabled', true)
             ->whereHas('aiModel', function ($query) {
                 $query->where('enabled', true);
                 $query->whereHas('apiProviders', function ($query) {
@@ -19,6 +20,10 @@ class StyleController extends Controller
             })
             ->get();
 
+        if ($styles->isEmpty()) {
+            return response()->json(['message' => __('api.no_styles_available')], 404);
+        }
+
         return response()->json($styles);
     }
 }

app/Http/Controllers/HomeController.php

@@ -3,6 +3,7 @@
 namespace App\Http\Controllers;
 
 use Illuminate\Http\Request;
+use App\Models\Setting;
 use Inertia\Inertia;
 use Illuminate\Support\Facades\Lang;
 
@@ -12,9 +13,11 @@ class HomeController extends Controller
     {
         $locale = app()->getLocale();
         $translations = Lang::get('messages', [], $locale);
+        $galleryHeading = Setting::where('key', 'gallery_heading')->first()->value ?? 'Style Gallery';
 
         return Inertia::render('Home', [
             'translations' => $translations,
+            'galleryHeading' => $galleryHeading,
         ]);
     }
 }

app/Http/Middleware/HandleInertiaRequests.php

@@ -35,6 +35,16 @@ class HandleInertiaRequests extends Middleware
                 'user' => $request->user(),
             ],
             'locale' => app()->getLocale(),
+            'lang' => function () {
+                $lang = [
+                    'filament' => trans('filament'),
+                    'api' => trans('api'),
+                    'settings' => trans('settings'),
+                    'messages' => trans('messages'),
+                    // Add other translation files as needed
+                ];
+                return $lang;
+            },
         ];
     }
 }

app/Models/Image.php

@@ -8,10 +8,13 @@ use Illuminate\Database\Eloquent\Concerns\HasUuids;
 
 class Image extends Model
 {
-    use HasFactory, HasUuids;
+    use HasFactory;
 
     protected $fillable = [
         'path',
         'uuid',
+        'original_image_id',
+        'style_id',
+        'is_temp',
     ];
 }

app/Models/Setting.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Database\Eloquent\Factories\HasFactory;
+use Illuminate\Database\Eloquent\Model;
+
+class Setting extends Model
+{
+    use HasFactory;
+
+    protected $fillable = ['key', 'value'];
+}

app/Providers/Filament/AdminPanelProvider.php

@@ -18,6 +18,7 @@ use Illuminate\Session\Middleware\AuthenticateSession;
 use Illuminate\Session\Middleware\StartSession;
 use Illuminate\View\Middleware\ShareErrorsFromSession;
 use App\Filament\Resources\StyleResource;
+use App\Filament\Resources\SettingResource\Pages\Settings;
 
 class AdminPanelProvider extends PanelProvider
 {
@@ -36,6 +37,7 @@ class AdminPanelProvider extends PanelProvider
             ->pages([
                 Pages\Dashboard::class,
                 \App\Filament\Pages\InstallPluginPage::class,
+                Settings::class,
             ])
             ->discoverWidgets(in: app_path('Filament/Widgets'), for: 'App\\Filament\\Widgets')
             ->widgets([

database/migrations/2025_07_30_143255_create_settings_table.php

@@ -11,8 +11,11 @@ return new class extends Migration
      */
     public function up(): void
     {
-        Schema::table('styles', function (Blueprint $table) {
+        Schema::create('settings', function (Blueprint $table) {
-            $table->boolean('enabled')->default(true)->after('ai_model_id');
+            $table->id();
+            $table->string('key')->unique();
+            $table->text('value')->nullable();
+            $table->timestamps();
         });
     }
 
@@ -21,8 +24,6 @@ return new class extends Migration
      */
     public function down(): void
     {
-        Schema::table('styles', function (Blueprint $table) {
+        Schema::dropIfExists('settings');
-            $table->dropColumn('enabled');
-        });
     }
 };

database/migrations/2025_07_30_184244_add_enabled_to_ai_models_table.php

@@ -11,8 +11,8 @@ return new class extends Migration
      */
     public function up(): void
     {
-        Schema::table('styles', function (Blueprint $table) {
+        Schema::table('ai_models', function (Blueprint $table) {
-            $table->boolean('enabled')->default(true)->after('ai_model_id');
+            $table->boolean('enabled')->default(true)->after('model_type');
         });
     }
 
@@ -21,7 +21,7 @@ return new class extends Migration
      */
     public function down(): void
     {
-        Schema::table('styles', function (Blueprint $table) {
+        Schema::table('ai_models', function (Blueprint $table) {
             $table->dropColumn('enabled');
         });
     }

database/migrations/2025_07_30_201035_add_style_change_columns_to_images_table.php

@@ -0,0 +1,36 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     */
+    public function up(): void
+    {
+        Schema::table('images', function (Blueprint $table) {
+            $table->unsignedBigInteger('original_image_id')->nullable()->after('id');
+            $table->foreign('original_image_id')->references('id')->on('images')->onDelete('set null');
+            $table->unsignedBigInteger('style_id')->nullable()->after('original_image_id');
+            $table->foreign('style_id')->references('id')->on('styles')->onDelete('set null');
+            $table->boolean('is_temp')->default(false)->after('style_id');
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     */
+    public function down(): void
+    {
+        Schema::table('images', function (Blueprint $table) {
+            $table->dropForeign(['original_image_id']);
+            $table->dropColumn('original_image_id');
+            $table->dropForeign(['style_id']);
+            $table->dropColumn('style_id');
+            $table->dropColumn('is_temp');
+        });
+    }
+};

resources/js/Components/LoadingSpinner.vue

@@ -0,0 +1,30 @@
+<template>
+    <div class="fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+        <div class="bg-white p-6 rounded-lg shadow-lg text-center flex flex-col items-center">
+            <div class="loader ease-linear rounded-full border-4 border-t-4 border-gray-200 h-12 w-12 mb-4"></div>
+            <p class="text-gray-700 text-lg">{{ __('loading_spinner.processing_image') }}</p>
+        </div>
+    </div>
+</template>
+
+<script setup>
+// No script logic needed for a simple spinner
+</script>
+
+<style scoped>
+.loader {
+  border-top-color: #3498db; /* Blue color for the spinner */
+  -webkit-animation: spinner 1.5s linear infinite;
+  animation: spinner 1.5s linear infinite;
+}
+
+@-webkit-keyframes spinner {
+  0% { -webkit-transform: rotate(0deg); }
+  100% { -webkit-transform: rotate(360deg); }
+}
+
+@keyframes spinner {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}
+</style>

resources/js/Components/StyleSelector.vue

@@ -10,7 +10,7 @@
           v-for="style in styles"
           :key="style.id"
           class="style-item"
-          @click="$emit('styleSelected', style)"
+          @click="selectStyle(style)"
         >
           <img :src="'/storage/' + style.preview_image" :alt="style.title" class="style-thumbnail" />
           <div class="style-details">
@@ -29,6 +29,19 @@ import { ref, onMounted } from 'vue';
 
 const styles = ref([]);
 
+const props = defineProps({
+  position: {
+    type: Object,
+    required: true,
+  },
+  image_id: {
+    type: Number,
+    required: true,
+  },
+});
+
+const emits = defineEmits(['styleSelected', 'back', 'close']);
+
 const fetchStyles = () => {
   axios.get('/api/styles')
     .then(response => {
@@ -39,18 +52,14 @@ const fetchStyles = () => {
     });
 };
 
+const selectStyle = (style) => {
+  console.log('StyleSelector.vue: emitting styleSelected with image_id:', props.image_id);
+  emits('styleSelected', style, props.image_id);
+};
+
 onMounted(() => {
   fetchStyles();
 });
-
-const props = defineProps({
-  position: {
-    type: Object,
-    required: true,
-  },
-});
-
-const emits = defineEmits(['styleSelected', 'back', 'close']);
 </script>
 
 <style scoped>

resources/js/Components/StyledImageDisplay.vue

@@ -32,6 +32,8 @@ const props = defineProps({
 });
 
 const emits = defineEmits(['keep', 'delete']);
+
+console.log('StyledImageDisplay: image prop:', props.image);
 </script>
 
 <style scoped>

resources/js/Pages/Home.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="home">
     <div class="main-content">
-      <div class="gallery-container">
+      <div class="gallery-container" @touchstart="handleTouchStart" @touchend="handleTouchEnd">
-        <h1 class="text-2xl font-bold text-center my-4">{{ __('gallery_title') }}</h1>
+        <h1 class="text-2xl font-bold text-center my-4">Style Gallery</h1>
         <GalleryGrid :images="paginatedImages" @imageTapped="showContextMenu" />
         <Navigation 
           :currentPage="currentPage" 
@@ -25,6 +25,7 @@
     <StyleSelector 
       v-if="currentOverlayComponent === 'styleSelector'" 
       :position="contextMenuPosition" 
+      :image_id="selectedImage.image_id"
       @styleSelected="applyStyle" 
       @back="goBackToContextMenu" 
       @close="currentOverlayComponent = null" 
@@ -39,6 +40,8 @@
       @keep="keepStyledImage"
       @delete="deleteStyledImage"
     />
+
+    <LoadingSpinner v-if="isLoading" />
       </div>
 </template>
 
@@ -48,6 +51,7 @@ import GalleryGrid from '../Components/GalleryGrid.vue';
 import ImageContextMenu from '../Components/ImageContextMenu.vue';
 import StyleSelector from '../Components/StyleSelector.vue';
 import StyledImageDisplay from '../Components/StyledImageDisplay.vue'; // Import the new component
+import LoadingSpinner from '../Components/LoadingSpinner.vue'; // Import the new component
 import axios from 'axios';
 import { ref, computed, onMounted, onUnmounted } from 'vue';
 
@@ -59,7 +63,11 @@ const contextMenuPosition = ref({ x: 0, y: 0 });
 const selectedImage = ref(null);
 const styledImage = ref(null); // To store the newly styled image
 const errorMessage = ref(null); // New ref for error messages
+const isLoading = ref(false); // New ref for loading state
 let fetchInterval = null;
+let touchStartX = 0;
+let touchEndX = 0;
+
 
 const totalPages = computed(() => {
   return Math.ceil(images.value.length / imagesPerPage);
@@ -108,26 +116,27 @@ const goBackToContextMenu = () => {
   currentOverlayComponent.value = 'contextMenu';
 };
 
-const applyStyle = (style) => {
+const applyStyle = (style, imageId) => {
-  console.log('Applying style:', style.title, 'to image:', selectedImage.value);
+  console.log('Applying style:', style.title, 'to image:', imageId);
   currentOverlayComponent.value = null; // Close style selector immediately
-  // You might want to show a loading indicator here
+  isLoading.value = true; // Show loading spinner
 
   axios.post('/api/images/style-change', {
-    image_id: selectedImage.value.id,
+    image_id: imageId,
     style_id: style.id,
   })
   .then(response => {
     console.log('Style change request successful:', response.data);
-    // Assuming the response contains the new styled image data
+    styledImage.value = response.data.styled_image;
-    styledImage.value = response.data.styled_image; // Adjust based on your API response structure
+    currentOverlayComponent.value = 'styledImageDisplay';
-    currentOverlayComponent.value = 'styledImageDisplay'; // Show the new component
   })
   .catch(error => {
     console.error('Error applying style:', error);
     showError(error.response?.data?.error || 'Failed to apply style.');
+  })
+  .finally(() => {
+    isLoading.value = false; // Hide loading spinner
   });
-  currentOverlayComponent.value = null;
 };
 
 const keepStyledImage = (imageToKeep) => {
@@ -156,6 +165,26 @@ const nextPage = () => {
   }
 };
 
+const handleTouchStart = (event) => {
+  touchStartX = event.touches[0].clientX;
+};
+
+const handleTouchEnd = (event) => {
+  touchEndX = event.changedTouches[0].clientX;
+  handleSwipeGesture();
+};
+
+const handleSwipeGesture = () => {
+  const swipeThreshold = 50; // Minimum distance for a swipe
+  if (touchEndX < touchStartX - swipeThreshold) {
+    // Swiped left
+    nextPage();
+  } else if (touchEndX > touchStartX + swipeThreshold) {
+    // Swiped right
+    prevPage();
+  }
+};
+
 onMounted(() => {
   fetchImages();
   fetchInterval = setInterval(fetchImages, 5000);

resources/js/app.js

@@ -18,7 +18,11 @@ createInertiaApp({
             .mixin({
                 methods: {
                     __: (key, replace = {}) => {
-                        let translation = props.initialPage.props.translations[key] || key;
+                        let translation = props.initialPage.props.translations[key];
+
+                        if (translation === undefined) {
+                            translation = key; // Fallback to key if translation not found
+                        }
 
                         for (let placeholder in replace) {
                             translation = translation.replace(`:${placeholder}`, replace[placeholder]);

resources/lang/de/api.php

@@ -7,4 +7,5 @@ return [
     'image_kept_successfully' => 'Bild erfolgreich behalten.',
     'image_deleted_successfully' => 'Bild erfolgreich gelöscht.',
     'image_or_provider_not_found' => 'Bild oder API-Anbieter nicht gefunden.',
+    'no_styles_available' => 'Keine Stile oder API-Anbieter aktiviert/verfügbar.',
 ];

resources/lang/de/filament.php

@@ -7,12 +7,14 @@ return [
                 'name' => 'Name',
                 'model_id' => 'Modell ID',
                 'model_type' => 'Modell Typ',
+                'enabled' => 'Aktiviert',
                 'api_providers' => 'API Anbieter',
             ],
             'table' => [
                 'name' => 'Name',
                 'model_id' => 'Modell ID',
                 'model_type' => 'Modell Typ',
+                'enabled' => 'Aktiviert',
                 'api_providers' => 'API Anbieter',
             ],
         ],
@@ -123,4 +125,12 @@ return [
             ],
         ],
     ],
+    'styled_image_display' => [
+        'title' => 'Neu gestyltes Bild',
+        'keep_button' => 'Behalten',
+        'delete_button' => 'Löschen',
+    ],
+    'loading_spinner' => [
+        'processing_image' => 'Bild wird verarbeitet...',
+    ],
 ];

resources/lang/de/settings.php

@@ -0,0 +1,7 @@
+<?php
+
+return [
+    'gallery_heading' => 'Galerie Überschrift',
+    'saved_successfully' => 'Einstellungen erfolgreich gespeichert.',
+    'save_button' => 'Speichern',
+];

resources/lang/en/api.php

@@ -7,4 +7,5 @@ return [
     'image_kept_successfully' => 'Image kept successfully.',
     'image_deleted_successfully' => 'Image deleted successfully.',
     'image_or_provider_not_found' => 'Image or API provider not found.',
+    'no_styles_available' => 'No styles or API providers enabled/available.',
 ];

resources/lang/en/filament.php

@@ -7,12 +7,14 @@ return [
                 'name' => 'Name',
                 'model_id' => 'Model ID',
                 'model_type' => 'Model Type',
+                'enabled' => 'Enabled',
                 'api_providers' => 'API Providers',
             ],
             'table' => [
                 'name' => 'Name',
                 'model_id' => 'Model ID',
                 'model_type' => 'Model Type',
+                'enabled' => 'Enabled',
                 'api_providers' => 'API Providers',
             ],
         ],
@@ -100,4 +102,12 @@ return [
             ],
         ],
     ],
+    'styled_image_display' => [
+        'title' => 'Newly Styled Image',
+        'keep_button' => 'Keep',
+        'delete_button' => 'Delete',
+    ],
+    'loading_spinner' => [
+        'processing_image' => 'Processing image...',
+    ],
 ];

resources/lang/en/settings.php

@@ -0,0 +1,7 @@
+<?php
+
+return [
+    'gallery_heading' => 'Gallery Heading',
+    'saved_successfully' => 'Settings saved successfully.',
+    'save_button' => 'Save',
+];

resources/views/filament/resources/setting-resource/pages/settings.blade.php

@@ -0,0 +1,9 @@
+<x-filament-panels::page>
+    <form wire:submit.prevent="submit">
+        {{ $this->form }}
+
+        <x-filament::button type="submit" class="mt-4">
+            {{ __('settings.save_button') }}
+        </x-filament::button>
+    </form>
+</x-filament-panels::page>

routes/api.php

@@ -23,10 +23,9 @@ Route::middleware('auth:sanctum')->get('/user', function (Request $request) {
 // Publicly accessible routes
 Route::get('/images', [ImageController::class, 'index']);
 Route::get('/styles', [StyleController::class, 'index']);
+Route::post('/images/style-change', [ImageController::class, 'styleChangeRequest']);
 
 Route::middleware('auth:sanctum')->group(function () {
-    Route::post('/images/upload', [ImageController::class, 'upload']);
-    Route::post('/images/style-change', [ImageController::class, 'styleChangeRequest']);
     Route::post('/images/keep', [ImageController::class, 'keepImage']);
     Route::delete('/images/{image}', [ImageController::class, 'deleteImage']);
     Route::get('/images/status', [ImageController::class, 'getStatus']);

storage/framework/.gitignore

@@ -7,3 +7,6 @@ routes.php
 routes.scanned.php
 schedule-*
 services.json
+cache
+sessions
+views