Getting “ReferenceError: (x) is not defined” after passing object via props in Vue3

I’ve a vue page & vue component. The vue Page, is getting data via Firebase and passing hte object as a prop to a component. When accessing the prop, within the components template area, I don’t get any errors. But when accessing the same prop in the script setup, I get ReferenceError. Could you help me understand what I am doing wrong?

Vue Page:

<script setup lang="ts">
import { getProfile, profile } from '/@src/composable/useProfiles'

const params = new URL(location.href).searchParams.get('id')

onMounted(async () => { 
  getProfile(params);
})

</script>

<template>
  <div class="page-content-inner">
    <Core-MyProfile v-if="!params" />
    <Core-UserProfile v-if="params" :profile="profile"/>
  </div>
</template>

Vue Component:

<script setup lang="ts">
import { computed, ref, onMounted } from "vue";

const props = defineProps({
  profile: {
    type: Object,
    required: true,
  },
})

const sellPoints = props.profile.tribute.sell.current
const timePoints = props.profile.tribute.time.current
const usePoints = props.profile.tribute.use.current

const totalPoints = computed(
  () => sellPoints+timePoints+usePoints
);

</script>

Errors:


runtime-core.esm-bundler.js:38 [Vue warn]: Invalid prop: type check failed for prop "profile". Expected Object, got Undefined  
  at <CoreUserProfile key=1 profile=undefined > 
  at <Index onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > key="/profile?id=FC9gNTJ7D2hMaBcna9ILTGyxB3E2" > 
  at <BaseTransition mode="out-in" appear=false persisted=false  ... > 
  at <Transition name="fade-fast" mode="out-in" > 
  at <RouterView> 
  at <HomeLayout> 
  at <Profile onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > > 
  at <BaseTransition mode="out-in" appear=false persisted=false  ... > 
  at <Transition name="fade-slow" mode="out-in" > 
  at <RouterView> 
  at <App>

---

runtime-core.esm-bundler.js:38 [Vue warn]: Unhandled error during execution of setup function 
  at <CoreUserProfile key=1 profile=undefined > 
  at <Index onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > key="/profile?id=0TCIgQZxy5YJqyXNMZQqkBQhZv13" > 
  at <BaseTransition mode="out-in" appear=false persisted=false  ... > 
  at <Transition name="fade-fast" mode="out-in" > 
  at <RouterView> 
  at <HomeLayout> 
  at <Profile onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > > 
  at <BaseTransition mode="out-in" appear=false persisted=false  ... > 
  at <Transition name="fade-slow" mode="out-in" > 
  at <RouterView> 
  at <App>

---

Core-UserProfile.vue:12 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'tribute')
    at setup (Core-UserProfile.vue:12:34)
    at callWithErrorHandling (runtime-core.esm-bundler.js:155:22)
    at setupStatefulComponent (runtime-core.esm-bundler.js:7165:29)
    at setupComponent (runtime-core.esm-bundler.js:7120:11)
    at mountComponent (runtime-core.esm-bundler.js:5473:13)
    at processComponent (runtime-core.esm-bundler.js:5448:17)
    at patch (runtime-core.esm-bundler.js:5038:21)
    at mountChildren (runtime-core.esm-bundler.js:5234:13)
    at mountElement (runtime-core.esm-bundler.js:5143:17)
    at processElement (runtime-core.esm-bundler.js:5115:13)