How to get the value from a proxy object in Vue js

I am trying to return a value from a proxy object but it return undefined.

This is my code

<script setup>
const props = defineProps({status:Object});
    
function getColor(items){
    const currentStatus = props.status;

    const output = currentStatus.filter((item)=>{
            if(items.status === item.status){
                return item
            }
    })

    return output.color;
}

</script>

<template>
    <div class="p-5">
         <v-data-table
             :search="search"
             :headers="headers"
             :items="transactions">
             <template v-slot:[`item.status`]="{item}">
                 <v-chip :color="getColor(item)" variant="elevated" label>{{ item.status }}</v-chip>
             </template>
         </v-data-table>
    </div>
</template> 

this is the snap image of the data am getting after the filter

I hope someone will point out what missing here.

thanks