redux dispatch works only in global scope nextjs

In my component I am able to dispatch my redux action and it works like it should.

export default function Skilling({ items, stats }) {
 const dispatch = useDispatch();
 dispatch(loginActions.fetchItems(items));
 dispatch(loginActions.getBalance(stats));
}

I also have a button with a buyItem() function. When clicking the button redux won´t dispatch. My function gets called in loginActions but no dispatch.

The same dispatch (dispatch(loginActions.fetchItems(items))) works in global scope.

export default function Skilling({ items, stats }) {
 const dispatch = useDispatch();
 dispatch(loginActions.fetchItems(items));   /* action works */
 dispatch(loginActions.getBalance(stats));   /* action works */
 async function buyItem(title) {
 if (title === "arg") {
 let { error } = await supabase
          .from("itemCollection")
          .upsert(updateSturmhaube, {
            returning: "minimal", // Don't return the value after inserting
          });

 dispatch(loginActions.fetchItems(items));   /* action not working */

 if (error) {
 throw error;
        }
      }

 return (
 <div> 
 <button
 onClick={() => buyItem("arg")}
 className="btn btn-light"
 >
        Button
 </button>
 </div>
      )
}
}