Skip to content

Commit

Permalink
update changes
Browse files Browse the repository at this point in the history
  • Loading branch information
@arjanjohan
arjanjohan committed Jul 13, 2024
1 parent 307f6c1 commit f0ac374
Show file tree
Hide file tree
Showing 12 changed files with 177 additions and 143 deletions.
53 changes: 53 additions & 0 deletions packages/foundry/broadcast/deploy_Notes.s.sol/534351/run-1720896957.json
View file

Large diffs are not rendered by default.

32 changes: 16 additions & 16 deletions packages/foundry/broadcast/deploy_Notes.s.sol/534351/run-latest.json
View file

Large diffs are not rendered by default.

128 changes: 61 additions & 67 deletions packages/nextjs/app/create/page.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,28 +1,27 @@
"use client";

import { useState, useEffect } from "react";
import { useEffect, useState } from "react";
import { IDKitWidget, ISuccessResult, useIDKit } from "@worldcoin/idkit";
import axios from "axios";
import type { NextPage } from "next";
import { useTheme } from "next-themes";
import { decodeAbiParameters, parseAbiParameters } from "viem";
import { useAccount } from "wagmi";
import axios from "axios";
import { AddressInput } from "~~/components/scaffold-eth";
import { useDeployedContractInfo, useScaffoldWriteContract } from "~~/hooks/scaffold-eth";
import { useTargetNetwork } from "~~/hooks/scaffold-eth";
import { IDKitWidget, ISuccessResult, useIDKit } from '@worldcoin/idkit'
import { useTheme } from "next-themes";
import { decodeAbiParameters, parseAbiParameters } from 'viem'


