-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #11 from cetceeve/small-ui-updates
Created items at home and ownership tracking
- Loading branch information
Showing
10 changed files
with
232 additions
and
54 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,22 +1,40 @@ | ||
<script> | ||
import { Link } from "svelte-routing"; | ||
import { Link, navigate } from "svelte-routing"; | ||
import PassportLoader from "./PassportLoader.svelte"; | ||
import PassportCard from "./PassportCard.svelte"; | ||
export let contract; | ||
export let activeAcc; | ||
</script> | ||
|
||
<div class="center"> | ||
<h2>Your digital passport for your physical items</h2> | ||
<Link to="/create"> | ||
<button><strong>CREATE</strong></button> | ||
</Link> | ||
<p>Create a new Item Passport now!</p> | ||
<h2>Your digital passport for your physical items</h2> | ||
<Link to="/create"> | ||
<button><strong>CREATE</strong></button> | ||
</Link> | ||
<p>Create a new Item Passport now!</p> | ||
</div> | ||
<Link to="/item/1"> | ||
<button class="outline"> | ||
Go to Test Item | ||
</button> | ||
</Link> | ||
|
||
{#if activeAcc} | ||
<h4>You created these items:</h4> | ||
{#await contract.methods.getCreatedItemTokens(activeAcc).call() then tokenList} | ||
{#each tokenList as tokenId} | ||
<PassportLoader {contract} {tokenId} let:data> | ||
<Link to={"/item/" + tokenId}> | ||
<div class="notlink"> | ||
<PassportCard {...data} /> | ||
</div> | ||
</Link> | ||
</PassportLoader> | ||
{/each} | ||
{/await} | ||
{/if} | ||
|
||
<style> | ||
.center { | ||
.center { | ||
text-align: center; | ||
} | ||
</style> | ||
} | ||
.notlink { | ||
color: whitesmoke; | ||
} | ||
</style> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Empty file.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
<script> | ||
export let contract; | ||
export let tokenId; | ||
</script> | ||
|
||
{#await contract.methods.getPassport(tokenId).call()} | ||
<article aria-busy="true">loading nft data</article> | ||
{:then data} | ||
<slot {data}/> | ||
{/await} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,52 @@ | ||
<script> | ||
import { createForm } from "felte"; | ||
export let contract; | ||
export let closeForm; | ||
export let activeAcc; | ||
export let tokenId; | ||
let errorMsg = ""; | ||
async function transferOwnership(input) { | ||
// we are deliberatly not doing any error handling here as it will be done in the form component | ||
if (!activeAcc) { | ||
throw "Please connect to a wallet!"; | ||
} | ||
return await contract.methods.updateOwnership( | ||
activeAcc, input.owner, tokenId | ||
).send({from: activeAcc}); | ||
} | ||
const { form, isSubmitting } = createForm({ | ||
onSubmit: (values, _) => { | ||
console.log(values) | ||
errorMsg = ""; | ||
// TODO: change this to actually checking if values have changed | ||
return transferOwnership(values); | ||
}, | ||
onSuccess(response, context) { | ||
// Do something with the returned value from `onSubmit`. | ||
console.log(response); | ||
console.log("on success was called"); | ||
closeForm(); | ||
}, | ||
onError(err, context) { | ||
// Do something with the error thrown from `onSubmit`. | ||
errorMsg = err; | ||
}, | ||
}); | ||
</script> | ||
|
||
<form use:form> | ||
<label for="owner">Item name</label> | ||
<input type="text" id="owner" name="owner" placeholder="Next owner" /> | ||
|
||
<button type="submit" aria-busy={$isSubmitting}>Transfer Ownership</button> | ||
{#if errorMsg}<strong class="errorMsg">{errorMsg}</strong>{/if} | ||
</form> | ||
|
||
<style> | ||
.errorMsg { | ||
color: red; | ||
} | ||
</style> |
Oops, something went wrong.