Big Updated, added some tests, added comments for all functions, I forgot the rest

packages/user/src/context.tsx

@@ -12,11 +12,21 @@ interface contextValue {
 
 const UserContext = React.createContext<contextValue | undefined>(undefined);
 
+/**
+ * Executes UserProvider.
+ * @param props Parameter props.
+ * @returns unknown.
+ */
 export default function UserProvider(props: { children: React.ReactNode }) {
   const storageRef = React.useRef<Record<number, User>>({});
 
   const { send } = useSocket();
 
+  /**
+   * Executes get.
+   * @param userId Parameter userId.
+   * @returns Promise<User>.
+   */
   async function get(userId: number): Promise<User> {
     if (storageRef.current[userId] === undefined) {
       const userData = await send("get_user_data", { user_id: userId });
@@ -40,6 +50,11 @@ export default function UserProvider(props: { children: React.ReactNode }) {
   );
 }
 
+/**
+ * Executes useUser.
+ * @param none This function has no parameters.
+ * @returns contextValue.
+ */
 export function useUser(): contextValue {
   const context = React.useContext(UserContext);
   if (!context) {

packages/user/src/wrapper.tsx

@@ -1,14 +1,22 @@
 import * as React from "react";
 import { useUser, type User } from "./context";
 
+/**
+ * Executes Wrapper.
+ * @param props Parameter props.
+ * @returns unknown.
+ */
 export default function Wrapper(props: {
-  userId: number;
+  userId?: number;
+  loading: React.ReactNode;
   component: (user: User) => React.ReactNode;
 }) {
   const { get } = useUser();
   const [user, setUser] = React.useState<User | null>(null);
 
   React.useEffect(() => {
+    if (!props.userId) return;
+
     let active = true;
 
     void get(props.userId)
@@ -28,5 +36,5 @@ export default function Wrapper(props: {
     };
   }, [get, props.userId]);
 
-  return <>{user ? props.component(user) : null}</>;
+  return <>{user ? props.component(user) : props.loading}</>;
 }