F
Filament•2mo ago
Oussama

Issue with schema reactivity in a custom page

Hello, I'm facing some difficulty in a custom page that loads dynamic schema form a builder. I've managed to reproduce in this simplified example. Using next and previous works fine, until I introduce a $this->content->getState to retrieve the data in the next method, at that point everything updates except the content schema, until I type something in a field then it will suddenly load the correct schema components. 
final class PreviewItem extends Page
{
    use InteractsWithRecord;

    #[Url(keep: true)]
    public int $stepIndex = 0;

    public array $data = [];

    protected static string $resource = ItemResource::class;

    protected string $view = 'filament.resources.orders.resources.items.pages.preview-item';

    public function mount(int | string $record): void
    {
        $this->record = $this->resolveRecord($record);
    }

    // This would be constructed from a json column containing a Filament Builder structure. Simplified for the sake of this example.
    public function getStepSchemaComponents(): array
    {
        return [
            [
                TextInput::make('some_text_input')
                    ->label('Text Input from Step 1'),
            ],
            [
                Textarea::make('some_textarea')
                    ->label('Textarea From Step 2'),
            ],
        ][$this->stepIndex];
    }

    public function content(Schema $schema): Schema
    {
        return $schema
            ->reactive()
            ->statePath('data')
            ->components(fn () => $this->getStepSchemaComponents());
    }

    public function next(): void
    {
        // it properly retrieves the input data but somehow the schema is not changing across steps.
        // if it's commented, going through the steps renders properly.
        $data = $this->content->getState();

        $this->stepIndex++;
    }

    public function previous(): void
    {
        $this->stepIndex--;
    }
}
final class PreviewItem extends Page
{
    use InteractsWithRecord;

    #[Url(keep: true)]
    public int $stepIndex = 0;

    public array $data = [];

    protected static string $resource = ItemResource::class;

    protected string $view = 'filament.resources.orders.resources.items.pages.preview-item';

    public function mount(int | string $record): void
    {
        $this->record = $this->resolveRecord($record);
    }

    // This would be constructed from a json column containing a Filament Builder structure. Simplified for the sake of this example.
    public function getStepSchemaComponents(): array
    {
        return [
            [
                TextInput::make('some_text_input')
                    ->label('Text Input from Step 1'),
            ],
            [
                Textarea::make('some_textarea')
                    ->label('Textarea From Step 2'),
            ],
        ][$this->stepIndex];
    }

    public function content(Schema $schema): Schema
    {
        return $schema
            ->reactive()
            ->statePath('data')
            ->components(fn () => $this->getStepSchemaComponents());
    }

    public function next(): void
    {
        // it properly retrieves the input data but somehow the schema is not changing across steps.
        // if it's commented, going through the steps renders properly.
        $data = $this->content->getState();

        $this->stepIndex++;
    }

    public function previous(): void
    {
        $this->stepIndex--;
    }
}
Am I missing something?
1 Reply
Oussama
OussamaOP•2mo ago
I've used unset($this->cachedSchemas['content']) to ensure it properly changes.

Did you find this page helpful?