telekom-profile-menu

[EdsonT-Systems]

Scale Version
Latest

Framework and version
Angular latest with auto-generated scale wrapper packages

Current Behavior
A clear description of what the bug is and how it manifests.

• If I try not to use properties like serviceLinks(because for this app I don't need them), the component doesn't render.

• I can't find a way to correctly apply the logoutHandler method to implement the logout logic because it doesn't recognize that function.

Expected Behavior

• I am trying to apply a logout logic with the previously mentioned method, but the component doesn't allow me to.

Code Reproduction

Desktop (please complete the following information):

• OS: [windows]
• Browser [ chrome,]
• Version [latest]

[tshimber]

hi @EdsonT-Systems !

1. I've checked: no serviceLinks should work fine, but it fails without userInfo. I've pushed a fix, we will deploy new release in a while. If it fails for you with userInfo, please provide usage example, I'll check again

If you wanna provide userInfo in Angular:
template:
[userInfo]="userInfo"
ts:
get userInfo() { return { name: 'Alexander Dreyer', email: 'alexander.dreyer@t-online.de', }; }

2. also provide the example how you use logoutHandler, please. For me it works fine in Angular:
   template:
   [logoutHandler]="handlerFunc"
   ts:
   handlerFunc(): void { console.log('LOGOUT'); }

note that if you provide logoutHandler, logoutUrl won't work -- these are alternative options

[EAristiguieta]

Hi @tshimber

Well, after trying many options, I decided to use personalize component because the option you mentioned using the function works in the case of the console.log, but the navigation I am trying to do doesn't work properly since it doesn't render the rest of the components correctly. It's hard to explain with images, but basically, I tried the navigation using that function in that component, and it didn't work. I did it with custom components, and it worked fine.

Example:

1-Using the [logoutHandler]="handlerFunc"

-Ts:

-Html:

-Ui:

-At this moment when the log out its clicked

The navigation result when the button its clicked is this:

2-Using the personalize button component

-Ts:

-Html:

-Ui:

The result when the button its clicked:

[EAristiguieta]

Besides of that, the component without serviceLinks does not render.

Html:

UI:

-With the service links:

Html:

Ui:

Even if they are empty, I need to have them; otherwise, it won't render.

Ts:

[tshimber]

hi @EdsonT-Systems !
about serviceLinks - i've got it, it's ok with no serviceLinks, but fails with no serviceLinks + hide-login-settings="true", I haven't checked this case, same as previous developers I guess. I'll fix it.

as for handlerFunc- I guess more debugging is needed for your case:( func itself works fine, context is in there if you use arrow func, so it's not smth with logoutHandler prop itself, but with further logic?..

-->

[EAristiguieta]

Thanks!

About the handler func, its tricky, and I haven't find a solution using the scale component only. Using the handlerFunc on other component like a normal button with a click action and it works fine, but using it on the scale component and it does not :(.

[EdsonT-Systems]

Hi again @tshimber , after a lot of testing, I haven't found a solution to make the logout function work correctly so that the navigation functions properly and the other components have enough time to render.

The ts and the template look like this:

• Case 1 Logout bottom(scale-telekom-profile-menu):

Ui:

-The behavior is that it redirects you and displays the console msg, and it also executes the internal logic. However, when the navigation occurs, the surrounding components do not render correctly.

Example:

• Case 2 Logout bottom(normal botton)

Ui:

-However, when the same action is triggered by a click event (in parentheses), it executes without any issues, performing the same action and rendering the rest of the components properly.

Example:

[EdsonT-Systems]

Would it be possible for you or one of the members of the Scale team to have a brief call where I can explain this? It's just that in the internal project I'm working on, the team really needs this functionality. @tshimber @acstll @felix-ico @amir-ba