diff --git a/srcs/requirements/nestjs/api_back/src/friendship/friendship.controller.ts b/srcs/requirements/nestjs/api_back/src/friendship/friendship.controller.ts
index bf29d3f7..50de11ed 100644
--- a/srcs/requirements/nestjs/api_back/src/friendship/friendship.controller.ts
+++ b/srcs/requirements/nestjs/api_back/src/friendship/friendship.controller.ts
@@ -62,18 +62,15 @@ export class FriendshipController {
 	@Patch('myfriends/:relationshipId/accept')
 	@UseGuards(AuthenticateGuard)
 	@UseGuards(TwoFactorGuard)
-	updateAccept(@Param('relationshipId') relationshipId: string, @Req() req)
-	{
+	updateAccept(@Param('relationshipId') relationshipId: string, @Req() req) {
 		const user : User = req.user;
-		console.log('accepting a friendship BBBBBBBBBBBBBBBBBBBBBBB')
 		return this.friendshipService.acceptFriendship(relationshipId, user);
 	}
 
 	@Patch('myfriends/:relationshipId/decline')
 	@UseGuards(AuthenticateGuard)
 	@UseGuards(TwoFactorGuard)
-	updateDecline(@Param('relationshipId') relationshipId: string, @Req() req)
-	{
+	updateDecline(@Param('relationshipId') relationshipId: string, @Req() req) {
 		const user : User = req.user;
 		return this.friendshipService.declineFriendship(relationshipId, user);
 	}
@@ -81,8 +78,7 @@ export class FriendshipController {
 	@Patch('myfriends/:relationshipId/block')
 	@UseGuards(AuthenticateGuard)
 	@UseGuards(TwoFactorGuard)
-	updateBlock(@Param('relationshipId') relationshipId: string, @Req() req)
-	{
+	updateBlock(@Param('relationshipId') relationshipId: string, @Req() req) {
 		const user : User = req.user;
 		return this.friendshipService.blockFriendship(relationshipId, user);
 	}
diff --git a/srcs/requirements/nestjs/api_back/src/friendship/friendship.service.ts b/srcs/requirements/nestjs/api_back/src/friendship/friendship.service.ts
index 79ea0eea..fdac2c9a 100644
--- a/srcs/requirements/nestjs/api_back/src/friendship/friendship.service.ts
+++ b/srcs/requirements/nestjs/api_back/src/friendship/friendship.service.ts
@@ -71,7 +71,6 @@ export class FriendshipService {
 		return friendship;
 	}
 
-	// ERIC: test this
 	async findAllFriends(username: string) {
 		const friendship = await this.friendshipRepository
 			.createQueryBuilder('friendship')
@@ -80,8 +79,8 @@ export class FriendshipService {
 			.orWhere('friendship.senderUsername = :requester', { requester: username })
 			.andWhere('friendship.status = :status', { status: FriendshipStatus.ACCEPTED })
 			.getMany();
-		for (const friend of friendship)
-			console.log("FRIENDSHIP : " + friend.status);
+		// for (const friend of friendship)
+		// 	console.log("FRIENDSHIP : " + friend.status);
 		return friendship;
 	}
 
@@ -204,7 +203,7 @@ export class FriendshipService {
 	}
 
 	async blockFriendship(relationshipId: string, user: User) {
-		const relation = await this.friendshipRepository.find({where: {id: +relationshipId }, relations: ['sender', 'receiver']} );
+		let relation = await this.friendshipRepository.find({where: {id: +relationshipId }, relations: ['sender', 'receiver']} );
 		if (!relation[0])
 			throw new HttpException(`The requested relationship not found.`, HttpStatus.NOT_FOUND);
 		if (relation[0].sender.id === user.id) {
diff --git a/srcs/requirements/svelte/api_front/src/pages/profile/ProfileFriends.svelte b/srcs/requirements/svelte/api_front/src/pages/profile/ProfileFriends.svelte
index 996fb9d8..80659127 100644
--- a/srcs/requirements/svelte/api_front/src/pages/profile/ProfileFriends.svelte
+++ b/srcs/requirements/svelte/api_front/src/pages/profile/ProfileFriends.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 
   import { onMount } from "svelte";
-    import { binding_callbacks } from "svelte/internal"; // WTF is this?
+    import { binding_callbacks, empty } from "svelte/internal"; // WTF is this?
     import App from "../../App.svelte";
   import Button from "../../pieces/Button.svelte";
   import DisplayAUser from "../../pieces/DisplayAUser.svelte";
@@ -14,12 +14,12 @@
   let allUsers;
   let myFriends;
   let requestsMade, requestsRecieved;
+  let blockedUsers;
   let usernameBeingViewed;
   let friendshipStatusFull; // id, date, senderUsername, reveiverUsername, status
-  let friendshipFetch;  // like a generic var for any friendship fetch actions that might happen
 
   /**** Layout variables ****/
-  let tabItems: string[] = ['All Users', 'My Friends', 'Friend Requests']
+  let tabItems: string[] = ['All Users', 'My Friends', 'Friend Requests', 'Blocked Users']
   let activeTabItem: string = 'All Users';
 
 
@@ -34,42 +34,25 @@
     user = await fetch('http://transcendance:8080/api/v2/user')
       .then( (x) => x.json() );
 
+    fetchAll();
+    // ok this shit works!
+    // const interval = setInterval(() => {
+		// 	fetchAll();
+		// }, 1000);
+
+    // return () => clearInterval(interval);
+  });
+
+  const fetchAll = async() => {
+    // no need to await i think it can load in the background
+    fetchAllUsers();
     fetchMyFriends();
     fetchRequestsMade();
     fetchRequestsReceived();
-    fetchAllUsers();
-
-  });
-
-
-  
-  /* TMP for Testing */
-  let cherifFetch;
-  const fetchCherif = async() => {
-    cherifFetch = await fetch('http://transcendance:8080/api/v2/network/myfriends/chbadad')
-      .then( x => x.json() );
-    console.log('Cherif Fetched ')
-    console.log({...cherifFetch})
-  };
-
-  let ericFetch;
-  const fetchEric = async() => {
-    ericFetch = await fetch('http://transcendance:8080/api/v2/network/myfriends/erlazo')
-      .then( x => x.json() );
-    console.log('Eric Fetched ')
-    console.log({...ericFetch})
-  };
-
-  let tmpTest;
-  const testBack = async(relationshipId) => {
-    console.log('test back request')
-    tmpTest = undefined;
-    // PATCH http://transcendance:8080/api/v2/network/myfriends/:relationshipId/test
-    tmpTest = await fetch(`http://transcendance:8080/api/v2/network/myfriends/${relationshipId}/test`)
-      .then( x => x.json());
-  };
-  /* End of Tests */
+    fetchBlockedUsers();
+  }
 
+  /*****  Fetch basic things  *****/
   const fetchAllUsers = async() => {
     allUsers = await fetch('http://transcendance:8080/api/v2/user/all')
       .then( x => x.json() );
@@ -98,95 +81,128 @@
     console.log({...requestsRecieved})
   };
 
-  let sentFriendRequest;
-  const sendFriendRequest = async(potentialFriendUsername) => {
-    set.friendUsername = '';
-    errors.friendRequest = '';
-    let valid = false;
-    if (potentialFriendUsername === user.username) {
-      errors.friendRequest = "You can't friend yourself."
-      valid = false;
-    } else {
-      set.friendUsername = potentialFriendUsername;
-      valid = true;
-    }
-
-    if (valid) {
-      sentFriendRequest = await fetch("http://transcendance:8080/api/v2/network/myfriends", {
-          method : "POST",
-          headers: { 'Content-Type': 'application/json'},
-            body: JSON.stringify({
-            "receiverUsername": set.friendUsername,
-            "status": "R"
-          })
-        })
-        .then( x => x.json())
-      areWeFriends(usernameBeingViewed);
-    }
+  const fetchBlockedUsers = async() => {
+    blockedUsers = await fetch('http://transcendance:8080/api/v2/network/blocked')
+      .then( x => x.json() );
+    console.log('got blocked users, is it empty?')
+    console.log({...blockedUsers})
+    console.log(Object.keys(blockedUsers))
   };
+  /**** END OF MAIN FETCH ****/
 
-  const areWeFriends = async(aUsername) => {
-    console.log("Are We Friends?")
-    friendshipStatusFull = undefined;
+  const fetchFriendshipFull = async(aUsername) => {
     friendshipStatusFull = await fetch(`http://transcendance:8080/api/v2/network/myfriends/${aUsername}`)
       .then( x => x.json());
-    console.log({...friendshipStatusFull})
+  };
+
+
+  const sendFriendRequest = async(aUsername) => {
+    const resp = await fetch("http://transcendance:8080/api/v2/network/myfriends", {
+        method : "POST",
+        headers: { 'Content-Type': 'application/json'},
+          body: JSON.stringify({
+          "receiverUsername": aUsername,
+          "status": "R"
+        })
+      })
+      .then( x => x.json())
   };
 
   const viewAUser = async(aUsername) => {
     console.log('Profile Friend updating userBeingViewed')
     usernameBeingViewed = aUsername;
 
-    friendshipStatusFull = undefined;
+    // friendshipStatusFull = undefined;
     // id, date, senderUsername, reveiverUsername, status
-    friendshipStatusFull = await fetch(`http://transcendance:8080/api/v2/network/myfriends/${aUsername}`)
-      .then( x => x.json());
+    await fetchFriendshipFull(aUsername);
 
     console.log('Friendship Status Full')
     console.log({...friendshipStatusFull})
     
   };
 
-
   const acceptFriendRequest = async(relationshipId) => {
     console.log('accept friend request')
-    friendshipFetch = undefined;
     // PATCH http://transcendance:8080/api/v2/network/myfriends/:relationshipId/accept
-    friendshipFetch = await fetch(`http://transcendance:8080/api/v2/network/myfriends/${relationshipId}/accept`, {
+    const resp = await fetch(`http://transcendance:8080/api/v2/network/myfriends/${relationshipId}/accept`, {
         method: "PATCH"})
       .then( x => x.json());
     // maybe not the most robust things, not super reusable cuz it depends on outside vars but works for now...
     console.log('accepted friend request, now response')
-    console.log({...friendshipFetch})
-    await areWeFriends(usernameBeingViewed);
+    console.log({...resp})
+    await fetchFriendshipFull(usernameBeingViewed);
+
+    // will this make it reload? C'est un peu bourain... do i even need it?
+    activeTabItem = activeTabItem;
   };
 
   const declineFriendRequest = async(relationshipId) => {
     console.log('decline friend request')
-    friendshipFetch = undefined;
     // PATCH http://transcendance:8080/api/v2/network/myfriends/:relationshipId/decline
-    friendshipFetch = await fetch(`http://transcendance:8080/api/v2/network/myfriends/${relationshipId}/decline`, {
+    const resp = await fetch(`http://transcendance:8080/api/v2/network/myfriends/${relationshipId}/decline`, {
         method: "PATCH"})
       .then( x => x.json());
     // maybe not the most robust things, not super reusable cuz it depends on outside vars but works for now...
     console.log('declined friend request, now response')
-    console.log({...friendshipFetch})
-    await areWeFriends(usernameBeingViewed);
+    console.log({...resp})
+    await fetchFriendshipFull(usernameBeingViewed);
   };
 
-
   const unfriend = async(relationshipId) => {
     console.log('Unfriend')
-    friendshipFetch = undefined;
-    friendshipFetch = await fetch(`http://transcendance:8080/api/v2/network/myfriends/${relationshipId}`, {
+    const resp = await fetch(`http://transcendance:8080/api/v2/network/myfriends/${relationshipId}`, {
         method: "DELETE"})
       .then( x => x.json());
-    await areWeFriends(usernameBeingViewed);
+    
+    // friendshipStatusFull = undefined;
+    // OR
+    await fetchFriendshipFull(usernameBeingViewed);
+    if (Object.keys(friendshipStatusFull).length === 0)
+      friendshipStatusFull = undefined;
+
+    // will this make it reload? C'est un peu bourain... do i even need it?
+    activeTabItem = activeTabItem;
   };
 
+  const blockANonFriendUser = async(aUsername) => {
+    console.log('Block someone username')
+    console.log({...aUsername})
 
-  const blockAUser = async(friendshipId) => {
+      const blockResp = await fetch("http://transcendance:8080/api/v2/network/myfriends", {
+          method : "POST",
+          headers: { 'Content-Type': 'application/json'},
+            body: JSON.stringify({
+            "receiverUsername": aUsername,
+            "status": "B"
+          })
+        })
+        .then( x => x.json())
+    await fetchBlockedUsers();
+    await fetchAllUsers();
+    usernameBeingViewed = undefined;
+    friendshipStatusFull = undefined;
 
+    // will this make it reload?
+    activeTabItem = activeTabItem;
+  };
+
+  const blockAFriend = async(relationshipId) => {
+    const resp = await fetch(`http://transcendance:8080/api/v2/network/myfriends/${relationshipId}/block`, {method: "PATCH"})
+      .then( x => x.json() );
+    console.log('blocked a user response')
+    console.log({...resp})
+    await fetchBlockedUsers();
+    await fetchAllUsers();
+    usernameBeingViewed = undefined;
+    friendshipStatusFull = undefined;
+
+    // will this make it reload?
+    activeTabItem = activeTabItem;
+  };
+
+  const unblockAUser = async(relationshipId) => {
+    // it's basically the same as unfriending someone cuz unfriending them means the relationship is deleted
+    await unfriend(relationshipId);
   };
 
   const switchTab = async(e) => {
@@ -197,10 +213,13 @@
       await fetchMyFriends();
     } else if (activeTabItem === 'Friend Requests') {
       await fetchRequestsReceived();
+    } else if (activeTabItem === 'Blocked Users') {
+      await fetchBlockedUsers();
+      console.log('blocked users: ')
+      console.log({...blockedUsers})
     }
   };
 
-
 </script>
 
 
@@ -210,6 +229,7 @@
   <!-- let tabItems: string[] = ['All Users', 'My Friends', 'Friend Requests']
   let activeTabItem: string = 'All Users'; -->
 
+  <!-- maybe add numbers at the botton? like for how many of each there are? -->
 
   <div class="sidebar-list">
     <Tabs items={tabItems} activeItem={activeTabItem} size="small" on:tabChange={switchTab}/>
@@ -219,20 +239,24 @@
       is there something else i could use? -->
       <!-- add a thing so it doesn't display the current user just all the other users -->
 
+      {#if Object.keys(allUsers).length === 0}
+        <div class="tip">You are alone on this platform...</div>
+      {/if}
       <!-- does this work? -->
       <!-- {#each allUsers as aUser (aUser.username)} -->
       {#each allUsers as aUser}
-        <!-- {#if aUser.username !== user.username} -->
-          <div class="sidebar-item" on:click={() => viewAUser(aUser.username)}>{aUser.username}</div>
-          <!-- i could make an indicator component? like green for connected or something?
-          i could use words but color them?
-          i could make it so if they're in a game  -->
-          <div class="status sidebar-item">{aUser.status}</div>
-          <br>
-        <!-- {/if} -->
+        <div class="sidebar-item" on:click={() => viewAUser(aUser.username)}>{aUser.username}</div>
+        <!-- i could make an indicator component? like green for connected or something?
+        i could use words but color them?
+        i could make it so if they're in a game  -->
+        <div class="status sidebar-item">{aUser.status}</div>
+        <br>
       {/each}
     {:else if activeTabItem === 'My Friends' && myFriends !== undefined}
       <h3>{activeTabItem}</h3>
+      {#if Object.keys(myFriends).length === 0}
+        <div class="tip">You don't have any Friends... Yet!</div>
+      {/if}
       {#each myFriends as aUser}
         <div class="sidebar-item" on:click={() => viewAUser(aUser.username)}>{aUser.username}</div>
         <div class="status sidebar-item">{aUser.status}</div>
@@ -240,10 +264,23 @@
       {/each}
     {:else if activeTabItem === 'Friend Requests' && requestsRecieved !== undefined}
       <h3>{activeTabItem}</h3>
+      {#if Object.keys(requestsRecieved).length === 0}
+        <div class="tip">You don't have any Friend Requests</div>
+      {/if}
       {#each requestsRecieved as aUser}
         <div class="sidebar-item" on:click={() => viewAUser(aUser.senderUsername)}>{aUser.senderUsername}</div>
         <div class="status sidebar-item">{aUser.status}</div>
-        <!-- yea not sure if status makes sense here, it's not the user's status it's the friendrequest status -->
+        <br>
+      {/each}
+    {:else if activeTabItem === 'Blocked Users' && blockedUsers !== undefined}
+      <h3>{activeTabItem}</h3>
+      <!-- seems a little excessive... maybe a lighter way of doing this? doesn't seem like it, i hate it but at least only happens sometimes.default... -->
+      {#if Object.keys(blockedUsers).length === 0}
+        <div class="tip">You have not Blocked any Users</div>
+      {/if}
+      {#each blockedUsers as aUser}
+        <div class="sidebar-item" on:click={() => viewAUser(aUser.senderUsername)}>{aUser.senderUsername}</div>
+        <div class="status sidebar-item">{aUser.status}</div>
         <br>
       {/each}
     {/if}
@@ -251,50 +288,41 @@
 
 
   <div class="main-display">
-    <!-- use an #await here too? -->
-    <!-- you can do better, like an on load sort of thing -->
-    <!-- {#if userBeingViewed !== undefined && userBeingViewed === tmpUserBeingViewed} -->
-    <!-- {#if userBeingViewed} -->
     {#if usernameBeingViewed !== undefined}
       <DisplayAUser aUsername={usernameBeingViewed}/>
 
       <div class="buttons-area">
-        <!-- so far not dealing with Blocked people -->
-        {#if usernameBeingViewed !== user.username}
-          <!-- uhhhg why can't it be simple... -->
-          <!-- {#if friendshipStatusFull === undefined} -->
-          {#if friendshipStatusFull && friendshipStatusFull.id}
-            {#if friendshipStatusFull.status === 'R'}
-              {#if friendshipStatusFull.senderUsername === user.username}
-                <div class="tile">Friend Request Sent</div>
-              {:else}
-               <!-- <Button type="secondary" on:click={() => acceptFriendRequest(usernameBeingViewed)}>Unfriend</Button> -->
-               <Button type="secondary" on:click={() => acceptFriendRequest(friendshipStatusFull.id)}>Accept Friend Request</Button>
-               <Button on:click={() => declineFriendRequest(friendshipStatusFull.id)}>Decline Friend Request</Button>
-              {/if}
-            {:else if friendshipStatusFull.status === 'A'}
-              <div class="tile">You are Friends</div>
-              <Button on:click={() => unfriend(friendshipStatusFull.id)}>Unfriend</Button>
-            {:else if friendshipStatusFull.status === 'D'}
-              {#if friendshipStatusFull.senderUsername === user.username}
-                <div class="tile">Your friend request was denied, hang in there bud.</div>
-              {:else}
-                <div class="tile">You declined the friend request but you could still change your mind</div>
-                <Button on:click={() => acceptFriendRequest(friendshipStatusFull.id)}>acceptFriendRequest</Button>
-              {/if}
+        {#if friendshipStatusFull && friendshipStatusFull.id}
+          {#if friendshipStatusFull.status === 'R'}
+            {#if friendshipStatusFull.senderUsername === user.username}
+              <div class="tile">Friend Request Sent</div>
+            {:else}
+              <!-- <Button type="secondary" on:click={() => acceptFriendRequest(usernameBeingViewed)}>Unfriend</Button> -->
+              <Button type="secondary" on:click={() => acceptFriendRequest(friendshipStatusFull.id)}>Accept Friend Request</Button>
+              <Button on:click={() => declineFriendRequest(friendshipStatusFull.id)}>Decline Friend Request</Button>
+            {/if}
+            <Button on:click={() => blockAFriend(friendshipStatusFull.id)}>Block User</Button>
+          {:else if friendshipStatusFull.status === 'A'}
+            <div class="tile">You are Friends</div>
+            <Button on:click={() => unfriend(friendshipStatusFull.id)}>Unfriend</Button>
+            <Button on:click={() => blockAFriend(friendshipStatusFull.id)}>Block User</Button>
+          {:else if friendshipStatusFull.status === 'D'}
+            {#if friendshipStatusFull.senderUsername === user.username}
+              <div class="tile">Your friend request was declined, hang in there bud.</div>
+            {:else}
+              <div class="tile">You declined the friend request, but you could still change your mind</div>
+              <Button on:click={() => acceptFriendRequest(friendshipStatusFull.id)}>Accept Friend Request</Button>
+            {/if}
+            <Button on:click={() => blockAFriend(friendshipStatusFull.id)}>Block User</Button>
+          {:else if friendshipStatusFull.status === 'B'}
+            {#if friendshipStatusFull.senderUsername === user.username}
+              <Button on:click={() => unblockAUser(friendshipStatusFull.id)}>Unblock User</Button>
             {/if}
-          {:else}
-            <Button type="secondary" on:click={() => sendFriendRequest(usernameBeingViewed)}>Add Friend</Button>
           {/if}
+        {:else}
+          <Button type="secondary" on:click={() => sendFriendRequest(usernameBeingViewed)}>Add Friend</Button>
+          <Button on:click={() => blockANonFriendUser(usernameBeingViewed)}>Block User</Button>
         {/if}
-
-      <!-- {#if user not blocked}
-        <Button on:click={() => blockAUser(userBeingViewed.username)}>Add Friend</Button>
-        does it have to be friendship IDs? can't i just use username?
-        i mean i guess friendship ID is more secure, and also easier in the back
-        but if i'm using friendshi ID i need a good way of getting them
-      {/if} -->
-    <!-- {:else if userBeingViewed !== undefined} -->
       </div>
     {:else}
       <div class="placeholder">
@@ -303,29 +331,6 @@
       </div>
     {/if}
 
-    <!-- {#await userBeingViewed}
-      <p>... waiting</p>
-    {:then}
-      <div>{userBeingViewed.username}</div>
-      <DisplayAUser aUsername={userBeingViewed.username}/>
-
-      <Button type="secondary" on:click={() => sendFriendRequest(userBeingViewed.username)}>Add Friend</Button>
-
-    {:catch}
-      <p>No user to view yet</p>
-    {/await} -->
-<!-- {#if user not blocked}
-        <Button on:click={() => blockAUser(userBeingViewed.username)}>Add Friend</Button>
-        does it have to be friendship IDs? can't i just use username?
-        i mean i guess friendship ID is more secure, and also easier in the back
-        but if i'm using friendshi ID i need a good way of getting them
-      {/if} -->
-    <!-- {:else if userBeingViewed !== undefined} -->
-
-    <Button on:click={() => testBack(1)}>Test Friendship Back</Button>
-    <Button on:click={fetchCherif}>Fetch Cherif</Button>
-    <Button on:click={fetchEric}>Fetch Eric</Button>
-
   </div>
 </div>
 
@@ -376,6 +381,13 @@
     text-align: center;
   }
 
+  div.tip{
+    color: darkgray;
+    font-size: 0.8em;
+    font-weight: bold;
+  }
+
+
   .error{
     font-size: 0.8em;
     font-weight: bold;