feat(front-shared-auth): edit user data in ProfileComponent
spy4x opened this issue · 0 comments
Features:
- Edit fields
- firstName
- lastName
- photoURL
- Delete account
Steps:
- Add form with first name, last name and photoURL (just text for now) fields to In shared component
libs/front/shared/auth/ui/src/lib/profile/profile.component.html
.
Look at libs/front/web/auth/src/lib/create-profile/create-profile.component.html
as an example.
Note: you'll need to define a form = new FormGroup({...});
in TS file to make HTML form fields work.
-
Define
@Output() update = new EventEmitter<User>();
and@Input() isSaving = false
for delegating a parent component (libs/front/web/profile/src/lib/profile/profile.component.html
) to handle the logic and provide a loading state back to this component. -
Implement necessary NGRX actions, effects, and selectors to handle the REST API interaction. Folder:
libs/front/shared/auth/state/src/lib/+state
-
Use implemented action and selector in
libs/front/web/profile/src/lib/profile/profile.component.ts
to initiate an update and watch the loading state. Check if it works. Repeat inlibs/front/admin/profile/src/lib/profile/profile.component.html
The final result will look similar to the "Create Profile" component, just with photoURL
field instead of email
: