feat: use empty list

src/renderer/src/components/sidebar/sidebar-profile.tsx

@@ -83,7 +83,7 @@ export function SidebarProfile() {
           )}
         </div>
       </button>
-      {userDetails && friendRequests?.length && !gameRunning && (
+      {userDetails && friendRequests.length > 0 && !gameRunning && (
         <div className={styles.friendRequestContainer}>
           <button
             type="button"

src/renderer/src/features/user-details-slice.ts

@@ -5,7 +5,7 @@ import type { FriendRequest, UserDetails } from "@types";
 export interface UserDetailsState {
   userDetails: UserDetails | null;
   profileBackground: null | string;
-  friendRequests: FriendRequest[] | null;
+  friendRequests: FriendRequest[];
   showFriendsModal: boolean;
   friendRequetsModalTab: UserFriendModalTab | null;
 }
@@ -13,7 +13,7 @@ export interface UserDetailsState {
 const initialState: UserDetailsState = {
   userDetails: null,
   profileBackground: null,
-  friendRequests: null,
+  friendRequests: [],
   showFriendsModal: false,
   friendRequetsModalTab: null,
 };
@@ -28,10 +28,7 @@ export const userDetailsSlice = createSlice({
     setProfileBackground: (state, action: PayloadAction<string | null>) => {
       state.profileBackground = action.payload;
     },
-    setFriendRequests: (
-      state,
-      action: PayloadAction<FriendRequest[] | null>
-    ) => {
+    setFriendRequests: (state, action: PayloadAction<FriendRequest[]>) => {
       state.friendRequests = action.payload;
     },
     setshowFriendsModal: (state, action: PayloadAction<boolean>) => {

src/renderer/src/hooks/use-user-details.ts

@@ -91,7 +91,7 @@ export function useUserDetails() {
 
   const updateFriendRequests = useCallback(async () => {
     const friendRequests = await window.electron.getFriendRequests();
-    dispatch(setFriendRequests(friendRequests));
+    dispatch(setFriendRequests(friendRequests || []));
   }, [dispatch]);
 
   const setShowFriendsModal = useCallback(