Fix inconsistent profile URL format between own and other users' profiles

- Update profile tab navigation to use consistent URL format for all users
- Redirect old /user/* routes to new format for backward compatibility
- Update all navigation points (dropdown menu, notifications) to use new URLs

website/client/src/components/achievements/onboardingComplete.vue

@@ -117,7 +117,7 @@ export default {
     closeWithAction () {
       this.close();
       setTimeout(() => {
-        this.$router.push({ name: 'achievements' });
+        this.$router.push(`/profile/${this.$store.state.user.data._id}#achievements`);
       }, 200);
     },
   },

website/client/src/components/header/notifications/onboardingComplete.vue

@@ -71,7 +71,7 @@ export default {
   props: ['notification', 'canRemove'],
   methods: {
     action () {
-      this.$router.push({ name: 'achievements' });
+      this.$router.push(`/profile/${this.$store.state.user.data._id}#achievements`);
     },
   },
 };

website/client/src/components/header/notifications/unallocatedStatsPoints.vue

@@ -43,7 +43,7 @@ export default {
   },
   methods: {
     action () {
-      this.$router.push({ name: 'stats' });
+      this.$router.push(`/profile/${this.$store.state.user.data._id}#stats`);
     },
   },
 };

website/client/src/components/header/userDropdown.vue

@@ -176,7 +176,12 @@ export default {
       }
     },
     showProfile (startingPage) {
-      this.$router.push({ name: startingPage });
+      const userId = this.$store.state.user.data._id;
+      let path = `/profile/${userId}`;
+      if (startingPage !== 'profile') {
+        path += `#${startingPage}`;
+      }
+      this.$router.push(path);
     },
     toLearnMore () {
       this.$router.push({ name: 'subscription' });

website/client/src/components/userMenu/profile.vue

@@ -1126,7 +1126,12 @@ export default {
     this.loadUser();
     this.oldTitle = this.$store.state.title;
     this.handleExternalLinks();
-    this.selectPage(this.startingPage);
+    // Check if there's a hash in the URL to determine the starting page
+    let pageToSelect = this.startingPage;
+    if (window.location.hash && (window.location.hash === '#stats' || window.location.hash === '#achievements')) {
+      pageToSelect = window.location.hash.substring(1);
+    }
+    this.selectPage(pageToSelect);
     this.$root.$on('habitica:report-profile-result', () => {
       this.loadUser();
     });
@@ -1211,10 +1216,15 @@ export default {
     },
     selectPage (page) {
       this.selectedPage = page || 'profile';
-      window.history.replaceState(null, null, '');
+      const profileUserId = this.userId || this.userLoggedIn._id;
+      let newPath = `/profile/${profileUserId}`;
+      if (page !== 'profile') {
+        newPath += `#${page}`;
+      }
+      window.history.replaceState(null, null, newPath);
       this.$store.dispatch('common:setTitle', {
         section: this.$t('user'),
-        subSection: this.$t(this.startingPage),
+        subSection: this.$t(page),
       });
     },
     getNextIncentive () {

website/client/src/router/index.js

@@ -98,6 +98,9 @@ const router = new VueRouter({
       path: '/profile/:userId',
       props: true,
     },
+    { name: 'profile', path: '/user/profile' },
+    { name: 'stats', path: '/user/stats' },
+    { name: 'achievements', path: '/user/achievements' },
     {
       path: '/inventory',
       component: InventoryContainer,
@@ -332,6 +335,10 @@ router.beforeEach(async (to, from, next) => {
     if (to.params.startingPage !== undefined) {
       startingPage = to.params.startingPage;
     }
+    // Check if there's a hash in the URL for stats or achievements
+    if (to.hash === '#stats' || to.hash === '#achievements') {
+      startingPage = to.hash.substring(1);
+    }
     if (from.name === null) {
       store.state.postLoadModal = `profile/${to.params.userId}`;
       return next({ name: 'tasks' });
@@ -352,10 +359,18 @@ router.beforeEach(async (to, from, next) => {
   }
 
   if ((to.name === 'stats' || to.name === 'achievements' || to.name === 'profile') && from.name !== null) {
+    const userId = store.state.user.data._id;
+    let redirectPath = `/profile/${userId}`;
+    if (to.name === 'stats') {
+      redirectPath += '#stats';
+    } else if (to.name === 'achievements') {
+      redirectPath += '#achievements';
+    }
     router.app.$emit('habitica:show-profile', {
+      userId,
       startingPage: to.name,
       fromPath: from.path,
-      toPath: to.path,
+      toPath: redirectPath,
     });
     return null;
   }