Skip to content

Commit

Permalink
first commit
Browse files Browse the repository at this point in the history
  • Loading branch information
@RojhatToptamus
RojhatToptamus committed Jun 22, 2024
1 parent 16c74b7 commit 7af2723
Show file tree
Hide file tree
Showing 6 changed files with 848 additions and 0 deletions.
90 changes: 90 additions & 0 deletions packages/nextjs/app/dashboard/attestation/[uid]/page.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,90 @@
'use client'
import React, { useState, useEffect } from "react";
import { useRouter,useSearchParams } from "next/navigation";
import { fetchAttestation,Attestation } from "~~/utils/utils";



export default function AttestationPage({ params }: { params: { uid: string } }) {
const uid = params.uid;
const [attestation, setAttestation] = useState<Attestation | null>(null);

useEffect(() => {
console.log('UUID:', uid);
if (uid) {
fetchAttestation(uid)
.then(data => {
console.log('Fetched data:', data);
setAttestation(data);
})
.catch(error => {
console.error('Error fetching attestation:', error);
});
}
}, [uid]);

if (!attestation) {
return <div>Loading...</div>;
}

return (
<div className="attestation-container p-6 shadow-md rounded-lg bg-[#E9E9F6]">
<div className="mb-4">
<span className="block text-sm text-gray-600">UID:</span>
<span className="block text-lg font-semibold text-gray-600">{attestation.uid}</span>
</div>
<div className="border rounded-md overflow-hidden">
<table className="min-w-full bg-white">
<tbody>
<tr className="border-b">
<td className="px-4 py-2 text-sm font-medium text-gray-700 bg-gray-50">Schema</td>
<td className="px-4 py-2 text-sm text-gray-900">{attestation.schema}</td>
</tr>
<tr className="border-b">
<td className="px-4 py-2 text-sm font-medium text-gray-700 bg-gray-50">Is Endorsement</td>
<td className="px-4 py-2 text-sm text-gray-900">{attestation.isEndorsement ? 'True' : 'False'}</td>
</tr>
<tr className="border-b">
<td className="px-4 py-2 text-sm font-medium text-gray-700 bg-gray-50">Name</td>
<td className="px-4 py-2 text-sm text-gray-900">{attestation.name}</td>
</tr>
<tr className="border-b">
<td className="px-4 py-2 text-sm font-medium text-gray-700 bg-gray-50">Domain</td>
<td className="px-4 py-2 text-sm text-gray-900">{attestation.domain}</td>
</tr>
<tr className="border-b">
<td className="px-4 py-2 text-sm font-medium text-gray-700 bg-gray-50">Context</td>
<td className="px-4 py-2 text-sm text-gray-900">{attestation.context}</td>
</tr>
<tr className="border-b">
<td className="px-4 py-2 text-sm font-medium text-gray-700 bg-gray-50">IPFS Hash</td>
<td className="px-4 py-2 text-sm text-gray-900"><a href={attestation.ipfsHash} className="text-blue-500">{attestation.ipfsHash}</a></td>
</tr>
<tr className="border-b">
<td className="px-4 py-2 text-sm font-medium text-gray-700 bg-gray-50">From</td>
<td className="px-4 py-2 text-sm text-gray-900">{attestation.from}</td>
</tr>
<tr className="border-b">
<td className="px-4 py-2 text-sm font-medium text-gray-700 bg-gray-50">To</td>
<td className="px-4 py-2 text-sm text-gray-900">{attestation.to}</td>
</tr>
<tr className="border-b">
<td className="px-4 py-2 text-sm font-medium text-gray-700 bg-gray-50">Created</td>
<td className="px-4 py-2 text-sm text-gray-900">{attestation.created}</td>
</tr>
<tr className="border-b">
<td className="px-4 py-2 text-sm font-medium text-gray-700 bg-gray-50">Expiration</td>
<td className="px-4 py-2 text-sm text-gray-900">{attestation.expiration}</td>
</tr>
<tr>
<td className="px-4 py-2 text-sm font-medium text-gray-700 bg-gray-50">Revoked</td>
<td className="px-4 py-2 text-sm text-gray-900">{attestation.revoked}</td>
</tr>
</tbody>
</table>
</div>
</div>
);
};


