Get chat view started

src/lib/components/Avatar.svelte

@@ -0,0 +1,17 @@
+<script lang="ts">
+  import cx from 'classnames'
+  import Icon from "@lib/components/Icon.svelte"
+
+  export let src
+  export let size = 7
+</script>
+
+<div
+  class={cx($$props.class, "!flex items-center justify-center rounded-full overflow-hidden")}
+  style={`width: ${size * 4}px; height: ${size * 4}px;`}>
+  {#if src}
+    <img alt="" {src} />
+  {:else}
+    <Icon icon="user-rounded" size={Math.round(size * .7)} />
+  {/if}
+</div>

src/lib/components/Icon.svelte

@@ -12,6 +12,7 @@
   import AddCircle from "@assets/icons/Add Circle.svg?dataurl"
   import AltArrowRight from "@assets/icons/Alt Arrow Right.svg?dataurl"
   import AltArrowLeft from "@assets/icons/Alt Arrow Left.svg?dataurl"
+  import ArrowRight from "@assets/icons/Arrow Right.svg?dataurl"
   import CheckCircle from "@assets/icons/Check Circle.svg?dataurl"
   import ClipboardText from "@assets/icons/Clipboard Text.svg?dataurl"
   import CloseCircle from "@assets/icons/Close Circle.svg?dataurl"
@@ -48,6 +49,7 @@
     "add-circle": AddCircle,
     "alt-arrow-right": AltArrowRight,
     "alt-arrow-left": AltArrowLeft,
+    "arrow-right": ArrowRight,
     "check-circle": CheckCircle,
     "clipboard-text": ClipboardText,
     "close-circle": CloseCircle,