changed api route

client/src/Views/Invite.svelte

@@ -17,6 +17,7 @@
   import { db } from "../utils/firebase";
   import socket from "../utils/socket";
   import { app, user } from "../utils/store";
+  import { AVATAR_ENDPOINT } from "../utils/avatar";
 
   const params = useParams();
   let error = "";
@@ -100,10 +101,7 @@
       <Loader />
     {:else if room}
       <img
-        src={room.img ||
-          `https://avatars.dicebear.com/api/jdenticon/${room.name
-            .split(" ")[0]
-            .toLowerCase()}.svg`}
+        src={room.img || AVATAR_ENDPOINT(room.name)}
         alt="Room Icon"
         class="pfp"
       />

client/src/Views/Navbar/RoomsBar.svelte

@@ -285,7 +285,7 @@
         {#if !isNext}
           <h2>Create a Room</h2>
           <p class="size14 grey-text" style="margin-bottom: 20px;">
-            Or a join a Room, if you have the ID already
+            Or join a Room, if you have the ID already
           </p>
           <button
             on:click={() => {

client/src/components/EditRoom.svelte

@@ -14,6 +14,7 @@
   import clickOutside from "../utils/clickOutside";
   import finalCompressedBlob from "../utils/compressImage";
   import { db, storageRef } from "../utils/firebase";
+  import { AVATAR_ENDPOINT } from "../utils/avatar";
   import { appName, menu, selectedRoom } from "../utils/store";
 
   let name = $selectedRoom.name;
@@ -178,9 +179,7 @@
           pfpTemp = null;
           if (!remove) {
             remove = true;
-            pfp = `https://avatars.dicebear.com/api/jdenticon/${name
-              .split(" ")
-              .join("")}.svg`;
+            pfp = AVATAR_ENDPOINT(name);
             preview.src = pfp;
           } else {
             remove = false;

client/src/components/Profile.svelte

@@ -13,6 +13,7 @@
   import finalCompressedBlob from "../utils/compressImage";
   import { db, storageRef } from "../utils/firebase";
   import { user } from "../utils/store";
+  import { AVATAR_ENDPOINT } from "../utils/avatar";
 
   let name = $user.displayName;
   let pfp = $user.photoURL;
@@ -123,9 +124,7 @@
           pfpTemp = null;
           if (!remove) {
             remove = true;
-            pfp = `https://avatars.dicebear.com/api/identicon/${name
-              .split(" ")
-              .join("")}.svg`;
+            pfp = AVATAR_ENDPOINT(name);
             preview.src = pfp;
           } else {
             remove = false;

client/src/components/Room.svelte

@@ -1,5 +1,6 @@
 <script>
   import { selectedRoom } from "../utils/store";
+  import { AVATAR_ENDPOINT } from "../utils/avatar";
 
   export let img = "";
   export let name = "";
@@ -19,9 +20,7 @@
       class="room-icon"
       src={img
         ? img
-        : `https://avatars.dicebear.com/api/jdenticon/${name
-            .split(" ")[0]
-            .toLowerCase()}.svg`}
+        : AVATAR_ENDPOINT(name)}
       alt={name}
     />
   {/if}

client/src/utils/avatar.js

@@ -0,0 +1,2 @@
+export const AVATAR_ENDPOINT = (name) =>
+  `https://api.dicebear.com/7.x/identicon/svg?seed=${name.split(" ").join("")}`;