Custom Profile Page for logged in user
So I've followed the docs to create a custom EditProfile page: https://filamentphp.com/docs/3.x/panels/users#customizing-the-authentication-features
But I can't figure out how to do 2 things:
- how to add a link to this page to the sidebar
- make it a regular page instead of being a modal
Thank you
47 Replies
@diogogomes I was having issues as well because the documentation showed the wrong way (at least for a tenant/panel) to provide a custom profile page:
1. Make a regular page for your profile.
2. Use this in your panel:
I did this earlier. What I did was extend
Filament\Pages\Auth\EditProfile
like this:
This gives you the default form and sets the layout back to being a normal panel page instead of the empty layout used by default.
For your view, you can do:
which would be the default. You can probably just remove the subheading containing the back button. In my class, I set title
to an empty string to get rid of the default header. Otherwise, just pass your new class to $panel->profile()
like:
I’m not sure if this is the correct way to do it, but just making a regular page and replacing the profile page in the user menu worked…
i wanted to take advantage of how they handle some some of the components in core and its really just a normal page under neath if you look at its extends
EditProfile is a BasePage
the big thing is just changing the
$layout
to not be the empty one it uses by defaultI wasn’t a big fan of the base edit profile page. It’s almost like the login page layout, which I don’t understand really. Plus the new password component updating visibility seemed weird to me.
So I replaced all of it
i do agree the password component is weird, but yeah you can do it 100% custom by just extending it and changing the layout
Alright cool because with the way I was doing it, which I think is the documented way, it would return me to the login page after changing my data.
yeah extending https://github.com/filamentphp/filament/blob/3.x/packages/panels/src/Pages/Auth/EditProfile.php fixes that i think
GitHub
filament/packages/panels/src/Pages/Auth/EditProfile.php at 3.x · fi...
A collection of beautiful full-stack components for Laravel. The perfect starting point for your next app. Using Livewire, Alpine.js and Tailwind CSS. - filamentphp/filament
specifically https://github.com/filamentphp/filament/blob/3.x/packages/panels/src/Pages/Auth/EditProfile.php#L135-L139 probably if ur changing passwords
But like it wouldn’t show my data being saved, I would refresh the page and I would get an error saying login route not found…
yeah just extend it like my example and then call it on
$panel->profile()
should work a treat. you dont need to use the default forms if you dont want too.
and it will do it with the menu bar properly, etc.Yeah the GitHub link you sent didn’t work either
But okay will try this soon and let you know
Thanks
np let me know how it goes. my profile is pretty custom at this point and haven't had any issues
Can you send me a pic of what it looks like? Is it in the panel?
removed logo/data cuz i dont wanna get yelled at
but yeah just a normal page now
with some sections
Looks nice! Very good
ty
Have you figured out how to separate the save action to be for each form section?
hmm – i do that on a few of my custom apps but dont really need to on this. it looks like
handleRecordUpdate()
handles the default update behavior on the EditProfile class that you extend.
generally, you could probably just do this with basic livewire since you have access to the user with $record
and just plop your buttons in and wire them up.
although i do see $data gets passed to handleRecordUpdate, not sure where it comes from
i assume its on the class somewhere or the attributes exist under the hood? i haven't used filament long enough to know the inner workings yet
but the whole page is a livewire component so you can generally do whatever you wantYeah might have to do that for myself. For me, I would think it would confuse the user to have that many separate sections for one save button. Like imagine having to change a password only and everything else is empty
that or theres probably a custom action or something
oh nevermind i read it wrong, so yeah – i think you'd just .. do it with livewire lol
https://github.com/filamentphp/filament/blob/3.x/packages/panels/src/Pages/Auth/EditProfile.php#L262-L268 you can do an action like this to handle the submit behavior
GitHub
filament/packages/panels/src/Pages/Auth/EditProfile.php at 3.x · fi...
A collection of beautiful full-stack components for Laravel. The perfect starting point for your next app. Using Livewire, Alpine.js and Tailwind CSS. - filamentphp/filament
but whether its necessary idk
sorry fixed my link
I gotcha. Thanks again
np
Hey thank you for the help. I'm still stuck with it. Seems that I need to overwrite a lot of things just to have a simple edit profile page
Yep
I already have a edit profile page. I've follow the documentation
but the link is on the top nav bar
I just want to have another link on the main sidebar to trigger that edit profile
Wont work the way I want it to. Well I got it working but not the way I wanted to because since it was a custom page the tenant ID has to be attached to the url…
seems that it should be simpler than this
Do you have tenancy in the panel you have the profile page in?
If not then you should have no problems with it… I can give you what I did if you want
Nop, I don't have tenancy. This panel is specific to the logged in user.
Let me try to add the link first. I already have the edit profile page working. But thank you 🙏
Wait so what are you having problems with then?
I'm a noob with filament 🙂
I've already have the custom edit profile page.
I've followed this instructions: https://filamentphp.com/docs/3.x/panels/users#customizing-the-authentication-features
But I would like to also add a link for editing the profile on the sidebar navigation
Thank you. I've just found out that I was adding user menu items instead of a navigation item 🤦♂️
Problem solved. Thank you
Cool. Please mark this as answered to help our support team.
Yes, I was trying to figure out how to mark yours
I'm getting this error when i try to type inside new password field.
I figured out the error. if you using multiple panels you need to create
EditProfile.php
inside App\Filament\[Your-Panel-Name\Pages\Auth
This page looks great. May be you should write a blog post explaining how you built it. I am sure it will help a lot of us 🫡
This profile page feels so un-filament-like 🤨 . Most likely there's thought behind it but I don't get it 😅