Merge branch 'main' into ev/iss540

drips-network · Oct 18, 2023 · 5ca9ce0 · 5ca9ce0
2 parents a1af6a7 + 9630f9c
commit 5ca9ce0
Show file tree

Hide file tree

Showing 7 changed files with 38 additions and 45 deletions.
diff --git a/src/lib/components/drip-list-members-editor/drip-list-members-editor.svelte b/src/lib/components/drip-list-members-editor/drip-list-members-editor.svelte
@@ -438,6 +438,10 @@
 </div>
 
 <style>
+  .list-editor {
+    text-align: left;
+  }
+
   .list {
     background-color: var(--color-background);
     box-shadow: var(--elevation-low);

diff --git a/src/lib/components/identity-badge/identity-badge.svelte b/src/lib/components/identity-badge/identity-badge.svelte
@@ -85,9 +85,10 @@
     this={getLink() ? 'a' : 'span'}
     href={getLink()}
     target={linkToNewTab ? '_blank' : undefined}
-    class="identity-badge flex items-center relative text-left text-foreground tabular-nums {showAvatar &&
+    class="identity-badge flex items-center relative text-left text-foreground tabular-nums {getLink() &&
+    showAvatar &&
     !showIdentity
-      ? 'focus-visible:ring-8 focus-visible:ring-primary-level-1 rounded-full'
+      ? 'focus-visible:ring-8 focus-visible:ring-primary-level-1 rounded-full mouse:hover:ring-4 mouse:hover:ring-primary-level-1'
       : ''}"
     class:flex-row-reverse={isReverse}
     class:select-none={disableSelection}

diff --git a/src/lib/components/text-input/text-input.svelte b/src/lib/components/text-input/text-input.svelte
@@ -114,7 +114,7 @@
     {#if suffix}
       <span
         class="typo-text tabular-nums"
-        style="color: var(--color-foreground-level-5); margin: 0 0.75rem;"
+        style="color: var(--color-foreground-level-4); margin: 0 0.75rem;"
       >
         {suffix}
       </span>
@@ -188,7 +188,7 @@
   }
 
   input::placeholder {
-    color: var(--color-foreground-level-5);
+    color: var(--color-foreground-level-4);
   }
 
   input:focus,

diff --git a/src/lib/components/user-avatar/user-avatar.svelte b/src/lib/components/user-avatar/user-avatar.svelte
@@ -6,12 +6,10 @@
 
   export let imgElem: HTMLImageElement | undefined = undefined;
 
-  $: currentSize = `${size}px`;
-
   let loaded = false;
 </script>
 
-<div class="avatar" style:height={currentSize} style:width={currentSize}>
+<div class="avatar" style:height={size + 'px'} style:width={size + 'px'}>
   {#if src}
     <img
       class:outlined={outline}
@@ -48,7 +46,7 @@
   }
 
   img.outlined {
-    box-shadow: var(--elevation-low);
+    border: 1px solid var(--color-foreground);
   }
 
   .placeholder {

diff --git a/src/lib/flows/withdraw-flow/enter-amount.svelte b/src/lib/flows/withdraw-flow/enter-amount.svelte
@@ -2,7 +2,6 @@
   import Button from '$lib/components/button/button.svelte';
   import EmojiAndToken from '$lib/components/emoji-and-token/emoji-and-token.svelte';
   import FormField from '$lib/components/form-field/form-field.svelte';
-  import ListSelect from '$lib/components/list-select/list-select.svelte';
   import StepHeader from '$lib/components/step-header/step-header.svelte';
   import StepLayout from '$lib/components/step-layout/step-layout.svelte';
   import Token from '$lib/components/token/token.svelte';
@@ -163,29 +162,17 @@
     description="Withdraw funds from your outgoing streaming balance."
   />
   <FormField title="Balance">
-    <div class="balance">
-      <ListSelect
-        blockInteraction
-        searchable={false}
-        items={{
-          '': {
-            type: 'selectable',
-            searchString: [tokenInfo.info.name, tokenInfo.info.symbol],
-            label: tokenInfo.info.name ?? 'Unknown token',
-            text: `${formatTokenAmount(estimate, tokenInfo.info.decimals)} ${
-              tokenInfo.info.symbol
-            }`,
-            image: {
-              component: Token,
-              props: {
-                address: $context.tokenAddress,
-                show: 'none',
-                size: 'small',
-              },
-            },
-          },
-        }}
-      />
+    <div class="flex border rounded-drip-xl p-3 typo-text gap-2 items-center">
+      <Token address={$context.tokenAddress} show="none" size="small" />
+      <div class="flex-1 min-w-0 truncate">
+        {tokenInfo.info.name ?? 'Unknown token'}
+      </div>
+      <div class="flex-1 min-w-0 truncate text-right text-foreground-level-4">
+        {formatTokenAmount(estimate, tokenInfo.info.decimals)}
+      </div>
+      <div class="text-foreground-level-4">
+        {tokenInfo.info.symbol}
+      </div>
     </div>
   </FormField>
   <FormField title="Amount to withdraw">
@@ -209,11 +196,3 @@
     >
   </svelte:fragment>
 </StepLayout>
-
-<style>
-  .balance {
-    border: 1px solid var(--color-foreground);
-    border-radius: 1.5rem 0 1.5rem 1.5rem;
-    overflow: hidden;
-  }
-</style>
diff --git a/src/routes/app/(app)/[accountId]/+page.svelte b/src/routes/app/(app)/[accountId]/+page.svelte
@@ -26,7 +26,7 @@
 
   let dripsAccountId: string | undefined;
   let address: string | undefined;
-  let error: 'is-repo-driver-account-id' | true | undefined;
+  let error: 'is-repo-driver-account-id' | 'ens-not-resolved' | true | undefined;
 
   const ensRecords = ['description', 'url', 'com.twitter', 'com.github'] as const;
   const socialLinks = ['com.twitter', 'com.github', 'url'] as const;
@@ -89,9 +89,14 @@
         }
       }
     } catch (e) {
-      // eslint-disable-next-line no-console
-      console.error(e);
-      error = true;
+      if (typeof e === 'object' && e && 'message' in e && e.message === 'Not found') {
+        error = 'ens-not-resolved';
+      } else {
+        // eslint-disable-next-line no-console
+        console.error(e);
+
+        error = true;
+      }
     }
   });
 
@@ -129,6 +134,12 @@
     headline="Unable to jump to projects by account ID"
     description="Sorry, but jumping to a Drips Project by its account ID is currently not supported."
   />
+{:else if error === 'ens-not-resolved'}
+  <LargeEmptyState
+    emoji="🕸️"
+    headline="Not found"
+    description="Sorry, but we couldn't find that ENS name."
+  />
 {:else if error}
   <LargeEmptyState
     emoji="🕸️"

diff --git a/src/styles/fonts.css b/src/styles/fonts.css
@@ -7,7 +7,7 @@
 
 @font-face {
   font-family: 'Inter SemiBold';
-  src: url('/fonts/Inter-Semibold.woff2');
+  src: url('/fonts/Inter-SemiBold.woff2');
 }
 
 @font-face {