-
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.
- Loading branch information
1 parent
8588130
commit 326e0a2
Showing
3 changed files
with
225 additions
and
4 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,112 @@ | ||
| import Image from "next/image"; | ||
| import { useAccount } from "wagmi"; | ||
| import { Avatar } from "@readyplayerme/visage"; | ||
| import React from "react"; | ||
| import { PhygitalType } from "../types/types"; | ||
|
|
||
|
|
||
| const formatDate = () => { | ||
| const now = new Date(Date.now()); | ||
| const day = String(now.getDate()).padStart(2, '0'); | ||
| const month = String(now.getMonth() + 1).padStart(2, '0'); | ||
| const year = now.getFullYear(); | ||
|
|
||
| return `${day} /${month}/ ${year}`; | ||
| }; | ||
|
|
||
| const formatDateFromISO = (isoString: string) => { | ||
| const date = new Date(isoString); | ||
| const day = String(date.getDate()).padStart(2, '0'); | ||
| const month = String(date.getMonth() + 1).padStart(2, '0'); | ||
| const year = date.getFullYear(); | ||
|
|
||
| return `${day} /${month}/ ${year}`; | ||
| }; | ||
|
|
||
|
|
||
| export const ProvenanceAttestation = ({phygital, avatarModel, showAttestation}: {phygital: PhygitalType, avatarModel: string, showAttestation: () => void}) => { | ||
| const { address } = useAccount() | ||
|
|
||
| const removePrefix = (uri: string) => { | ||
| return uri?.substring(7, uri.length) | ||
| } | ||
|
|
||
| return ( | ||
| <div className="py-8 px-12 bg-white shadow-md"> | ||
| <div className="flex justify-between mb-4"> | ||
| <div className="pr-4"> | ||
| <h1 className="text-2xl font-bold">Provenance Attestation</h1> | ||
| <p className="text-sm">This certificate confirms the authenticity of the product and provides a verifiable record of its provenance on the blockchain.</p> | ||
| </div> | ||
| <div className="basis-2/6"> | ||
| <p className="text-sm">Date: {formatDate()}</p> | ||
| <p className="text-xs">Base Network</p> | ||
| </div> | ||
| </div> | ||
| <div className="flex items-center gap-4"> | ||
| <img src={`https://nftstorage.link/ipfs/${removePrefix(phygital.image)}`} alt="phygital image" width={200} height={200} /> | ||
| <div className="text-sm grid gap-2"> | ||
| <h2 className="text-lg font-bold">{phygital.name}</h2> | ||
| <p>Unique piece</p> | ||
| <p>Created by: {phygital.brand_name}</p> | ||
| <p>Owned by: {phygital?.deployer_address?.toString()}</p> | ||
| <p>Date purchased: 20 / 10 / 2024</p> | ||
| <p>{phygital?.price?.toString()} ETH</p> | ||
| </div> | ||
| </div> | ||
| <hr className="my-8" /> | ||
| <div className="flex gap-4"> | ||
| <div className="basis-5/6 pr-4"> | ||
| <h3 className="text-lg font-bold mb-4">Product Description</h3> | ||
| <p className="text-base">{phygital.description}</p> | ||
| </div> | ||
| <div className="h-[12rem] w-[6rem]"> | ||
| <h4 className="text-center font-bold ">Avatar</h4> | ||
| <Avatar modelSrc={avatarModel} cameraInitialDistance={3} className="bg-neutral-950" /> | ||
| </div> | ||
| </div> | ||
| <hr className="my-8" /> | ||
| <div className="my-4"> | ||
| <h3 className="text-lg font-bold">NFT Details</h3> | ||
| <div className="mt-4"> | ||
| <div className="grid grid-cols-[1fr_3fr]"> | ||
| <p>Token ID</p> | ||
| <p className="text-right">{phygital.id}</p> | ||
| </div> | ||
| <div className="grid grid-cols-[1fr_3fr]"> | ||
| <p>Token Standard</p> | ||
| <p className="text-right">ERC-721A</p> | ||
| </div> | ||
| <div className="grid grid-cols-[1fr_3fr]"> | ||
| <p>Chain</p> | ||
| <p className="text-right">Base Network</p> | ||
| </div> | ||
| <div className="grid grid-cols-[1fr_3fr]"> | ||
| <p>Date created</p> | ||
| <p className="text-right">{formatDateFromISO(phygital.created_at)}</p> | ||
| </div> | ||
| <div className="grid grid-cols-[1fr_3fr]"> | ||
| <p>Last sale</p> | ||
| <p className="text-right">20/10/2024</p> | ||
| </div> | ||
| <div className="grid grid-cols-[1fr_3fr]"> | ||
| <p>Last updated</p> | ||
| <p className="text-right">{formatDateFromISO(phygital.updated_at)}</p> | ||
| </div> | ||
| <div className="grid grid-cols-[1fr_3fr]"> | ||
| <p>Creator Earnings </p> | ||
| <p className="text-right">{phygital?.royality} %</p> | ||
| </div> | ||
| <div className="grid grid-cols-[1fr_3fr]"> | ||
| <p>Contract Address | ||
| </p> | ||
| <p className="text-right">{phygital.contract_address}</p> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <div className="flex justify-center gap-4 mt-8"> | ||
| <button className="bg-[#30D8FF] text-black px-4 py-2 rounded-md">Print</button> | ||
| <button className="bg-[#30D8FF] text-black px-4 py-2 rounded-md cursor-pointer" onClick={showAttestation}>Close</button> | ||
| </div> | ||
| </div>); | ||
| }; |
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,89 @@ | ||
| export type AvatarType = { | ||
| id: string | ||
| avatar_id: string | ||
| url: string | ||
| user_id: string | ||
| phygital_id: string | ||
| avatar_voice: string | ||
| chaintype_id: string | ||
| created_at: string | ||
| updated_at: string | ||
| } | ||
|
|
||
| export type FanTokenType = { | ||
| id: string | ||
| brand_id: string | ||
| collection_id: string | ||
| phygital_id: string | ||
| created_at: string | ||
| updated_at: string | ||
| fan_token_id: string | ||
| chaintype_id: string | ||
| phygital_name: string | ||
| } | ||
|
|
||
| export type BrandType = { | ||
| id: string | ||
| name: string | ||
| description: string | ||
| logo_image: string | ||
| cover_image: string | ||
| representative: string | ||
| contact_email: string | ||
| contact_phone: string | ||
| shipping_address: string | ||
| additional_info: string | ||
| industry: string | ||
| tags: string | ||
| fees: number | ||
| payout_address: string | ||
| access_master: string | ||
| trade_hub: string | ||
| blockchain: string | ||
| chain_id: string | ||
| manager_id: string | ||
| chaintype_id: string | ||
| } | ||
|
|
||
| export type CollectionType = { | ||
| iduuid: string | ||
| name: string | ||
| description: string | ||
| logo_image: string | ||
| cover_image: string | ||
| category: any // Replace with appropriate type if known | ||
| tags: string | ||
| status: bigint | ||
| brand_id: string | ||
| chaintype_id: string | ||
| } | ||
|
|
||
| export type PhygitalType = { | ||
| id: string | ||
| name: string | ||
| brand_name: string | ||
| category: any // Replace with appropriate type if known | ||
| description: string | ||
| price: number | ||
| quantity: number | ||
| royalty: number | ||
| image: string | ||
| product_info: string | ||
| color: string | ||
| size: string | ||
| weight: number | ||
| material: string | ||
| usage: string | ||
| quality: string | ||
| manufacturer: string | ||
| origin_country: string | ||
| metadata_uri: string | ||
| deployer_address: string | ||
| contract_address: string | ||
| graph_url: string | ||
| collection_id: string | ||
| chaintype_id: string | ||
| created_at: string | ||
| updated_at: string | ||
| royality : string | ||
| } |