Use new icons

src/app/components/SpaceQuickLinks.svelte

@@ -1,6 +1,14 @@
 <script lang="ts">
   import {deriveRelay} from "@welshman/app"
   import {fade} from "@lib/transition"
+  import CompassBig from "@assets/icons/compass-big.svg?dataurl"
+  import NotesMinimalistic from "@assets/icons/notes-minimalistic.svg?dataurl"
+  import CalendarMinimalistic from "@assets/icons/calendar-minimalistic.svg?dataurl"
+  import Magnifier from "@assets/icons/magnifier.svg?dataurl"
+  import Lock from "@assets/icons/lock-keyhole.svg?dataurl"
+  import Hashtag from "@assets/icons/hashtag-circle.svg?dataurl"
+  import AddCircle from "@assets/icons/add-circle.svg?dataurl"
+  import ChatRound from "@assets/icons/chat-round.svg?dataurl"
   import Icon from "@lib/components/Icon.svelte"
   import Link from "@lib/components/Link.svelte"
   import Button from "@lib/components/Button.svelte"
@@ -49,13 +57,13 @@
 
 <div class="card2 bg-alt md:hidden">
   <h3 class="mb-4 flex items-center gap-2 text-lg font-semibold">
-    <Icon icon="compass-big" />
+    <Icon icon={CompassBig} />
     Quick Links
   </h3>
   <div class="flex flex-col gap-2">
     <Link href={threadsPath} class="btn btn-primary w-full justify-start">
       <div class="relative flex items-center gap-2">
-        <Icon icon="notes-minimalistic" />
+        <Icon icon={NotesMinimalistic} />
         Threads
         {#if $notifications.has(threadsPath)}
           <div
@@ -67,7 +75,7 @@
     </Link>
     <Link href={calendarPath} class="btn btn-secondary w-full justify-start">
       <div class="relative flex items-center gap-2">
-        <Icon icon="calendar-minimalistic" />
+        <Icon icon={CalendarMinimalistic} />
         Calendar
         {#if $notifications.has(calendarPath)}
           <div
@@ -80,7 +88,7 @@
     {#if hasNip29($relay)}
       {#if $userRooms.length + $otherRooms.length > 10}
         <label class="input input-sm input-bordered flex flex-grow items-center gap-2">
-          <Icon icon="magnifer" size={4} />
+          <Icon icon={Magnifier} size={4} />
           <input bind:value={term} class="grow" type="text" placeholder="Search rooms..." />
         </label>
       {/if}
@@ -90,9 +98,9 @@
         <Link href={roomPath} class="btn btn-neutral btn-sm relative w-full justify-start">
           <div class="flex min-w-0 items-center gap-2 overflow-hidden text-nowrap">
             {#if channel?.closed || channel?.private}
-              <Icon icon="lock" size={4} />
+              <Icon icon={Lock} size={4} />
             {:else}
-              <Icon icon="hashtag" />
+              <Icon icon={Hashtag} />
             {/if}
             <ChannelName {url} {room} />
           </div>
@@ -103,13 +111,13 @@
         </Link>
       {/each}
       <Button onclick={addRoom} class="btn btn-neutral btn-sm w-full justify-start">
-        <Icon icon="add-circle" />
+        <Icon icon={AddCircle} />
         Create Room
       </Button>
     {:else}
       <Link href={chatPath} class="btn btn-neutral w-full justify-start">
         <div class="relative flex items-center gap-2">
-          <Icon icon="chat-round" />
+          <Icon icon={ChatRound} />
           Chat
           {#if $notifications.has(chatPath)}
             <div class="absolute -right-3 -top-1 h-2 w-2 rounded-full bg-primary" transition:fade>