diff --git a/src/components/CreateNimi/CreateNimi.tsx b/src/components/CreateNimi/CreateNimi.tsx
index 3d1f7bd4..f8e1a10a 100644
--- a/src/components/CreateNimi/CreateNimi.tsx
+++ b/src/components/CreateNimi/CreateNimi.tsx
@@ -22,7 +22,7 @@ import { useSignMessage } from 'wagmi';
import { usePublishNimiIPNS, useUpdateNimiIPNS } from '../../api/RestAPI/hooks/usePublishNimiIPNS';
import { useUploadImageToIPFS } from '../../api/RestAPI/hooks/useUploadImageToIPFS';
-import PlaceholderMini from '../../assets/images/nimi-placeholder.png';
+import nimiPlaceholderImage from '../../assets/images/nimi-placeholder.png';
// Partials
import { supportedImageTypes } from '../../constants';
import { useENSPublicResolverContract } from '../../hooks/useENSPublicResolverContract';
@@ -78,13 +78,7 @@ import { themes } from './themes';
export interface CreateNimiProps {
ensAddress: string;
ensName: string;
- /**
- * Available themes for the user to choose from
- */
availableThemes: NimiCuratedTheme[];
- /**
- * The initial Nimi to edit
- */
initialNimi: Nimi;
nimiIPNSKey?: string;
}
@@ -188,7 +182,7 @@ export function CreateNimi({ ensAddress, ensName, availableThemes, initialNimi,
chainId: 1, // always mainnet
signature,
});
- if (!updateNimiResponse || !updateNimiResponse.cidV1) {
+ if (!updateNimiResponse || !updateNimiResponse.cid) {
throw new Error('No response from updateNimiAsync');
}
@@ -198,12 +192,13 @@ export function CreateNimi({ ensAddress, ensName, availableThemes, initialNimi,
}
// Publishing a new Nimi IPNS record
- const { cidV1, ipns } = await publishNimiAsync({
+ const { cid, ipns } = await publishNimiAsync({
nimi,
- chainId: 1, // always mainnet
+ chainId: chainId as number,
});
if (!cidV1) {
+ if (!cid) {
throw new Error('No CID returned from publishNimiViaIPNS');
}
@@ -222,7 +217,7 @@ export function CreateNimi({ ensAddress, ensName, availableThemes, initialNimi,
}
// Set the content
- setPublishNimiResponseIpfsHash(cidV1);
+ setPublishNimiResponseIpfsHash(cid);
const setContentHashTransaction = await setENSNameContentHash({
contract: publicResolverContract,
name: nimi.ensName,
@@ -336,7 +331,11 @@ export function CreateNimi({ ensAddress, ensName, availableThemes, initialNimi,
Profile Picture
{imgErrorMessage && {imgErrorMessage}}
@@ -565,10 +564,10 @@ export function CreateNimi({ ensAddress, ensName, availableThemes, initialNimi,
if (nftAsset) {
setValue('image', {
type: NimiImageType.ERC721,
- contract: nftAsset.assetContract.address,
- tokenId: nftAsset.tokenId as any,
- tokenUri: nftAsset.externalLink,
- url: nftAsset.imageUrl,
+ contract: nftAsset.asset_contract.address,
+ tokenId: nftAsset.token_id as any,
+ tokenUri: nftAsset.external_link,
+ url: nftAsset.image_url,
});
}
diff --git a/src/hooks/useDefaultNimiData.ts b/src/hooks/useDefaultNimiData.ts
index 7ac46a6a..de0f1879 100644
--- a/src/hooks/useDefaultNimiData.ts
+++ b/src/hooks/useDefaultNimiData.ts
@@ -68,7 +68,7 @@ export function useInitialtNimiData({ ensName, account }: InitialNimiDataProps):
ensName,
]);
- debug({ NimiObject: nimiObject });
+ debug({ nimiObject });
return {
loading: isDepoyedLoading || isGeneratedFetching,
diff --git a/src/pages/domains/[domain]/index.tsx b/src/pages/domains/[domain]/index.tsx
index b4c542cf..8bae2061 100644
--- a/src/pages/domains/[domain]/index.tsx
+++ b/src/pages/domains/[domain]/index.tsx
@@ -1,26 +1,150 @@
+import { Nimi, POAPToken } from '@nimi.io/card/types';
+import { GetServerSidePropsContext } from 'next';
import Head from 'next/head';
-import { useRouter } from 'next/router';
+import { useState } from 'react';
+import { fetchUserPOAPs } from '../../../api/RestAPI/hooks/usePoapsFromUser';
+import { nimiClient } from '../../../api/RestAPI/utils';
+import { Container } from '../../../components/Container';
+import { CreateNimi } from '../../../components/CreateNimi';
import { CreateNimiContainer } from '../../../components/CreateNimi/CreateNimiContainer';
+import { getAvailableThemesByPOAPs } from '../../../hooks/useAvaliableThemesFromPoaps';
import { PageLayout } from '../../../layout';
+import { insertPoapWidgetIntoNimi } from '../../../utils';
-export default function CreateNimiPage() {
- const router = useRouter();
- const { domain } = router.query;
+interface NimiSnapshot {
+ publisher: string;
+ cid: string | null;
+ nimi: Nimi;
+ createdAt: string;
+ updatedAt: string;
+ id: string;
+}
+
+export async function fetchNimiIPNS(ensName: string) {
+ const url = `http://127.0.0.1:4002/ens/has-nimi-ipns?domain=${ensName}`;
+
+ const rawResponse = await fetch(url, {
+ method: 'GET',
+ }).then();
- // DOn't render anything on server side
- if (typeof window === 'undefined') {
- console.log('Server side rendering');
- return null;
+ if (!rawResponse.ok) {
+ throw new Error('Network response was not ok');
}
+ const data = (await rawResponse.json()) as {
+ data: {
+ ipns?: string;
+ nimi?: NimiSnapshot;
+ };
+ };
+
+ return data.data;
+}
+
+export async function generateNimiFromENS(ensName: string) {
+ const { data } = await nimiClient.get<{
+ data: {
+ nimi: Nimi;
+ };
+ }>(`/nimi/generate`, {
+ params: {
+ domain: ensName,
+ },
+ });
+
+ return data.data;
+}
+
+interface CreateNimiPageProps {
+ availableThemes: ReturnType;
+ domain: string;
+ ipnsKey?: string;
+ nimiSnapshot?: NimiSnapshot;
+ initialNimi: Nimi;
+ poapList: POAPToken[];
+}
+
+// This is the page that will be server side rendered
+export async function getServerSideProps(
+ context: GetServerSidePropsContext<{
+ domain: string;
+ }>
+): Promise<{
+ props: CreateNimiPageProps;
+}> {
+ let props = {
+ availableThemes: [],
+ domain: context?.params?.domain,
+ initialNimi: {} as Nimi,
+ poapList: [],
+ } as CreateNimiPageProps;
+
+ try {
+ if (!context?.params?.domain || context?.params?.domain === '[object Object]') {
+ throw new Error('No domain provided');
+ }
+
+ const domain = context.params.domain;
+ // Nimi Snapshot from the API
+ const nimiIPNSSnapshot = await fetchNimiIPNS(domain);
+ // If the user has a Nimi IPNS, redirect to the Nimi page
+ if (nimiIPNSSnapshot.ipns && nimiIPNSSnapshot.nimi) {
+ props = {
+ ...props,
+ ipnsKey: nimiIPNSSnapshot.ipns,
+ nimiSnapshot: nimiIPNSSnapshot.nimi,
+ initialNimi: nimiIPNSSnapshot.nimi.nimi,
+ };
+ } else {
+ const { nimi } = await generateNimiFromENS(domain);
+ props['initialNimi'] = nimi;
+ }
+
+ if (!props.initialNimi) {
+ throw new Error('No Nimi found');
+ }
+
+ // Attempt to load
+ const poapList = await fetchUserPOAPs(props.initialNimi.ensAddress as string);
+ const availableThemes = getAvailableThemesByPOAPs(poapList);
+
+ if (poapList) {
+ props = {
+ ...props,
+ poapList,
+ availableThemes,
+ };
+ }
+ } catch (e) {
+ console.log(e);
+ }
+ // If the user doesn't have a Nimi IPNS, generate a Nimi from the ENS name
+ return { props };
+}
+
+export default function CreateNimiPage({
+ domain,
+ ipnsKey,
+ initialNimi,
+ poapList,
+ availableThemes,
+}: Awaited>['props']) {
return (
<>
Create Nimi for {domain}
-
+
+ 0, initialNimi?.ensAddress)}
+ nimiIPNSKey={ipnsKey}
+ />
+
>
);