wip

resources/views/components/modal.blade.php

@@ -2,7 +2,7 @@
     class="fixed inset-0 z-30 flex items-center justify-center overflow-auto bg-black bg-opacity-50"
     x-show="modal === '{{ $name }}'"
 >
-    <div class="min-w-[400px] min-h-[400px] max-w-3xl px-6 py-4 mx-auto text-left bg-white rounded shadow-lg" @click.outside="modal = false">
+    <div class="min-w-[600px] min-h-[400px] max-w-3xl px-6 py-4 mx-auto text-left bg-white rounded shadow-lg" @click.outside="modal = false">
         {{ $slot }}
     </div>
 </div>

resources/views/livewire/add-language.blade.php

@@ -0,0 +1,9 @@
+<x-translation::modal name="add-language">
+    <h2>Add a new language</h2>
+
+    <form wire:submit="add" @submit="modal = false">
+        <input wire:model="language" type="text" placeholder="en_US" class="w-full px-2 py-1 bg-gray-50 rounded text-gray-700 group-hover:bg-white focus:bg-white">
+
+        <button type="submit">Add</button>
+    </form>
+</x-translation::modal>

resources/views/livewire/translations.blade.php

@@ -1,5 +1,5 @@
 <div class="w-full flex flex-col" x-data="{ modal: false }">
-    <x-translation::add-language />
+    <livewire:translation::add-language />
 
     <x-translation::add-translation />
 

src/Livewire/AddLanguage.php

@@ -0,0 +1,31 @@
+<?php
+
+namespace JoeDixon\Translation\Livewire;
+
+use Illuminate\Contracts\View\View;
+use JoeDixon\TranslationCore\TranslationManager;
+use Livewire\Component;
+
+class AddLanguage extends Component
+{
+    public $language;
+
+    /**
+     * Render the component.
+     */
+    public function render(): View
+    {
+        return view('translation::livewire.add-language');
+    }
+
+    /**
+     * Add a new language.
+     */
+    public function add(): void
+    {
+        app(TranslationManager::class)
+            ->addLanguage($this->language);
+
+        $this->dispatch('language-added'); 
+    }
+}

src/Livewire/Translations.php

@@ -7,6 +7,7 @@
 use JoeDixon\TranslationCore\TranslationManager;
 use Livewire\Attributes\Computed;
 use Livewire\Attributes\Layout;
+use Livewire\Attributes\On;
 use Livewire\Attributes\Url;
 use Livewire\Component;
 
@@ -68,4 +69,10 @@ public function translateStringKey(TranslationManager $translation, string $key,
     {
         $translation->addStringKeyTranslation($this->language, $key, $value, $vendor);
     }
+
+    #[On('language-added')]
+    public function updateLanguages(): void
+    {
+        $this->languages = app(TranslationManager::class)->languages();
+    }
 }

src/TranslationServiceProvider.php

@@ -3,6 +3,7 @@
 namespace JoeDixon\Translation;
 
 use Illuminate\Support\ServiceProvider;
+use JoeDixon\Translation\Livewire\AddLanguage;
 use JoeDixon\Translation\Livewire\Translations;
 use JoeDixon\TranslationCore\Configuration;
 use JoeDixon\TranslationCore\TranslationProvider;
@@ -35,6 +36,7 @@ public function boot()
         $this->registerTranslationProvider();
 
         Livewire::component('translation::translations', Translations::class);
+        Livewire::component('translation::add-language', AddLanguage::class);
     }
 
     /**