Filament•4w ago

spatie translatable on custom page

I have custom page for manage home page content like bellow, i want to make it support multilingual with filament-spatie-translatable without change it into resource, how to do it?

<?php

namespace App\Filament\Pages;

use App\Models\HomeContent;
use Filament\Actions\Action;
use Filament\Forms\Components\FileUpload;
use Filament\Forms\Components\Textarea;
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;

class HomeContentPage extends Page implements HasForms
{
    use InteractsWithForms;

    protected static ?string $navigationIcon = 'heroicon-o-home-modern';

    protected static string $view = 'filament.pages.home-content';

    protected static ?string $title = 'Home Content';

    protected static ?string $navigationGroup = 'Settings';

    public ?array $data = [];

    public function mount(): void
    {
        $this->data = HomeContent::first()?->toArray();
        $this->form->fill($this->data);
    }

    public function form(Form $form): Form
    {
        return $form
            ->schema([
                TextInput::make('title')
                    ->required(),
                Textarea::make('description')
                    ->required(),
                FileUpload::make('background')
                    ->image()
                    ->required(),
            ])
            ->statePath('data');
    }

    ...
}

<?php

namespace App\Filament\Pages;

use App\Models\HomeContent;
use Filament\Actions\Action;
use Filament\Forms\Components\FileUpload;
use Filament\Forms\Components\Textarea;
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;

class HomeContentPage extends Page implements HasForms
{
    use InteractsWithForms;

    protected static ?string $navigationIcon = 'heroicon-o-home-modern';

    protected static string $view = 'filament.pages.home-content';

    protected static ?string $title = 'Home Content';

    protected static ?string $navigationGroup = 'Settings';

    public ?array $data = [];

    public function mount(): void
    {
        $this->data = HomeContent::first()?->toArray();
        $this->form->fill($this->data);
    }

    public function form(Form $form): Form
    {
        return $form
            ->schema([
                TextInput::make('title')
                    ->required(),
                Textarea::make('description')
                    ->required(),
                FileUpload::make('background')
                    ->image()
                    ->required(),
            ])
            ->statePath('data');
    }

    ...
}

i have add the header action and trait but still doesnt work

use Filament\Actions\LocaleSwitcher;
use Filament\Resources\Concerns\Translatable;
...
class HomeContentPage extends Page implements HasForms
{
    use InteractsWithForms, Translatable;

    ....
    protected function getHeaderActions(): array
    {
        return [
            LocaleSwitcher::make(),
        ];
    }
}

use Filament\Actions\LocaleSwitcher;
use Filament\Resources\Concerns\Translatable;
...
class HomeContentPage extends Page implements HasForms
{
    use InteractsWithForms, Translatable;

    ....
    protected function getHeaderActions(): array
    {
        return [
            LocaleSwitcher::make(),
        ];
    }
}

Filament

Spatie Translatable by Filament - Filament

Filament support for Spatie's Laravel Translatable package.

9 Replies

holiqOP•4w ago

I have try this plugin on my resource and it work, but I have issue on my custom page

Lara Zeus•4w ago

any error messages? I think translatable only works with Resources only in custom pages you can use any translatable field and it will works

holiqOP•4w ago

No, it show the select for change language but if I change the language the form doesn't changed I think it so only works in resource, do you have any idea for translation in custom page?

Lara Zeus•4w ago

I'll try to look into it later, for now you can use any translatable field like https://filamentphp.com/plugins/abdulmajeed-jamaan-translatable-tabs without the local switcher

holiqOP•4w ago

Okay thank you I have try that and it works on me, but when I use on repeat it doesn't work on edit, the value on repeater not appear but in database it store correctly, how to resolve it?

holiqOP•4w ago

After save it store in database with format like

{"en": [{"image": null, "title": {"en": "this the title", "id": null}, "content": {"en": "this is a content", "id": null}}]}

{"en": [{"image": null, "title": {"en": "this the title", "id": null}, "content": {"en": "this is a content", "id": null}}]}

holiqOP•4w ago

When I refresh the page for edit the content of repeater, the value doesn't appear

Mohamed Ayaou•4w ago

I think it's a conflict between the plugin you are using and the spatie translatable plugin

Lara Zeus•4w ago

can you try using my fork of the plugin: https://github.com/lara-zeus/translatable I would appreciate if you can share some code that I can copy to test

Gaming

Programming

spatie translatable on custom page

Did you find this page helpful?