[CLOSED] Custom Logo depending on the user

Hi All. In our app, a user can be an individual or part of an organisation. If they are part of an organisation, the logo of the website changes to the logo of the organisation. I can implement this easily, the problem is how it renders. If the logged in user is part of an organisation, there is 1-2 seconds where the “default logo” shows, and then changes to the logo of the organisation. How can I prevent the delay from happening and it just show the organisations logo immediately?

Currently its implemented with a custom state on an element which gets the users organisation and changes the logo accordingly. The state on the element is set by the page load event.

Any pointers greatfully received

Hey @dylanjhumphreys,

Not sure how your app is setup so I’m going to just make some assumptions

If you have a separate data type called organization, I’d imagine that you’d have a related field called organization connected to the user.

A few question: what’s the default logo? I’ll assume it’s the user’s avatar? You can probably just do user’s avatar as the default dynamic image then add a condition for when the current user’s organization is not empty to use the organization’s logo

I don’t imagine that the delay is too bad I think the custom state creates a longer delay? Not 100% about that though, just my assumption because it’ll need to pull the org data on page load, then set it as a custom state, then use the custom state as a reference to your image conditional

Hey Jonny, Yeah you’re on the right track. Sadly the client thinks the delay is “too bad” hence my question. Do you know of any event that fires before “page load”? That I could tie this to? or even delay rendering of the page until we’ve established what the logo should be?

You can display a loading screen?

Perhaps. It irks me because this would be trivial with code… but its a trade off… lots of other stuff would be a lot more complicated with code. The logo is a group containing a small image for the logo, and a text element to show the name of the company. Ive settled on using a default for the text. e.g. If the company name isnt defined then use the name of the site. For the logo, it assumes the user is part of an organisation and get the logo from the DB, if there is no organisation, it shows a default logo (the one for the site) as well as the blank logo image tag. This avoids things moving around after the page has loaded. Thanks for your time.