feat(wallet): Drop old components into contacts, dapps, issuers, and …

…purses views (#3825)
Agoric · Sep 14, 2021 · 5a52315 · 5a52315
1 parent c02eb8e
commit 5a52315
Show file tree

Hide file tree

Showing 4 changed files with 98 additions and 23 deletions.
diff --git a/packages/dapp-svelte-wallet/ui/src/ContactsV2.svelte b/packages/dapp-svelte-wallet/ui/src/ContactsV2.svelte
@@ -1,9 +1,32 @@
 <script>
+    import { E } from '@agoric/eventual-send';
+    import Card from 'smelte/src/components/Card';
+    import ListCard from '../lib/ListCard.svelte';
 
+    import Import from "./Import.svelte";
+    import Contact from "./Contact.svelte";
+
+    import { contacts, walletP } from './store';
 </script>
-<style>
 
-</style>
-<div>
-    <h1>Contacts</h1>
-</div>
+<h1>Contacts</h1>
+<ListCard storeKey="contacts" items={$contacts}>
+    <div slot="empty">
+        No contacts.
+    </div>
+
+    <div slot="item-header" let:item>
+        <Contact {item} details={false} />
+    </div>
+
+    <div slot="item-details" let:item>
+        <Contact {item} summary={false} />
+    </div>
+
+    <div slot="actions">
+        <Import name="Contact"
+        adder={(petname, obj) => E(walletP).addContact(petname, obj)}>
+        Import
+        </Import>
+    </div>
+</ListCard>
diff --git a/packages/dapp-svelte-wallet/ui/src/DappsV2.svelte b/packages/dapp-svelte-wallet/ui/src/DappsV2.svelte
@@ -1,9 +1,24 @@
 <script>
+    import ListCard from "../lib/ListCard.svelte";
+    import Card from 'smelte/src/components/Card';
+    import Dapp from "./Dapp.svelte";
 
+    import { dapps } from './store';
+
+    export let expandDefault = true;
 </script>
-<style>
 
-</style>
-<div>
-    <h1>Dapps</h1>
-</div>
+<h1>Dapps</h1>
+<ListCard items={$dapps} storeKey="dapps-{expandDefault}" {expandDefault}>
+    <div slot="empty">
+        No Dapps.
+    </div>
+
+    <div slot="item-header" let:item>
+        <Dapp {item} details={false}/>
+    </div>
+
+    <div slot="item-details" let:item>
+        <Dapp {item} summary={false}/>
+    </div>
+</ListCard>
diff --git a/packages/dapp-svelte-wallet/ui/src/IssuersV2.svelte b/packages/dapp-svelte-wallet/ui/src/IssuersV2.svelte
@@ -1,9 +1,29 @@
 <script>
+    import { E } from '@agoric/eventual-send';
+    import ListCard from '../lib/ListCard.svelte';
 
+    import Issuer from './Issuer.svelte';
+    import Import from './Import.svelte';
+
+    import { issuers, walletP } from './store';
 </script>
-<style>
 
-</style>
-<div>
-    <h1>Issuers</h1>
-</div>
+<h1>Issuers</h1>
+<ListCard items={$issuers} storeKey="issuers">
+    <div slot="empty">
+        No issuers.
+    </div>
+
+    <div slot="item-header" let:item>
+        <Issuer {item} details={false} />
+    </div>
+
+    <div slot="item-details" let:item>
+        <Issuer {item} summary={false} />
+    </div>
+
+    <div slot="actions">
+        <Import name="Issuer"
+        adder={(petname, obj) => E(walletP).addIssuer(petname, obj, true)}>Import</Import>
+    </div>
+</ListCard>
diff --git a/packages/dapp-svelte-wallet/ui/src/PursesV2.svelte b/packages/dapp-svelte-wallet/ui/src/PursesV2.svelte
@@ -1,9 +1,26 @@
 <script>
-
-</script>
-<style>
-
-</style>
-<div>
-    <h1>Purses</h1>
-</div>
+    import ListCard from '../lib/ListCard.svelte';
+    import Purse from "./Purse.svelte";
+    import Card from 'smelte/src/components/Card';
+  
+    import { purses } from './store';
+  </script>
+
+  <h1>Purses</h1>
+  <ListCard items={$purses} storeKey="purses">  
+    <div slot="empty">
+      No purses.
+    </div>
+
+    <div slot="item-header" let:item>
+      <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>
+      <Purse {item} summary={false}/>
+    </div>
+  </ListCard>