137 changes: 137 additions & 0 deletions packages/nextjs/app/dashboard/page.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,137 @@
"use client";
import React, { useState, useEffect } from "react";
import Link from "next/link";
import { fetchAllAttestations, fetchStats, shortAddress} from "~~/utils/utils";
const Dashboard = () => {
const [attestations, setAttestations] = useState<any[]>([]);
const [stats, setStats] = useState<{
totalAtestations: number;
totalSchemas: number;
totalAttestors: number;
}>({
totalAtestations: 0,
totalSchemas: 0,
totalAttestors: 0,
});

const getAttestations = async () => {
try {
const attestationData = await fetchAllAttestations();
const stats = await fetchStats();
setAttestations(attestationData);
setStats(stats);
} catch (error) {
console.error("Error fetching attestations:", error);
}
};

const AttestationLink = ({ uid }: { uid: string }) => (
<Link href={`/dashboard/attestation/${uid}`} className="text-[#495FA9]">
{shortAddress(uid)}
</Link>
);

const DashboardStats = ({
totalAtestations,
totalSchemas,
totalAttestors,
}: {
totalAtestations: number;
totalSchemas: number;
totalAttestors: number;
}) => (
<div className="flex justify-around mb-6">
<div className="text-center">
<div className="text-3xl font-bold text-[#495FA9]">
{totalAtestations}
</div>
<div className="text-gray-600">Total Attestations</div>
</div>
<div className="text-center">
<div className="text-3xl font-bold text-[#495FA9]">{totalSchemas}</div>
<div className="text-gray-600">Total Schemas</div>
</div>
<div className="text-center">
<div className="text-3xl font-bold text-[#495FA9]">
{totalAttestors}
</div>
<div className="text-gray-600">Total Attestors</div>
</div>
</div>
);

useEffect(() => {
getAttestations();
}, []);
return (
<div>
<div className="p-4 bg-[#E9E9F6]">
<div className=" p-6 rounded-lg shadow-md">
<div className="flex justify-between items-center mb-6">
<div>
<h1 className="text-2xl font-bold text-[#495FA9]">
Attestation Scan
</h1>
<p className="text-gray-600">
Showing the most recent Solas Attestations.
</p>
</div>
<button className="bg-[#F5A162] text-white px-4 py-2 rounded-lg">
Make Attestation
</button>
</div>
<DashboardStats
totalAtestations={stats.totalAtestations}
totalSchemas={stats.totalSchemas}
totalAttestors={stats.totalAttestors}
/>
<div className="overflow-x-auto">
<table className="min-w-full bg-white border border-gray-200">
<thead>
<tr className="bg-gray-100 border-b">
<th className="px-4 py-2 text-[#495FA9]">UID</th>
<th className="px-4 py-2 text-[#495FA9]">Schema</th>
<th className="px-4 py-2 text-[#495FA9]">From</th>
<th className="px-4 py-2 text-[#495FA9]">To</th>
<th className="px-4 py-2 text-[#495FA9]">Type</th>
<th className="px-4 py-2 text-[#495FA9]">Age</th>
</tr>
</thead>
<tbody>
{attestations.map((attestation) => (
<tr key={attestation.uid} className="border-b">
<td className="px-4 py-2">
<AttestationLink uid={attestation.uid} />
</td>
<td className="px-4 py-2 text-[#495FA9]">
{attestation.schema}
</td>
<td className="px-4 py-2 text-[#495FA9]">
{attestation.from}
</td>
<td className="px-4 py-2 text-[#495FA9]">
{attestation.to}
</td>
<td className="px-4 py-2 text-[#495FA9]">
{attestation.type}
</td>
<td className="px-4 py-2 text-[#495FA9]">
{attestation.age}
</td>
</tr>
))}
</tbody>
</table>
</div>
<div className="mt-4 text-center">
<a className="text-blue-600" href="/attestations">
View all attestations
</a>
</div>
</div>
</div>
</div>
);
};

export default Dashboard;
5 changes: 5 additions & 0 deletions packages/nextjs/utils/Provider.ts
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
import { RpcProvider } from 'starknet';

export const provider = new RpcProvider({
nodeUrl: "https://free-rpc.nethermind.io/mainnet-juno/"
});
52 changes: 52 additions & 0 deletions packages/nextjs/utils/placeholder-data.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
export const articles = [
{
id: 1,
date: '2021-09-01',
author: 'Author 1',
title:
'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nulla',
content:
"Lorem Ipsum is simply dummy text of the printing and typesetting industry. It has been the industry's standard dummy text ever since the 1500s. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages.",
image: 'https://picsum.photos/300/300?random=1',
},
{
id: 2,
date: '2021-09-02',
author: 'Author 2',
title:
'Donec rutrum nibh velit, eget viverra purus dapibus id. In in imperdiet dolor',
content:
'Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium. Totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.',
image: 'https://picsum.photos/300/300?random=2',
},
{
id: 3,
date: '2021-09-03',
author: 'Author 3',
title:
'Aenean lobortis fringilla lectus ac suscipit. Praesent iaculis neque nec rutrum dapibus',
content:
'At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident.',
image: 'https://picsum.photos/300/300?random=3',
},
{
id: 4,
date: '2021-09-04',
author: 'Author 4',
title:
'Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae',
content:
'Nor again is there anyone who loves or pursues or desires to obtain pain of itself, because it is pain, but because occasionally circumstances occur in which toil and pain can procure him some great pleasure.',
image: 'https://picsum.photos/300/300?random=4',
},
{
id: 5,
date: '2021-09-05',
author: 'Author 5',
title: 'Curabitur non nulla sit amet nisl tempus convallis quis ac lectus',
content:
'On the other hand, we denounce with righteous indignation and dislike men who are so beguiled and demoralized by the charms of pleasure of the moment, so blinded by desire, that they cannot foresee the pain and trouble.',
image: 'https://picsum.photos/300/300?random=5',
},
];

Loading

0 comments on commit 7af2723

Please sign in to comment.