Composition API does not update the vue component as I add new item in the array

User.js

import {reactive} from "vue";
export default function Users() {
    let state = reactive({
        users: [{name: 'Shakil', email: 'shak@gmail.com'}]
    })
    function addUser() {
        state.users = [...state.users, {name: 'Ali', email: 'ali@gmail.com'}]
        console.log(state);
    }
    
    return {
        ...state,
        addUser
    }
}

Helloworld.vue

<template>
	<div>
    <h1>Hello composition API</h1>
    <div v-for="(user, index) in state.users" :key="index">
      {{user.name}}
    </div>
    <button @click="addUser">Add</button>
	</div>
</template>

<script>
import Users from "../modules/Users";
export default {
  
  setup(){
    const {state, addUser} = Users();
    console.log('hello world: ', state);
    return {
      state,
      addUser
    }
  }

};
</script>