JibayMcs
JibayMcs
PostsComments
FFilament
Created by Daniel Reales on 11/20/2024 in #❓┊help
resize textarea with wire:stream
Don't forget textarea.scrollTop = textarea.scrollHeight; in the autoResize funcion 😉
13 replies
FFilament
Created by Daniel Reales on 11/20/2024 in #❓┊help
resize textarea with wire:stream
Allright Here's a component I made with the same logic 🙂 
<textarea 
  wire:stream="content"
  id="textarea"
  x-data="{
    init: function() {
        const textarea = document.getElementById('textarea');

        function autoResize() {
            if (textarea.value.trim() === '') {
                textarea.style.height = '60px';
            } else {
                textarea.style.height = 'auto';
                textarea.style.height = textarea.scrollHeight + 'px';
            }

            // Scroll to the bottom of the textarea
            textarea.scrollTop = textarea.scrollHeight;
        }

        autoResize();

        const observer = new MutationObserver(function(mutations) {
            mutations.forEach(function(mutation) {
                if (mutation.type === 'childList' || mutation.type === 'characterData') {
                    autoResize();
                }
            });
        });

        observer.observe(textarea, {
            characterData: true,
            subtree: true,
            childList: true
        });

        textarea.addEventListener('input', autoResize, false);
    }
  }"
></textarea>
<textarea 
  wire:stream="content"
  id="textarea"
  x-data="{
    init: function() {
        const textarea = document.getElementById('textarea');

        function autoResize() {
            if (textarea.value.trim() === '') {
                textarea.style.height = '60px';
            } else {
                textarea.style.height = 'auto';
                textarea.style.height = textarea.scrollHeight + 'px';
            }

            // Scroll to the bottom of the textarea
            textarea.scrollTop = textarea.scrollHeight;
        }

        autoResize();

        const observer = new MutationObserver(function(mutations) {
            mutations.forEach(function(mutation) {
                if (mutation.type === 'childList' || mutation.type === 'characterData') {
                    autoResize();
                }
            });
        });

        observer.observe(textarea, {
            characterData: true,
            subtree: true,
            childList: true
        });

        textarea.addEventListener('input', autoResize, false);
    }
  }"
