Skip to content

Conversation

@davinotdavid
Copy link
Contributor

@davinotdavid davinotdavid commented Jan 6, 2026

Description of the Change

  • Removed the drop-down from UserAvatar and made it a link to TB Accounts' Dashboard instead per the issue description
  • Updated NavBarMobile's User Profile link to point to TB Accounts' Dashboard instead
  • Overrides UserAvatar in the NavBar to match Zeplin
  • Slightly increase the Appointment logo in the NavBar header to match Zeplin
  • Updates services-ui to 1.4.3
  • Fixes the styles for input[type="email] in the Booker's page (Tailwind upstream issues residue)
  • Removed the ProfileView route + component as it is now unreachable (it was present in the drop-down only)
  • Small refactor on NavBar and NavBarMobile tests
  • Make Booking Page URL in Settings page readonly

Note

Please update the frontend/.env file to include VITE_TB_ACCOUNT_DASHBOARD_URL=https://accounts.tb.pro/dashboard if you don't have it set to anything else.

Screenshots

Before / NavBar
image

After / NavBar
image

Benefits

  • More UI/UX cohesiveness according to the design team

Applicable Issues

Fixes #1388

Copy link
Collaborator

@devmount devmount left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I found one issue probably caused by the services-ui TextInput component. Can you check if this is the case? I can fix that component if applicable.

</label>
<div class="booking-page-url-input-container">
<text-input name="booking-page-url" class="booking-page-input" v-model="userStore.myLink" />
<text-input name="booking-page-url" class="booking-page-input" v-model="userStore.myLink" readonly />
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For some reason, this doesn't work on my end. It adds a readonly attribute on the label, not on the input... we might need to check services-ui for this issue.

I can still edit that input and get some error messages doing so:

Image

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh interesting! Here, the readonly attribute seems to be applied both to the label and the input itself for me 🤔 Even after you rebuild the containers with a docker compose up -d --build it still shows the error? I've deleted my containers just in case and it still works for me

// verify all expected router-link child components were rendered when signed in and menu is now shown
const expectedLinks = [
'dashboard', // there are two dashboard rounter-link child components
'dashboard', // there are two dashboard router-link child components
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

whoops, nice catch!

Copy link
Collaborator

@devmount devmount left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh and the user avatar has no href on my end. But I guess I need a corresponding .env entry for TB accounts, right?

@davinotdavid
Copy link
Contributor Author

Oh and the user avatar has no href on my end. But I guess I need a corresponding .env entry for TB accounts, right?

@devmount ah yes, I forgot to add this to the instructions in the PR, good catch! It needs a frontend/.env for the VITE_TB_ACCOUNT_DASHBOARD_URL. Updated in the PR description now!

Copy link
Collaborator

@devmount devmount left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ohh you're right! I did npm install but didn't restart the frontend container. Now everything works like a charm! Thanks!

Ah thanks for adding that env var, the link is now there too. Nothing to complain about anymore 😂 Thanks for the great work, approved!

@davinotdavid davinotdavid merged commit 29cd5e1 into main Jan 6, 2026
8 checks passed
@davinotdavid davinotdavid deleted the fix-avatar-link-back-to-tb-accounts branch January 6, 2026 18:01
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Ensure that the avatar in Appointment links back to TB Pro accounts.

2 participants