Why i can’t add any user to the list in this NEXT JS project using zustand?

Something is wrong, the users don’t update in the list.
home page
the form
files and folders

I try to put “use client” in the very top of each file, but nothing changed
i using lastest version of next by now
the console its showing just ‘[]’

import Link from "next/link";
import TestComponent from "./components/test-component";
import styles from "./page.module.css";
import useUserStore from "../stores/user";

export default function Home() {
  const users = useUserStore((state) => state.users);

  return (
    <div className={styles.app}>
      <h2>Lista de Usuários</h2>
        {users?.map((user) => (
          <p key={Math.random() + user.name}>
            {user.name} | {user.email}
      <Link href="/userform">UserForm</Link>

"use client";

import { create } from "zustand";

export interface UserType {
  name: string;
  email: string;

interface State {
  users: UserType[];
  addUser: (user: UserType) => void;

const useUserStore = create<State>((set) => ({
  users: [],
  addUser: (user: UserType) => {
    set((state) => ({ users: [...state.users, user] }));

export default useUserStore;

"use client";
import Link from "next/link";
import React from "react";
import styles from "../page.module.css";
import useUserStore from "../../stores/user";

const UserForm = () => {
  const addUser = useUserStore((state) => state.addUser);
  const users = useUserStore((state) => state.users);

  const onSubmit = (e: any) => {
    const name = (e.target as any).name.value;
    const email = (e.target as any).email.value;



  return (
    <div className={styles.app}>
      <form onSubmit={onSubmit} className={styles.form}>
        <input name="name" placeholder="Name" />
        <input name="email" placeholder="Email" />
        <button type="submit">CreateUser</button>
      <Link href="/">Home</Link>

export default UserForm;