fix: introduce summaryLine to allow tooltip with ripple

Agoric · Aug 7, 2020 · 08393a8 · 08393a8
1 parent e389dd1
commit 08393a8
Show file tree

Hide file tree

Showing 5 changed files with 29 additions and 7 deletions.
diff --git a/packages/dapp-svelte-wallet/ui/lib/ListCard.svelte b/packages/dapp-svelte-wallet/ui/lib/ListCard.svelte
@@ -35,13 +35,17 @@
     <List {items}>
       <li slot="item" class="px-1" let:item>
         <div class="fullwidth px-1">
-          <ListItem dense classes="overflow-visible" selectedClasses="bg-primary-trans" {item} {...item} on:click={() => toggle(item.id)}>
+          <ListItem dense selectedClasses="bg-primary-trans" {item} {...item} on:click={() => toggle(item.id)}>
             <div class="flex items-center">
               <Icon tip={expanded.includes(item.id)}>{expandIcon}</Icon>
               <slot name="item-header" {item}><span>{item.text}</span></slot>
             </div>
           </ListItem>
 
+          <div class="ml-10">
+            <slot name="item-header-rest" {item}></slot>
+          </div>
+
           {#if expanded.includes(item.id)}
             <div in:slide class="ml-10">
               <slot name="item-details" {item}></slot>

diff --git a/packages/dapp-svelte-wallet/ui/src/Purse.svelte b/packages/dapp-svelte-wallet/ui/src/Purse.svelte
@@ -11,6 +11,7 @@
   import Switch from "smelte/src/components/Switch";
 
 export let summary = true;
+export let summaryLine = 0;
 export let details = true;
 
   export let item;
@@ -28,8 +29,12 @@ export let details = true;
 <section>
   {#if summary}
   <div class="fullwidth">
-    <Petname name={item.pursePetname} />
-    <Amount amount={item.currentAmount} />
+    {#if !summaryLine || summaryLine === 1}
+      <Petname name={item.pursePetname} />
+    {/if}
+    {#if !summaryLine || summaryLine === 2}
+      <Amount amount={item.currentAmount} />
+    {/if}
   </div>
   {/if}
   {#if details}

diff --git a/packages/dapp-svelte-wallet/ui/src/Purses.svelte b/packages/dapp-svelte-wallet/ui/src/Purses.svelte
@@ -16,7 +16,11 @@
   </div>
 
   <div slot="item-header" let:item>
-    <Purse {item} details={false}/>
+    <Purse {item} details={false} summaryLine={1} />
+  </div>
+
+  <div slot="item-header-rest" let:item>
+    <Purse {item} details={false} summaryLine={2} />
   </div>
 
   <div slot="item-details" let:item>

diff --git a/packages/dapp-svelte-wallet/ui/src/Transaction.svelte b/packages/dapp-svelte-wallet/ui/src/Transaction.svelte
@@ -8,6 +8,7 @@
 
   export let item;
   export let summary = true;
+  export let summaryLine = 0;
   export let details = true;
 
   // Show the outcome if it is a string, otherwise a default message.
@@ -84,11 +85,15 @@
 
 <section>
   {#if summary}
-    {formatDateNow(date)} <Petname name={instancePetname} board={instanceHandleBoardId} />
+    {#if !summaryLine || summaryLine === 1}
+      {formatDateNow(date)}
+    {/if}
+    {#if !summaryLine || summaryLine === 2}
+      <Petname name={instancePetname} board={instanceHandleBoardId} /> via ({dappOrigin || origin})
+    {/if}
   {/if}
   {#if details}
   <div>
-    via ({dappOrigin || origin})
 	<Debug title="Transaction Detail" target={item} />
   </div>
   <div>

diff --git a/packages/dapp-svelte-wallet/ui/src/Transactions.svelte b/packages/dapp-svelte-wallet/ui/src/Transactions.svelte
@@ -16,7 +16,11 @@
   </div>
 
   <div slot="item-header" let:item>
-    <Transaction {item} details={false}/>
+    <Transaction {item} details={false} summaryLine={1} />
+  </div>
+
+  <div slot="item-header-rest" let:item>
+    <Transaction {item} details={false} summaryLine={2} />
   </div>
 
   <div slot="item-details" let:item>