const CreateNote: NextPage = () => {
const { targetNetwork } = useTargetNetwork();
const [address, setAddress] = useState("");
const [proof, setProof] = useState("")
const [proof, setProof] = useState("");
const [noteContent, setNoteContent] = useState("");
const [isDanger, setIsDanger] = useState(false);
const { address: connectedAccount } = useAccount();
const { data: NotesContractInfo } = useDeployedContractInfo("Notes");
const { writeContractAsync: writeNotesContractAsync } = useScaffoldWriteContract("Notes");
const { resolvedTheme } = useTheme();

const isDarkMode = resolvedTheme === "dark";

const handleCreateNote = async () => {
Expand All @@ -34,45 +33,43 @@ const CreateNote: NextPage = () => {
sentiment: isDanger,
timestamp: Date.now(),
};

console.log("proof", proof);
const note_ipfs = JSON.stringify(note);

try {
// Pass Note to the endpoint and store response
console.log("note_ipfs", note_ipfs);
const response = await axios.post("http://3.122.247.155:3000/createNewNote", {

const response = await axios.post(`${process.env.NEXT_PUBLIC_IPFS_API}/createNewNote`, {
note: note_ipfs,
});

console.log("response", response.status);
if (!response.status === 200) {
throw new Error("Failed to store note in IPFS");
}

console.log("CID", response.data.cid["/"]);

// Dummy proof for networks without World ID
let transformedProof = {
root: BigInt(0),
signal: "0x0000000000000000000000000000000000000000",
nullifierHash: BigInt(0),
proof: Array(8).fill(BigInt(0))
};
let transformedProof = {
root: BigInt(0),
signal: "0x0000000000000000000000000000000000000000",
nullifierHash: BigInt(0),
proof: Array(8).fill(BigInt(0)),
};

// If the proof is available, use it.
if (proof) {
transformedProof = {
root: BigInt(proof!.merkle_root),
signal: connectedAccount,
nullifierHash: BigInt(proof!.nullifier_hash),
proof: decodeAbiParameters(
parseAbiParameters('uint256[8]'),
proof!.proof as `0x${string}`
)[0],
proof: decodeAbiParameters(parseAbiParameters("uint256[8]"), proof!.proof as `0x${string}`)[0],
};
}

console.log("transformedProof", transformedProof);
// Write the note to the contract
await writeNotesContractAsync({
Expand All @@ -94,55 +91,53 @@ const CreateNote: NextPage = () => {

return (
<div className="container mx-auto p-8">

<h1 className="text-center mb-4 mt-5">
<span className="block text-4xl font-bold">Create a Note</span>
</h1>


<div className="flex justify-center items-center">

{!proof && targetNetwork?.id === 84532 && (
<div className="w-full max-w-lg bg-base-100 shadow-lg shadow-secondary border-8 border-secondary rounded-xl p-4 m-4 text-center">
<p>We use Worldcoin World ID to verify your identity. Please sign in to continue. </p>
<IDKitWidget

app_id={process.env.NEXT_PUBLIC_APP_ID as `app_${string}`}
action={process.env.NEXT_PUBLIC_ACTION_CREATE as string}
signal={connectedAccount} // proof will only verify if the signal is unchanged, this prevents tampering
onSuccess={setProof} // use onSuccess to call your smart contract
// no use for handleVerify, so it is removed
// use default verification_level (orb-only), as device credentials are not supported on-chain
>
{({ open }) => <button className="btn btn-primary" onClick={open}>Verify with World ID</button>}
</IDKitWidget>
<p>Powered by: </p>
<div>
{isDarkMode ? (
<img src="Worldcoin-logo-lockup-light.svg" alt="Worldcoin Logo" className="w-200" />
) : (
<img src="Worldcoin-logo-lockup-dark.svg" alt="Worldcoin Logo" className="w-200" />
)}
<div className="w-full max-w-lg bg-base-100 shadow-lg shadow-secondary border-8 border-secondary rounded-xl p-4 m-4 text-center">
<p>We use Worldcoin World ID to verify your identity. Please sign in to continue. </p>
<IDKitWidget
app_id={process.env.NEXT_PUBLIC_APP_ID as `app_${string}`}
action={process.env.NEXT_PUBLIC_ACTION_CREATE as string}
signal={connectedAccount} // proof will only verify if the signal is unchanged, this prevents tampering
onSuccess={setProof} // use onSuccess to call your smart contract
// no use for handleVerify, so it is removed
// use default verification_level (orb-only), as device credentials are not supported on-chain
>
{({ open }) => (
<button className="btn btn-primary" onClick={open}>
Verify with World ID
</button>
)}
</IDKitWidget>
<p>Powered by: </p>
<div>
{isDarkMode ? (
<img src="/Worldcoin-logo-lockup-light.svg" alt="Worldcoin Logo" className="w-200" />
) : (
<img src="/Worldcoin-logo-lockup-dark.svg" alt="Worldcoin Logo" className="w-200" />
)}
</div>
</div>

</div>)}
)}
{proof && targetNetwork?.id === 84532 && (
<div className="w-full max-w-lg bg-base-100 shadow-lg shadow-secondary border-8 border-secondary rounded-xl p-4 m-4 text-center">
<p>You have verified with World ID. </p>

<p>Powered by: </p>
<div>
{isDarkMode ? (
<img src="Worldcoin-logo-lockup-light.svg" alt="Worldcoin Logo" className="w-200" />
) : (
<img src="Worldcoin-logo-lockup-dark.svg" alt="Worldcoin Logo" className="w-200" />
)}
<p>You have verified with World ID. </p>

<p>Powered by: </p>
<div>
{isDarkMode ? (
<img src="/Worldcoin-logo-lockup-light.svg" alt="Worldcoin Logo" className="w-200" />
) : (
<img src="/Worldcoin-logo-lockup-dark.svg" alt="Worldcoin Logo" className="w-200" />
)}
</div>
</div>

</div>
)}

</div>
</div>

<div className="flex justify-center items-center">
<div className="w-full max-w-lg bg-base-100 shadow-lg shadow-secondary border-8 border-secondary rounded-xl p-8 m-8">
Expand All @@ -152,8 +147,7 @@ const CreateNote: NextPage = () => {
<div className="flex flex-col space-y-4">
<div className="flex flex-col items-center">
<span className="w-full">
Address{" "}
<AddressInput value={address} onChange={(value) => setAddress(value)} placeholder="Address" />
Address <AddressInput value={address} onChange={value => setAddress(value)} placeholder="Address" />
</span>
</div>
<div className="flex flex-col items-center">
Expand All @@ -162,7 +156,7 @@ const CreateNote: NextPage = () => {
<textarea
className="textarea textarea-bordered w-full"
value={noteContent}
onChange={(e) => setNoteContent(e.target.value)}
onChange={e => setNoteContent(e.target.value)}
placeholder="Note Content"
/>
</span>
Expand All @@ -174,7 +168,7 @@ const CreateNote: NextPage = () => {
type="checkbox"
className="toggle toggle-error"
checked={isDanger}
onChange={(e) => setIsDanger(e.target.checked)}
onChange={e => setIsDanger(e.target.checked)}
/>
</label>
</div>
Expand Down
4 changes: 2 additions & 2 deletions packages/nextjs/app/layout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@ import "~~/styles/globals.css";
import { getMetadata } from "~~/utils/scaffold-eth/getMetadata";

export const metadata = getMetadata({
title: "Scaffold-ETH 2 App",
description: "Built with 🏗 Scaffold-ETH 2",
title: "Oh Snap!",
description: "On-chain Community Notes using Metamask Snap",
});

const ScaffoldEthApp = ({ children }: { children: React.ReactNode }) => {
Expand Down
42 changes: 18 additions & 24 deletions packages/nextjs/app/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
import Link from "next/link";
import type { NextPage } from "next";
import { useAccount } from "wagmi";
import { BugAntIcon, MagnifyingGlassIcon } from "@heroicons/react/24/outline";
import { MagnifyingGlassIcon, PlusIcon } from "@heroicons/react/24/outline";
import { Address } from "~~/components/scaffold-eth";

const Home: NextPage = () => {
Expand All @@ -15,48 +15,42 @@ const Home: NextPage = () => {
<div className="px-5">
<h1 className="text-center">
<span className="block text-2xl mb-2">Welcome to</span>
<span className="block text-4xl font-bold">Scaffold-ETH 2</span>
<span className="block text-4xl font-bold">Oh Snap!</span>
</h1>
<div className="flex justify-center items-center space-x-2 flex-col sm:flex-row">
<p className="my-2 font-medium">Connected Address:</p>
<Address address={connectedAddress} />
</div>
<p className="text-center text-lg">
Get started by editing{" "}
<code className="italic bg-base-300 text-base font-bold max-w-full break-words break-all inline-block">
packages/nextjs/app/page.tsx
</code>
</p>
<p className="text-center text-lg">
Edit your smart contract{" "}
<code className="italic bg-base-300 text-base font-bold max-w-full break-words break-all inline-block">
YourContract.sol
</code>{" "}
in{" "}
<code className="italic bg-base-300 text-base font-bold max-w-full break-words break-all inline-block">
packages/hardhat/contracts
</code>

<p>
<img
src="/logo.png"
// alt={fighters[0].name}
// style={{ height: "200px" }}
/>
</p>
<br></br>
</div>
<p className="text-center text-lg">Providing context to contracts before making an on-chain transaction</p>

<div className="flex-grow bg-base-300 w-full mt-16 px-8 py-12">
<div className="flex justify-center items-center gap-12 flex-col sm:flex-row">
<div className="flex flex-col bg-base-100 px-10 py-10 text-center items-center max-w-xs rounded-3xl">
<BugAntIcon className="h-8 w-8 fill-secondary" />
<PlusIcon className="h-8 w-8 fill-secondary" />
<p>
Tinker with your smart contract using the{" "}
<Link href="/debug" passHref className="link">
Debug Contracts
Provide context to an a contract on the{" "}
<Link href="/create" passHref className="link">
Create Note
</Link>{" "}
tab.
</p>
</div>
<div className="flex flex-col bg-base-100 px-10 py-10 text-center items-center max-w-xs rounded-3xl">
<MagnifyingGlassIcon className="h-8 w-8 fill-secondary" />
<p>
Explore your local transactions with the{" "}
<Link href="/blockexplorer" passHref className="link">
Block Explorer
Explore all notes made on a contract by using the{" "}
<Link href="/view" passHref className="link">
View Notes
</Link>{" "}
tab.
</p>
Expand Down
25 changes: 14 additions & 11 deletions packages/nextjs/app/view/[address]/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,13 @@

import { useEffect, useState } from "react";
import { useParams } from "next/navigation";
import type { NextPage } from "next";
import { IDKitWidget } from "@worldcoin/idkit";
import axios from "axios";
import type { NextPage } from "next";
import { useTheme } from "next-themes";
import { isAddress } from "viem";
import { Address } from "~~/components/scaffold-eth";
import { useTargetNetwork } from "~~/hooks/scaffold-eth";
import { useTheme } from "next-themes";
import { IDKitWidget } from '@worldcoin/idkit';
import { useScaffoldReadContract, useScaffoldWriteContract } from "~~/hooks/scaffold-eth";

const ViewNote: NextPage = () => {
Expand Down Expand Up @@ -48,8 +48,8 @@ const ViewNote: NextPage = () => {
const contentsPromises = noteInfo.map(async (note: any) => {
try {
console.log("Note content response: TRY");
const response = await axios.get(`http://3.122.247.155:3000/getNote?cid=${note.uri}`);

const response = await axios.get(`${process.env.NEXT_PUBLIC_IPFS_API}/getNote?cid=${note.uri}`);
console.log("Note content response:", response);
return response.data.content;
} catch (error) {
Expand Down Expand Up @@ -101,14 +101,18 @@ const ViewNote: NextPage = () => {
signal={address}
onSuccess={setProof}
>
{({ open }) => <button className="btn btn-primary" onClick={open}>Verify with World ID</button>}
{({ open }) => (
<button className="btn btn-primary" onClick={open}>
Verify with World ID
</button>
)}
</IDKitWidget>
<p>Powered by: </p>
<div>
{isDarkMode ? (
<img src="Worldcoin-logo-lockup-light.svg" alt="Worldcoin Logo" className="w-200" />
<img src="/Worldcoin-logo-lockup-light.svg" alt="Worldcoin Logo" className="w-200" />
) : (
<img src="Worldcoin-logo-lockup-dark.svg" alt="Worldcoin Logo" className="w-200" />
<img src="/Worldcoin-logo-lockup-dark.svg" alt="Worldcoin Logo" className="w-200" />
)}
</div>
</div>
Expand All @@ -119,9 +123,9 @@ const ViewNote: NextPage = () => {
<p>Powered by: </p>
<div>
{isDarkMode ? (
<img src="Worldcoin-logo-lockup-light.svg" alt="Worldcoin Logo" className="w-200" />
<img src="/Worldcoin-logo-lockup-light.svg" alt="Worldcoin Logo" className="w-200" />
) : (
<img src="Worldcoin-logo-lockup-dark.svg" alt="Worldcoin Logo" className="w-200" />
<img src="/Worldcoin-logo-lockup-dark.svg" alt="Worldcoin Logo" className="w-200" />
)}
</div>
</div>
Expand All @@ -147,7 +151,6 @@ const ViewNote: NextPage = () => {
</div>
<div className="flex flex-col mb-4">
<span className="block text-xl font-semibold mb-2">Score: {votes[index]?.score.toString()}</span>

</div>
<div className="flex flex-col mb-4">
<span className="block text-xl font-semibold mb-2">Rate this note</span>
Expand Down
Loading

0 comments on commit f0ac374

Please sign in to comment.