></textarea>
13 replies
FFilament
Created by Daniel Reales on 11/20/2024 in #❓┊help
resize textarea with wire:stream
#textarea-container is the component you want to scroll on the bottom of, right ? Or you want to scroll continuously on the bottom of your textarea while streaming content ?
13 replies
FFilament
Created by Daniel Reales on 11/20/2024 in #❓┊help
resize textarea with wire:stream
Maybe using this function aside of the resize can help to scroll to bottom ? 
scrollToBottom(container) {
    let container = document.getElementById('#textarea-container');
    container.scrollTop = container.scrollHeight;
},
scrollToBottom(container) {
    let container = document.getElementById('#textarea-container');
    container.scrollTop = container.scrollHeight;
},
13 replies
FFilament
Created by Daniel Reales on 11/20/2024 in #❓┊help
resize textarea with wire:stream
It's from head, so it's maybe not working :/
13 replies
FFilament
Created by Daniel Reales on 11/20/2024 in #❓┊help
resize textarea with wire:stream
Maybe listen/observe changes on the textarea like this (it's an function called in the x-data): 
function textareaResizer() {
    return {
        init() {
            const observer = new MutationObserver(() => {
                this.resize();
            });

            observer.observe(messagesContainer, {
                childList: true,
                subtree: true,
            });

            // Initial resize, optional
            this.resize();
        },
        resize() {
            $el.style.height = '0px';
            $el.style.height = $el.scrollHeight + 'px';
        }
    };
}
function textareaResizer() {
    return {
        init() {
            const observer = new MutationObserver(() => {
                this.resize();
            });

            observer.observe(messagesContainer, {
                childList: true,
                subtree: true,
            });

            // Initial resize, optional
            this.resize();
        },
        resize() {
            $el.style.height = '0px';
            $el.style.height = $el.scrollHeight + 'px';
        }
    };
}
13 replies
FFilament
Created by bas on 11/7/2024 in #❓┊help
move table header action next to searchbar
No description
4 replies
FFilament
Created by TranceCode on 11/5/2024 in #❓┊help
How can add a new button in the login for different panel?
Here's the source: https://filamentphp.com/docs/3.x/support/render-hooks !
10 replies
FFilament
Created by TranceCode on 11/5/2024 in #❓┊help
How can add a new button in the login for different panel?
https://tenor.com/view/problematic-stressed-smh-oh-dear-gif-16340466090647037797
10 replies
FFilament
Created by TranceCode on 11/5/2024 in #❓┊help
How can add a new button in the login for different panel?
No description
10 replies
FFilament
Created by TranceCode on 11/5/2024 in #❓┊help
How can add a new button in the login for different panel?
Then call your newly fresh Login page in your panel provider like this: 
class DefaultPanelProvider extends PanelProvider
{
    public function panel(Panel $panel): Panel
    {
        return $panel
            ->default()
            ->id('default')
            ->path('/')
            ->login(\Your\New\Login::class)
            [...];
    }
}
class DefaultPanelProvider extends PanelProvider
{
    public function panel(Panel $panel): Panel
    {
        return $panel
            ->default()
            ->id('default')
            ->path('/')
            ->login(\Your\New\Login::class)
            [...];
    }
}
And voilà !
10 replies
FFilament
Created by TranceCode on 11/5/2024 in #❓┊help
How can add a new button in the login for different panel?
Hi ! Override the class Filament\Pages\Auth\Login (Livewire component) and the view too vendor/filament/filament/resources/views/pages/auth/login.blade.php
10 replies
FFilament
Created by Moktar on 11/5/2024 in #❓┊help
manually refresh table content
So you can easylly use it in a custom Action
10 replies
FFilament
Created by Moktar on 11/5/2024 in #❓┊help
manually refresh table content
I use it in a custom page using HasTable implementation (https://filamentphp.com/docs/3.x/tables/adding-a-table-to-a-livewire-component) In combination with a Form and their input being updated: 
public function updated($name, $value)
    {
        if (in_array($name, ['startDate', 'endDate', 'filterQueries', 'ignoredSenders', 'allowedFolders', 'microsoftGraphUserId'])) {

            if ($name === 'startDate' || $name === 'endDate') {
                $this->data[$name] = Carbon::parse($value);
            
            } else {
                $this->data[$name] = $value;
            }
            //Here the magic happens
            $this->dispatch('refreshTable');
        }
    }
public function updated($name, $value)
    {
        if (in_array($name, ['startDate', 'endDate', 'filterQueries', 'ignoredSenders', 'allowedFolders', 'microsoftGraphUserId'])) {

            if ($name === 'startDate' || $name === 'endDate') {
                $this->data[$name] = Carbon::parse($value);
            
            } else {
                $this->data[$name] = $value;
            }
            //Here the magic happens
            $this->dispatch('refreshTable');
        }
    }
10 replies
FFilament
Created by Moktar on 11/5/2024 in #❓┊help
manually refresh table content
HI ! This is how I do this logic in my projects: 
#[On('refreshTable')] // Listening to an event here
public function refreshTable()
{
    $this->loadTable();
    // or
    $this-resetTable();
}
#[On('refreshTable')] // Listening to an event here
public function refreshTable()
{
    $this->loadTable();
    // or
    $this-resetTable();
}
10 replies
FFilament
Created by Abdellah on 10/30/2024 in #❓┊help
Textarea value from api
Please, give me more context, it's inside a Resource ? A custom Livewire table ?
13 replies
FFilament
Created by Abdellah on 10/30/2024 in #❓┊help
Textarea value from api
Hi ! Try using this: 
->formatStateUsing(function(Get $get) {
  if($get('credential_id')) {
    //...
    return $client?->getSshKeys()?->first()['public_key'];
  }
})
->formatStateUsing(function(Get $get) {
  if($get('credential_id')) {
    //...
    return $client?->getSshKeys()?->first()['public_key'];
  }
})
13 replies
FFilament
Created by ChesterS on 10/28/2024 in #❓┊help
Save form from a header action
De nada !
10 replies
FFilament
Created by ChesterS on 10/28/2024 in #❓┊help
Save form from a header action
😄
10 replies
FFilament
Created by ChesterS on 10/28/2024 in #❓┊help
Save form from a header action
(not tested)
10 replies