Не получается передать данные из laravel в router vue js

грубо говоря передаю данные юзера через welcome.blade.php в appcomponent:

<div id="app">
<app-component :user='@json($user)'></app-component>
</div>
в компоненте передаю данные в футер

<template>
<div id="app">
<router-view :user="user"></router-view>
<app-footer :user="user"></app-footer>
</div>
</template>
<script>
import AppFooter from './AppFooter.vue';

export default {
name: 'AppComponent',
props: {
user: {
type: Object,
required: true
}
},
components: {
AppFooter
}
};
</script>
через футер у меня происходит смена основного контента на экране через маршруты

data() {
return {
buttons: [
{ icon: homeIcon, text: "Home", route: "/" },
{ icon: walletIcon, text: "Wallet", route: "/wallet" },
{ icon: userIcon, text: "Profile", route: "/account" }
]
};
},
methods: {
navigateTo(route) {
this.$router.push({
path: route,
props: { user: this.user }
});
}
}
вот мой роутер

import { createRouter, createWebHistory } from 'vue-router';
import Home from './components/Home.vue';
import Wallet from './components/Wallet.vue';
import Account from './components/Account.vue';

const routes = [
{
path: '/',
name: 'Home',
component: Home
},
{
path: '/wallet',
name: 'Wallet',
component: Wallet
},
{
path: '/account',
name: 'Account',
component: Account,
props: true
}
];

const router = createRouter({
history: createWebHistory(),
routes
});

export default router;
вся проблема в том, что не открывается страница account я так понимаю что не передается туда user помогите, что сделал не так в передаче данных