Skip to content

Commit 49c56e7

Browse files
phklivephklive
committedMar 2, 2023
fixed compile + stringService naming + Formatting + Type
1 parent 8301321 commit 49c56e7

29 files changed

+821
-720
lines changed
 

‎.github/ISSUE_TEMPLATE/bug_report.md

+13-11
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
11
---
22
name: Bug report
33
about: Create a report to help us improve
4-
title: ''
5-
labels: 'Type: bug'
6-
assignees: ''
7-
4+
title: ""
5+
labels: "Type: bug"
6+
assignees: ""
87
---
98

109
**Describe the bug**
1110
A clear and concise description of what the bug is.
1211

1312
**To Reproduce**
1413
Steps to reproduce the behavior:
14+
1515
1. Go to '...'
1616
2. Click on '....'
1717
3. Scroll down to '....'
@@ -24,15 +24,17 @@ A clear and concise description of what you expected to happen.
2424
If applicable, add screenshots to help explain your problem.
2525

2626
**Desktop (please complete the following information):**
27-
- OS: [e.g. iOS]
28-
- Browser [e.g. chrome, safari]
29-
- Version [e.g. 22]
27+
28+
- OS: [e.g. iOS]
29+
- Browser [e.g. chrome, safari]
30+
- Version [e.g. 22]
3031

3132
**Smartphone (please complete the following information):**
32-
- Device: [e.g. iPhone6]
33-
- OS: [e.g. iOS8.1]
34-
- Browser [e.g. stock browser, safari]
35-
- Version [e.g. 22]
33+
34+
- Device: [e.g. iPhone6]
35+
- OS: [e.g. iOS8.1]
36+
- Browser [e.g. stock browser, safari]
37+
- Version [e.g. 22]
3638

3739
**Additional context**
3840
Add any other context about the problem here.

‎.github/ISSUE_TEMPLATE/feature_request.md

+3-4
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
11
---
22
name: Feature request
33
about: Suggest an idea for this project
4-
title: ''
5-
labels: 'open for contribution, Type: feature'
6-
assignees: ''
7-
4+
title: ""
5+
labels: "open for contribution, Type: feature"
6+
assignees: ""
87
---
98

109
**Is your feature request related to a problem? Please describe.**

‎abi/L1/L1Buying_abi.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -86,4 +86,4 @@
8686
"stateMutability": "payable",
8787
"type": "function"
8888
}
89-
]
89+
]

‎components/UI/footer.tsx

+13-13
Original file line numberDiff line numberDiff line change
@@ -2,19 +2,19 @@ import React, { FunctionComponent } from "react";
22
import styles from "../styles/components/footer.module.css";
33

44
const Footer: FunctionComponent = () => {
5-
return (
6-
<div className="relative">
7-
<div className={styles.fifthLeaf}>
8-
<img width={"100%"} alt="leaf" src="/leaves/leaf_3.png" />
9-
</div>
10-
<div className={styles.sixthLeaf}>
11-
<img width={"100%"} alt="leaf" src="/leaves/leaf_1.png" />
12-
</div>
13-
<footer className={styles.footer}>
14-
Powered by&nbsp;<strong>Starknet</strong>
15-
</footer>
16-
</div>
17-
);
5+
return (
6+
<div className="relative">
7+
<div className={styles.fifthLeaf}>
8+
<img width={"100%"} alt="leaf" src="/leaves/leaf_3.png" />
9+
</div>
10+
<div className={styles.sixthLeaf}>
11+
<img width={"100%"} alt="leaf" src="/leaves/leaf_1.png" />
12+
</div>
13+
<footer className={styles.footer}>
14+
Powered by&nbsp;<strong>Starknet</strong>
15+
</footer>
16+
</div>
17+
);
1818
};
1919

2020
export default Footer;

‎components/UI/iconsComponents/clickableAction.tsx

+20-23
Original file line numberDiff line numberDiff line change
@@ -9,33 +9,30 @@ import AspectIcon from "./icons/aspectIcon";
99
import MainIcon from "./icons/mainIcon";
1010

1111
type ClickacbleActionProps = {
12-
icon: string;
13-
onClick?: () => void;
14-
title?: string;
12+
icon: string;
13+
onClick?: () => void;
14+
title?: string;
1515
};
1616

1717
const ClickacbleAction: FunctionComponent<ClickacbleActionProps> = ({
18-
icon,
19-
onClick,
20-
title,
18+
icon,
19+
onClick,
20+
title,
2121
}) => {
22-
return (
23-
<div className={styles.clickableAction} onClick={onClick}>
24-
{icon === "change" && <ChangeIcon width="40" color="#402D28" />}
25-
{icon === "mintsquare" && (
26-
<MintsquareIcon width="40" color="#402D28" />
27-
)}
28-
{icon === "main" && (
29-
<MainIcon width="40" firstColor="#402d28" secondColor="#402d28" />
30-
)}
31-
{icon === "aspect" && <AspectIcon width="40" color="#402D28" />}
32-
{icon === "transfer" && <TransferIcon width="40" color="#402D28" />}
33-
{icon === "plus" && <PlusIcon width="40" color="#402D28" />}
34-
{icon === "address" && <AddressIcon width="40" color="#402D28" />}
35-
<h1 className={styles.clickableActionText}>{title}</h1>
36-
</div>
37-
)
38-
22+
return (
23+
<div className={styles.clickableAction} onClick={onClick}>
24+
{icon === "change" && <ChangeIcon width="40" color="#402D28" />}
25+
{icon === "mintsquare" && <MintsquareIcon width="40" color="#402D28" />}
26+
{icon === "main" && (
27+
<MainIcon width="40" firstColor="#402d28" secondColor="#402d28" />
28+
)}
29+
{icon === "aspect" && <AspectIcon width="40" color="#402D28" />}
30+
{icon === "transfer" && <TransferIcon width="40" color="#402D28" />}
31+
{icon === "plus" && <PlusIcon width="40" color="#402D28" />}
32+
{icon === "address" && <AddressIcon width="40" color="#402D28" />}
33+
<h1 className={styles.clickableActionText}>{title}</h1>
34+
</div>
35+
);
3936
};
4037

4138
export default ClickacbleAction;

‎components/UI/iconsComponents/clickableIcon.tsx

+28-28
Original file line numberDiff line numberDiff line change
@@ -13,38 +13,38 @@ import AspectIcon from "./icons/aspectIcon";
1313
import { Tooltip } from "@mui/material";
1414

1515
type ClickableIconProps = {
16-
icon: string;
17-
onClick?: () => void;
18-
title?: string;
16+
icon: string;
17+
onClick?: () => void;
18+
title?: string;
1919
};
2020

2121
const ClickableIcon: FunctionComponent<ClickableIconProps> = ({
22-
icon,
23-
onClick,
24-
title = "",
22+
icon,
23+
onClick,
24+
title = "",
2525
}) => {
26-
return (
27-
<Tooltip title={title} arrow>
28-
<div>
29-
<div className={styles.clickableIcon} onClick={onClick}>
30-
{icon === "twitter" && <TwitterIcon width="20" color="#402D28" />}
31-
{icon === "discord" && <DiscordIcon width="20" color="#402D28" />}
32-
{icon === "github" && <GithubIcon width="20" color="#402D28" />}
33-
{icon === "main" && (
34-
<MainIcon width="40" firstColor="#402d28" secondColor="#402d28" />
35-
)}
36-
{icon === "change" && <ChangeIcon width="40" color="#402D28" />}
37-
{icon === "mintsquare" && (
38-
<MintsquareIcon width="40" color="#402D28" />
39-
)}
40-
{icon === "aspect" && <AspectIcon width="40" color="#402D28" />}
41-
{icon === "transfer" && <TransferIcon width="40" color="#402D28" />}
42-
{icon === "plus" && <PlusIcon width="40" color="#402D28" />}
43-
{icon === "address" && <AddressIcon width="40" color="#402D28" />}
44-
</div>
45-
</div>
46-
</Tooltip>
47-
);
26+
return (
27+
<Tooltip title={title} arrow>
28+
<div>
29+
<div className={styles.clickableIcon} onClick={onClick}>
30+
{icon === "twitter" && <TwitterIcon width="20" color="#402D28" />}
31+
{icon === "discord" && <DiscordIcon width="20" color="#402D28" />}
32+
{icon === "github" && <GithubIcon width="20" color="#402D28" />}
33+
{icon === "main" && (
34+
<MainIcon width="40" firstColor="#402d28" secondColor="#402d28" />
35+
)}
36+
{icon === "change" && <ChangeIcon width="40" color="#402D28" />}
37+
{icon === "mintsquare" && (
38+
<MintsquareIcon width="40" color="#402D28" />
39+
)}
40+
{icon === "aspect" && <AspectIcon width="40" color="#402D28" />}
41+
{icon === "transfer" && <TransferIcon width="40" color="#402D28" />}
42+
{icon === "plus" && <PlusIcon width="40" color="#402D28" />}
43+
{icon === "address" && <AddressIcon width="40" color="#402D28" />}
44+
</div>
45+
</div>
46+
</Tooltip>
47+
);
4848
};
4949

5050
export default ClickableIcon;

‎components/UI/identitiesActionsSkeleton.tsx

+8-9
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,15 @@ import { Skeleton } from "@mui/material";
22
import React, { FunctionComponent } from "react";
33
import styles from "../../styles/components/identitiesV1.module.css";
44

5-
65
const identitiesActionsSkeleton: FunctionComponent = () => {
7-
return (
8-
<div className={styles.identitiesActionsSkeletonButtons}>
9-
<Skeleton variant="rounded" width={300} height={50} />
10-
<Skeleton variant="rounded" width={300} height={50} />
11-
<Skeleton variant="rounded" width={300} height={50} />
12-
<Skeleton variant="rounded" width={300} height={50} />
13-
</div>
14-
)
6+
return (
7+
<div className={styles.identitiesActionsSkeletonButtons}>
8+
<Skeleton variant="rounded" width={300} height={50} />
9+
<Skeleton variant="rounded" width={300} height={50} />
10+
<Skeleton variant="rounded" width={300} height={50} />
11+
<Skeleton variant="rounded" width={300} height={50} />
12+
</div>
13+
);
1514
};
1615

1716
export default identitiesActionsSkeleton;

‎components/UI/identitiesSkeleton.tsx

+6-7
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,14 @@ import { Skeleton } from "@mui/material";
22
import React, { FunctionComponent } from "react";
33
import styles from "../../styles/components/identitiesV1.module.css";
44

5-
65
const identitiesSkeleton: FunctionComponent = () => {
76
return (
8-
<div className={styles.identitiesSkeleton}>
9-
<Skeleton variant="circular" width={150} height={150} />
10-
<Skeleton variant="circular" width={150} height={150} />
11-
<Skeleton variant="circular" width={150} height={150} />
12-
</div>
13-
)
7+
<div className={styles.identitiesSkeleton}>
8+
<Skeleton variant="circular" width={150} height={150} />
9+
<Skeleton variant="circular" width={150} height={150} />
10+
<Skeleton variant="circular" width={150} height={150} />
11+
</div>
12+
);
1413
};
1514

1615
export default identitiesSkeleton;

‎components/identities/actions/transferFormModal.tsx

+27-18
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { isHexString } from "ethers/lib/utils";
44
import { useRouter } from "next/router";
55
import React, { FunctionComponent, useState } from "react";
66
import styles from "../../../styles/components/wallets.module.css";
7-
import { hexToDecimal } from "../../../utils/feltService";
7+
import { hexToDecimal } from "../../../utils/feltService";
88
import Button from "../../UI/button";
99

1010
type TransferFormModalProps = {
@@ -23,21 +23,27 @@ const TransferFormModal: FunctionComponent<TransferFormModalProps> = ({
2323
const [targetAddress, setTargetAddress] = useState<string>("");
2424
const router = useRouter();
2525
const { address } = useAccount();
26-
const { tokenId } = router.query
27-
const numId = parseInt(tokenId as string)
26+
const { tokenId } = router.query;
27+
const numId = parseInt(tokenId as string);
2828

2929
//set_domain_to_address execute
3030
const transfer_identity_and_set_domain_multicall = [
31-
{
32-
contractAddress: process.env.NEXT_PUBLIC_NAMING_CONTRACT as string,
33-
entrypoint: "set_domain_to_address",
34-
calldata: [...callDataEncodedDomain, hexToDecimal(targetAddress ?? "")],
35-
},
36-
{
37-
contractAddress: process.env.NEXT_PUBLIC_STARKNETID_CONTRACT as string,
38-
entrypoint: "transferFrom",
39-
calldata: [hexToDecimal(address ?? ""), hexToDecimal(targetAddress ?? ""), numId, 0]
40-
}];
31+
{
32+
contractAddress: process.env.NEXT_PUBLIC_NAMING_CONTRACT as string,
33+
entrypoint: "set_domain_to_address",
34+
calldata: [...callDataEncodedDomain, hexToDecimal(targetAddress ?? "")],
35+
},
36+
{
37+
contractAddress: process.env.NEXT_PUBLIC_STARKNETID_CONTRACT as string,
38+
entrypoint: "transferFrom",
39+
calldata: [
40+
hexToDecimal(address ?? ""),
41+
hexToDecimal(targetAddress ?? ""),
42+
numId,
43+
0,
44+
],
45+
},
46+
];
4147

4248
const { execute: transfer_identity_and_set_domain } = useStarknetExecute({
4349
calls: transfer_identity_and_set_domain_multicall,
@@ -75,9 +81,9 @@ const TransferFormModal: FunctionComponent<TransferFormModalProps> = ({
7581
</h2>
7682
{address && (
7783
<p className="break-all mt-5">
78-
<strong>Current Address :</strong>&nbsp;
79-
<span>{address}</span>
80-
</p>
84+
<strong>Current Address :</strong>&nbsp;
85+
<span>{address}</span>
86+
</p>
8187
)}
8288
<div className="mt-5 flex flex-col justify-center">
8389
<div className="mt-5">
@@ -94,7 +100,10 @@ const TransferFormModal: FunctionComponent<TransferFormModalProps> = ({
94100
/>
95101
</div>
96102
<div className="mt-5 flex justify-center">
97-
<Button disabled={!targetAddress} onClick={() => transferIdentityAndSetDomain()}>
103+
<Button
104+
disabled={!targetAddress}
105+
onClick={() => transferIdentityAndSetDomain()}
106+
>
98107
Send domain
99108
</Button>
100109
</div>
@@ -104,4 +113,4 @@ const TransferFormModal: FunctionComponent<TransferFormModalProps> = ({
104113
);
105114
};
106115

107-
export default TransferFormModal;
116+
export default TransferFormModal;

‎components/identities/actions/transferIdFormModal.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -81,4 +81,3 @@ const TransferFormModal: FunctionComponent<TransferFormModalProps> = ({
8181
};
8282

8383
export default TransferFormModal;
84-

‎components/identities/identitiesActions.tsx

+175-173
Original file line numberDiff line numberDiff line change
@@ -11,199 +11,201 @@ import { Identity } from "../../types/backTypes";
1111
import { hexToDecimal } from "../../utils/feltService";
1212
import IdentitiesActionsSkeleton from "../UI/identitiesActionsSkeleton";
1313
import ClickacbleAction from "../UI/iconsComponents/clickableAction";
14-
import styles from "../../styles/components/identityMenu.module.css"
14+
import styles from "../../styles/components/identityMenu.module.css";
1515

1616
type IdentityActionsProps = {
17-
identity?: Identity;
18-
tokenId: string;
19-
isIdentityADomain: boolean;
20-
hideActionsHandler: (state: boolean) => void
17+
identity?: Identity;
18+
tokenId: string;
19+
isIdentityADomain: boolean;
20+
hideActionsHandler: (state: boolean) => void;
2121
};
2222

2323
const IdentityActions: FunctionComponent<IdentityActionsProps> = ({
24-
identity,
25-
tokenId,
26-
isIdentityADomain,
27-
hideActionsHandler
24+
identity,
25+
tokenId,
26+
isIdentityADomain,
27+
hideActionsHandler,
2828
}) => {
29-
const [isAddressFormOpen, setIsAddressFormOpen] = useState<boolean>(false);
30-
const [isRenewFormOpen, setIsRenewFormOpen] = useState<boolean>(false);
31-
const [isTransferFormOpen, setIsTransferFormOpen] = useState<boolean>(false);
32-
const [isSubdomainFormOpen, setIsSubdomainFormOpen] =
33-
useState<boolean>(false);
34-
const { address } = useAccount();
35-
const encodedDomains = useEncodedSeveral(
36-
getDomainWithoutStark(identity ? identity.domain : "").split(".") ?? []
37-
);
38-
const isAccountTargetAddress = identity?.addr === hexToDecimal(address);
39-
const [isOwner, setIsOwner] = useState<boolean>(false);
40-
const [loading, setLoading] = useState<boolean>(false)
29+
const [isAddressFormOpen, setIsAddressFormOpen] = useState<boolean>(false);
30+
const [isRenewFormOpen, setIsRenewFormOpen] = useState<boolean>(false);
31+
const [isTransferFormOpen, setIsTransferFormOpen] = useState<boolean>(false);
32+
const [isSubdomainFormOpen, setIsSubdomainFormOpen] =
33+
useState<boolean>(false);
34+
const { address } = useAccount();
35+
const encodedDomains = useEncodedSeveral(
36+
getDomainWithoutStark(identity ? identity.domain : "").split(".") ?? []
37+
);
38+
const isAccountTargetAddress = identity?.addr === hexToDecimal(address);
39+
const [isOwner, setIsOwner] = useState<boolean>(false);
40+
const [loading, setLoading] = useState<boolean>(false);
4141

42-
// Add all subdomains to the parameters
43-
const callDataEncodedDomain: (number | string)[] = [encodedDomains.length];
44-
encodedDomains.forEach((domain) => {
45-
callDataEncodedDomain.push(domain);
46-
});
42+
// Add all subdomains to the parameters
43+
const callDataEncodedDomain: (number | string)[] = [encodedDomains.length];
44+
encodedDomains.forEach((domain) => {
45+
callDataEncodedDomain.push(domain);
46+
});
4747

48-
//Set as main domain execute
49-
const set_address_to_domain_calls = {
50-
contractAddress: process.env.NEXT_PUBLIC_NAMING_CONTRACT as string,
51-
entrypoint: "set_address_to_domain",
52-
calldata: callDataEncodedDomain,
53-
};
54-
const set_domain_to_address_calls = {
55-
contractAddress: process.env.NEXT_PUBLIC_NAMING_CONTRACT as string,
56-
entrypoint: "set_domain_to_address",
57-
calldata: [...callDataEncodedDomain, hexToDecimal(address)],
58-
};
59-
const { execute: set_address_to_domain } = useStarknetExecute({
60-
calls: isAccountTargetAddress
61-
? set_address_to_domain_calls
62-
: [set_domain_to_address_calls, set_address_to_domain_calls],
63-
});
48+
//Set as main domain execute
49+
const set_address_to_domain_calls = {
50+
contractAddress: process.env.NEXT_PUBLIC_NAMING_CONTRACT as string,
51+
entrypoint: "set_address_to_domain",
52+
calldata: callDataEncodedDomain,
53+
};
54+
const set_domain_to_address_calls = {
55+
contractAddress: process.env.NEXT_PUBLIC_NAMING_CONTRACT as string,
56+
entrypoint: "set_domain_to_address",
57+
calldata: [...callDataEncodedDomain, hexToDecimal(address)],
58+
};
59+
const { execute: set_address_to_domain } = useStarknetExecute({
60+
calls: isAccountTargetAddress
61+
? set_address_to_domain_calls
62+
: [set_domain_to_address_calls, set_address_to_domain_calls],
63+
});
6464

65-
function setAddressToDomain(): void {
66-
set_address_to_domain();
67-
}
68-
69-
useEffect(() => {
70-
type fullIds = { id: string; domain: string };
65+
function setAddressToDomain(): void {
66+
set_address_to_domain();
67+
}
7168

72-
function checkIfOwner(fullIds: fullIds[]): boolean {
73-
let isOwner = false;
69+
useEffect(() => {
70+
type fullIds = { id: string; domain: string };
7471

75-
for (let i = 0; i < fullIds.length; i++) {
76-
if (fullIds[i].id === tokenId) {
77-
isOwner = true;
78-
}
79-
}
72+
function checkIfOwner(fullIds: fullIds[]): boolean {
73+
let isOwner = false;
8074

81-
return isOwner;
75+
for (let i = 0; i < fullIds.length; i++) {
76+
if (fullIds[i].id === tokenId) {
77+
isOwner = true;
8278
}
79+
}
8380

84-
if (address && tokenId) {
85-
setLoading(true)
86-
// Our Indexer
87-
fetch(`/api/indexer/addr_to_full_ids?addr=${hexToDecimal(address)}`)
88-
.then((response) => response.json())
89-
.then((data) => {
90-
setIsOwner(checkIfOwner(data.full_ids));
91-
setLoading(false)
92-
});
93-
}
94-
}, [address, tokenId]);
81+
return isOwner;
82+
}
9583

96-
if (!isIdentityADomain) {
97-
hideActionsHandler(true)
98-
} else {
99-
hideActionsHandler(false)
84+
if (address && tokenId) {
85+
setLoading(true);
86+
// Our Indexer
87+
fetch(`/api/indexer/addr_to_full_ids?addr=${hexToDecimal(address)}`)
88+
.then((response) => response.json())
89+
.then((data) => {
90+
setIsOwner(checkIfOwner(data.full_ids));
91+
setLoading(false);
92+
});
10093
}
94+
}, [address, tokenId]);
10195

102-
return (
103-
<div className={styles.actionsContainer}>
104-
{loading ? <IdentitiesActionsSkeleton /> :
105-
<>
106-
<div className="flex flex-col items-center justify-center">
107-
{identity && !isOwner && isIdentityADomain && (
108-
<>
109-
<div className="m-2">
110-
<ClickacbleAction
111-
title="View on Mintsquare"
112-
icon="mintsquare"
113-
onClick={() =>
114-
window.open(
115-
`https://mintsquare.io/asset/starknet/${process.env.NEXT_PUBLIC_STARKNETID_CONTRACT}/${tokenId}`
116-
)
117-
}
118-
/>
119-
</div>
120-
<div className="m-2">
121-
<ClickacbleAction
122-
title="View on Aspect"
123-
icon="aspect"
124-
onClick={() =>
125-
window.open(
126-
`https://aspect.co/asset/${process.env.NEXT_PUBLIC_STARKNETID_CONTRACT}/${tokenId}`
127-
)
128-
}
129-
/>
130-
</div>
131-
</>
132-
)}
133-
{identity && isOwner && (
134-
<>
135-
{callDataEncodedDomain[0] === 1 ? (
136-
<div className="m-2">
137-
<ClickacbleAction
138-
title="RENEW YOUR IDENTITY"
139-
icon="change"
140-
onClick={() => setIsRenewFormOpen(true)}
141-
/>
142-
</div>
143-
) : null}
144-
<div className="m-2">
145-
<ClickacbleAction
146-
title="CHANGE THE TARGET"
147-
icon="address"
148-
onClick={() => setIsAddressFormOpen(true)}
149-
/>
150-
</div>
151-
<div className="m-2">
152-
<ClickacbleAction
153-
title="MOVE YOUR IDENTITY"
154-
icon="transfer"
155-
onClick={() => setIsTransferFormOpen(true)}
156-
/>
157-
</div>
158-
<div className="m-2">
159-
<ClickacbleAction
160-
title="CREATE A SUBDOMAIN"
161-
icon="plus"
162-
onClick={() => setIsSubdomainFormOpen(true)}
163-
/>
164-
</div>
165-
{!identity.is_owner_main && (
166-
<div className="m-2">
167-
<ClickacbleAction
168-
title="Set as main domain"
169-
icon="main"
170-
onClick={() => setAddressToDomain()}
171-
/>
172-
</div>
173-
)}
174-
</>
175-
)}
176-
</div>
96+
if (!isIdentityADomain) {
97+
hideActionsHandler(true);
98+
} else {
99+
hideActionsHandler(false);
100+
}
177101

178-
<RenewalModal
179-
handleClose={() => setIsRenewFormOpen(false)}
180-
isModalOpen={isRenewFormOpen}
181-
callDataEncodedDomain={callDataEncodedDomain}
182-
identity={identity}
102+
return (
103+
<div className={styles.actionsContainer}>
104+
{loading ? (
105+
<IdentitiesActionsSkeleton />
106+
) : (
107+
<>
108+
<div className="flex flex-col items-center justify-center">
109+
{identity && !isOwner && isIdentityADomain && (
110+
<>
111+
<div className="m-2">
112+
<ClickacbleAction
113+
title="View on Mintsquare"
114+
icon="mintsquare"
115+
onClick={() =>
116+
window.open(
117+
`https://mintsquare.io/asset/starknet/${process.env.NEXT_PUBLIC_STARKNETID_CONTRACT}/${tokenId}`
118+
)
119+
}
120+
/>
121+
</div>
122+
<div className="m-2">
123+
<ClickacbleAction
124+
title="View on Aspect"
125+
icon="aspect"
126+
onClick={() =>
127+
window.open(
128+
`https://aspect.co/asset/${process.env.NEXT_PUBLIC_STARKNETID_CONTRACT}/${tokenId}`
129+
)
130+
}
131+
/>
132+
</div>
133+
</>
134+
)}
135+
{identity && isOwner && (
136+
<>
137+
{callDataEncodedDomain[0] === 1 ? (
138+
<div className="m-2">
139+
<ClickacbleAction
140+
title="RENEW YOUR IDENTITY"
141+
icon="change"
142+
onClick={() => setIsRenewFormOpen(true)}
183143
/>
184-
<ChangeAddressModal
185-
handleClose={() => setIsAddressFormOpen(false)}
186-
isModalOpen={isAddressFormOpen}
187-
callDataEncodedDomain={callDataEncodedDomain}
188-
domain={identity?.domain}
189-
currentTargetAddress={identity?.addr}
144+
</div>
145+
) : null}
146+
<div className="m-2">
147+
<ClickacbleAction
148+
title="CHANGE THE TARGET"
149+
icon="address"
150+
onClick={() => setIsAddressFormOpen(true)}
151+
/>
152+
</div>
153+
<div className="m-2">
154+
<ClickacbleAction
155+
title="MOVE YOUR IDENTITY"
156+
icon="transfer"
157+
onClick={() => setIsTransferFormOpen(true)}
158+
/>
159+
</div>
160+
<div className="m-2">
161+
<ClickacbleAction
162+
title="CREATE A SUBDOMAIN"
163+
icon="plus"
164+
onClick={() => setIsSubdomainFormOpen(true)}
165+
/>
166+
</div>
167+
{!identity.is_owner_main && (
168+
<div className="m-2">
169+
<ClickacbleAction
170+
title="Set as main domain"
171+
icon="main"
172+
onClick={() => setAddressToDomain()}
190173
/>
191-
<TransferFormModal
192-
handleClose={() => setIsTransferFormOpen(false)}
193-
isModalOpen={isTransferFormOpen}
194-
callDataEncodedDomain={callDataEncodedDomain}
195-
domain={identity?.domain}
196-
/>
197-
<SubdomainModal
198-
handleClose={() => setIsSubdomainFormOpen(false)}
199-
isModalOpen={isSubdomainFormOpen}
200-
callDataEncodedDomain={callDataEncodedDomain}
201-
domain={identity?.domain}
202-
/>
203-
</>
204-
}
205-
</div>
206-
);
174+
</div>
175+
)}
176+
</>
177+
)}
178+
</div>
179+
180+
<RenewalModal
181+
handleClose={() => setIsRenewFormOpen(false)}
182+
isModalOpen={isRenewFormOpen}
183+
callDataEncodedDomain={callDataEncodedDomain}
184+
identity={identity}
185+
/>
186+
<ChangeAddressModal
187+
handleClose={() => setIsAddressFormOpen(false)}
188+
isModalOpen={isAddressFormOpen}
189+
callDataEncodedDomain={callDataEncodedDomain}
190+
domain={identity?.domain}
191+
currentTargetAddress={identity?.addr}
192+
/>
193+
<TransferFormModal
194+
handleClose={() => setIsTransferFormOpen(false)}
195+
isModalOpen={isTransferFormOpen}
196+
callDataEncodedDomain={callDataEncodedDomain}
197+
domain={identity?.domain}
198+
/>
199+
<SubdomainModal
200+
handleClose={() => setIsSubdomainFormOpen(false)}
201+
isModalOpen={isSubdomainFormOpen}
202+
callDataEncodedDomain={callDataEncodedDomain}
203+
domain={identity?.domain}
204+
/>
205+
</>
206+
)}
207+
</div>
208+
);
207209
};
208210

209211
export default IdentityActions;

‎components/identities/identityCard.tsx

+48-41
Original file line numberDiff line numberDiff line change
@@ -1,49 +1,56 @@
11
import React, { FunctionComponent } from "react";
2-
import styles from "../../styles/components/identityCard.module.css"
2+
import styles from "../../styles/components/identityCard.module.css";
33
import { Identity } from "../../types/backTypes";
4-
import { responsiveDomain } from "../../utils/stringService";
4+
import { shortenDomain } from "../../utils/stringService";
55
import MainIcon from "../UI/iconsComponents/icons/mainIcon";
66
import SocialMediaActions from "./actions/socialmediaActions";
77

8-
interface identityCardProps {
9-
identity?: Identity
10-
domain?: string
11-
tokenId: string
12-
}
8+
type IdentityCardProps = {
9+
identity?: Identity;
10+
domain?: string;
11+
tokenId: string;
12+
};
1313

14-
const IdentityCard: FunctionComponent<identityCardProps> = ({ tokenId, domain, identity }) => {
14+
const IdentityCard: FunctionComponent<IdentityCardProps> = ({
15+
tokenId,
16+
domain,
17+
identity,
18+
}) => {
19+
const responsiveDomain = shortenDomain(domain as string);
1520

16-
const responsivedDomain = responsiveDomain(domain as string)
21+
return (
22+
<div className={styles.container}>
23+
<div className="m-2 flex flex-row items-center justify-between gap-5 my-2 flex-wrap">
24+
<h1 className={styles.domain}>{responsiveDomain}</h1>
25+
{identity && identity.is_owner_main && (
26+
<MainIcon width="40" firstColor="#19aa6e" secondColor="#19aa6e" />
27+
)}
28+
</div>
29+
<div className="my-2">
30+
<img
31+
src={`https://www.starknet.id/api/identicons/${tokenId}`}
32+
height={170}
33+
width={170}
34+
alt="identicon"
35+
/>
36+
</div>
37+
<SocialMediaActions
38+
domain={identity?.domain}
39+
isOwner={true}
40+
tokenId={tokenId}
41+
/>
42+
<img
43+
alt="leaf"
44+
src="/leaves/identityCardLeaves/PNG/lg1.png"
45+
className={styles.lg1}
46+
/>
47+
<img
48+
alt="leaf"
49+
src="/leaves/identityCardLeaves/PNG/lg2.png"
50+
className={styles.lg2}
51+
/>
52+
</div>
53+
);
54+
};
1755

18-
return (
19-
<div className={styles.container}>
20-
<div className="m-2 flex flex-row items-center justify-between gap-5 my-2 flex-wrap">
21-
<h1 className={styles.domain}>{responsivedDomain}</h1>
22-
{identity && identity.is_owner_main &&
23-
<MainIcon
24-
width="40"
25-
firstColor="#19aa6e"
26-
secondColor="#19aa6e"
27-
/>
28-
}
29-
</div>
30-
<div className="my-2">
31-
<img
32-
src={`https://www.starknet.id/api/identicons/${tokenId}`}
33-
height={170}
34-
width={170}
35-
alt="identicon"
36-
/>
37-
</div>
38-
<SocialMediaActions
39-
domain={identity?.domain}
40-
isOwner={true}
41-
tokenId={tokenId}
42-
/>
43-
<img alt="leaf" src="/leaves/identityCardLeaves/PNG/lg1.png" className={styles.lg1} />
44-
<img alt="leaf" src="/leaves/identityCardLeaves/PNG/lg2.png" className={styles.lg2} />
45-
</div >
46-
)
47-
}
48-
49-
export default IdentityCard
56+
export default IdentityCard;

‎next.config.js

+10-11
Original file line numberDiff line numberDiff line change
@@ -7,27 +7,27 @@ module.exports = {
77
// if the host is `app.acme.com`,
88
// this rewrite will be applied
99
{
10-
source: '/:path*',
10+
source: "/:path*",
1111
has: [
1212
{
13-
type: 'host',
14-
value: 'indexer.starknet.id',
13+
type: "host",
14+
value: "indexer.starknet.id",
1515
},
1616
],
17-
destination: '/api/indexer/:path*',
17+
destination: "/api/indexer/:path*",
1818
},
1919
{
20-
source: '/:path*',
20+
source: "/:path*",
2121
has: [
2222
{
23-
type: 'host',
24-
value: 'goerli.indexer.starknet.id',
23+
type: "host",
24+
value: "goerli.indexer.starknet.id",
2525
},
2626
],
27-
destination: '/api/indexer/:path*',
27+
destination: "/api/indexer/:path*",
2828
},
29-
]
30-
}
29+
],
30+
};
3131
},
3232
reactStrictMode: true,
3333
webpack: (config, { isServer }) => {
@@ -45,4 +45,3 @@ module.exports = {
4545
],
4646
},
4747
};
48-

‎pages/_app.tsx

+4-1
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,10 @@ function MyApp({ Component, pageProps }: AppProps) {
2020
<ThemeProvider theme={theme}>
2121
<Head>
2222
<title>Starknet.id</title>
23-
<meta name="viewport" content="width=device-width, initial-scale=1" />
23+
<meta
24+
name="viewport"
25+
content="width=device-width, initial-scale=1"
26+
/>
2427
</Head>
2528
<Navbar />
2629
<Component {...pageProps} />

‎pages/api/indexer/addr_to_available_ids.ts

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import type { NextApiRequest, NextApiResponse } from "next";
22
import { connectToDatabase } from "../../../lib/mongodb";
3-
import NextCors from 'nextjs-cors';
3+
import NextCors from "nextjs-cors";
44

55
export default async function handler(
66
req: NextApiRequest,
@@ -9,10 +9,10 @@ export default async function handler(
99
}>
1010
) {
1111
await NextCors(req, res, {
12-
methods: ['GET'],
13-
origin: '*',
12+
methods: ["GET"],
13+
origin: "*",
1414
optionsSuccessStatus: 200,
15-
});
15+
});
1616
const {
1717
query: { addr },
1818
} = req;

‎pages/api/indexer/addr_to_domains.ts

+26-17
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,42 @@
11
import type { NextApiRequest, NextApiResponse } from "next";
22
import { connectToDatabase } from "../../../lib/mongodb";
3-
import NextCors from 'nextjs-cors';
3+
import NextCors from "nextjs-cors";
44

55
export default async function handler(
66
req: NextApiRequest,
77
res: NextApiResponse<{
88
domains: Array<string>;
9-
}>) {
9+
}>
10+
) {
1011
await NextCors(req, res, {
11-
methods: ['GET'],
12-
origin: '*',
12+
methods: ["GET"],
13+
origin: "*",
1314
optionsSuccessStatus: 200,
1415
});
15-
const { query: { addr }, } = req;
16+
const {
17+
query: { addr },
18+
} = req;
1619
const _domains: Array<string> = [];
1720
const { db } = await connectToDatabase();
18-
const documents = db.collection("starknet_ids").find({ "owner": addr, "_chain.valid_to": null });
21+
const documents = db
22+
.collection("starknet_ids")
23+
.find({ owner: addr, "_chain.valid_to": null });
1924
const domains = db.collection("domains");
2025
for (const doc of await documents.toArray()) {
2126
const tokenId: string = doc.token_id;
22-
await domains.findOne({
23-
"token_id": tokenId,
24-
"_chain.valid_to": null,
25-
}).then((domainDoc) => {
26-
if (domainDoc) {
27-
_domains.push(domainDoc.domain);
28-
}
29-
});
27+
await domains
28+
.findOne({
29+
token_id: tokenId,
30+
"_chain.valid_to": null,
31+
})
32+
.then((domainDoc) => {
33+
if (domainDoc) {
34+
_domains.push(domainDoc.domain);
35+
}
36+
});
3037
}
31-
res.setHeader("cache-control", "max-age=30").status(200).json({ domains: _domains })
32-
33-
}
38+
res
39+
.setHeader("cache-control", "max-age=30")
40+
.status(200)
41+
.json({ domains: _domains });
42+
}

‎pages/api/indexer/addr_to_full_ids.ts

+32-23
Original file line numberDiff line numberDiff line change
@@ -1,40 +1,49 @@
11
import type { NextApiRequest, NextApiResponse } from "next";
22
import { connectToDatabase } from "../../../lib/mongodb";
3-
import NextCors from 'nextjs-cors';
3+
import NextCors from "nextjs-cors";
44

55
type FullId = {
6-
id: string,
7-
domain?: string,
6+
id: string;
7+
domain?: string;
88
};
99

1010
export default async function handler(
1111
req: NextApiRequest,
1212
res: NextApiResponse<{
1313
full_ids: Array<FullId>;
14-
}>) {
15-
await NextCors(req, res, {
16-
methods: ['GET'],
17-
origin: '*',
18-
optionsSuccessStatus: 200,
14+
}>
15+
) {
16+
await NextCors(req, res, {
17+
methods: ["GET"],
18+
origin: "*",
19+
optionsSuccessStatus: 200,
1920
});
20-
const { query: { addr }, } = req;
21+
const {
22+
query: { addr },
23+
} = req;
2124
const full_ids: Array<FullId> = [];
2225
const { db } = await connectToDatabase();
23-
const documents = db.collection("starknet_ids").find({ "owner": addr, "_chain.valid_to": null });
26+
const documents = db
27+
.collection("starknet_ids")
28+
.find({ owner: addr, "_chain.valid_to": null });
2429
const domains = db.collection("domains");
2530
for (const doc of await documents.toArray()) {
2631
const tokenId: string = doc.token_id;
27-
await domains.findOne({
28-
"token_id": tokenId,
29-
"_chain.valid_to": null,
30-
}).then((domainDoc) => {
31-
if (domainDoc) {
32-
full_ids.push({ id: tokenId, domain: domainDoc.domain });
33-
} else {
34-
full_ids.push({ id: tokenId });
35-
}
36-
});
32+
await domains
33+
.findOne({
34+
token_id: tokenId,
35+
"_chain.valid_to": null,
36+
})
37+
.then((domainDoc) => {
38+
if (domainDoc) {
39+
full_ids.push({ id: tokenId, domain: domainDoc.domain });
40+
} else {
41+
full_ids.push({ id: tokenId });
42+
}
43+
});
3744
}
38-
res.setHeader("cache-control", "max-age=30").status(200).json({ full_ids: full_ids })
39-
40-
}
45+
res
46+
.setHeader("cache-control", "max-age=30")
47+
.status(200)
48+
.json({ full_ids: full_ids });
49+
}

‎pages/api/indexer/addr_to_token_id.ts

+27-27
Original file line numberDiff line numberDiff line change
@@ -6,33 +6,33 @@ import { QueryError } from "../../../types/backTypes";
66
type AddrToDomainData = { token_id: string };
77

88
export default async function handler(
9-
req: NextApiRequest,
10-
res: NextApiResponse<AddrToDomainData | QueryError>
9+
req: NextApiRequest,
10+
res: NextApiResponse<AddrToDomainData | QueryError>
1111
) {
12-
await NextCors(req, res, {
13-
methods: ["GET"],
14-
origin: "*",
15-
optionsSuccessStatus: 200,
12+
await NextCors(req, res, {
13+
methods: ["GET"],
14+
origin: "*",
15+
optionsSuccessStatus: 200,
16+
});
17+
const {
18+
query: { addr },
19+
} = req;
20+
const { db } = await connectToDatabase();
21+
await db
22+
.collection("domains")
23+
.findOne({
24+
addr: addr,
25+
rev_addr: addr,
26+
"_chain.valid_to": null,
27+
})
28+
.then((domainDoc) => {
29+
res
30+
.setHeader("cache-control", "max-age=30")
31+
.status(200)
32+
.json(
33+
domainDoc
34+
? { token_id: domainDoc.token_id }
35+
: { error: "no main domain found for this address" }
36+
);
1637
});
17-
const {
18-
query: { addr },
19-
} = req;
20-
const { db } = await connectToDatabase();
21-
await db
22-
.collection("domains")
23-
.findOne({
24-
addr: addr,
25-
rev_addr: addr,
26-
"_chain.valid_to": null,
27-
})
28-
.then((domainDoc) => {
29-
res
30-
.setHeader("cache-control", "max-age=30")
31-
.status(200)
32-
.json(
33-
domainDoc
34-
? { token_id: domainDoc.token_id }
35-
: { error: "no main domain found for this address" }
36-
);
37-
});
3838
}

‎pages/api/indexer/data_to_ids.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,8 @@ export default async function handler(
2121
} = req;
2222
const { db } = await connectToDatabase();
2323

24-
await db.collection("starknet_ids_data")
24+
await db
25+
.collection("starknet_ids_data")
2526
.findOne({ verifier, field, data, "_chain.valid_to": null })
2627
.then((doc) => {
2728
if (doc) {
@@ -36,5 +37,4 @@ export default async function handler(
3637
.json({ error: "no tokenid associated to this data was found" });
3738
}
3839
});
39-
4040
}

‎pages/api/indexer/id_to_infts.ts

+3-6
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,8 @@ import NextCors from "nextjs-cors";
44
import { QueryError } from "../../../types/backTypes";
55

66
type IdentityNFT = {
7-
contract: string,
8-
inft_id: string,
7+
contract: string;
8+
inft_id: string;
99
};
1010

1111
export default async function handler(
@@ -29,8 +29,5 @@ export default async function handler(
2929
output.push({ contract: doc.contract, inft_id: doc.inft_id });
3030
});
3131

32-
res
33-
.setHeader("cache-control", "max-age=30")
34-
.status(200)
35-
.json(output);
32+
res.setHeader("cache-control", "max-age=30").status(200).json(output);
3633
}

‎pages/api/indexer/stats/expired_club_domains.ts

+81-67
Original file line numberDiff line numberDiff line change
@@ -20,85 +20,99 @@ export default async function handler(
2020
await domainCollection
2121
.aggregate([
2222
{
23-
'$match': {
24-
'_chain.valid_to': null,
25-
'expiry': {
26-
'$lte': current
27-
}
28-
}
29-
}, {
30-
'$project': {
31-
'domain': '$domain',
32-
'club': {
33-
'$cond': [
23+
$match: {
24+
"_chain.valid_to": null,
25+
expiry: {
26+
$lte: current,
27+
},
28+
},
29+
},
30+
{
31+
$project: {
32+
domain: "$domain",
33+
club: {
34+
$cond: [
35+
{
36+
$regexMatch: {
37+
input: "$domain",
38+
regex: /^.\.stark$/,
39+
},
40+
},
41+
"single_letter",
3442
{
35-
'$regexMatch': {
36-
'input': '$domain',
37-
'regex': /^.\.stark$/
38-
}
39-
}, 'single_letter', {
40-
'$cond': [
43+
$cond: [
4144
{
42-
'$regexMatch': {
43-
'input': '$domain',
44-
'regex': /^\d{2}\.stark$/
45-
}
46-
}, '99', {
47-
'$cond': [
45+
$regexMatch: {
46+
input: "$domain",
47+
regex: /^\d{2}\.stark$/,
48+
},
49+
},
50+
"99",
51+
{
52+
$cond: [
53+
{
54+
$regexMatch: {
55+
input: "$domain",
56+
regex: /^.{2}\.stark$/,
57+
},
58+
},
59+
"two_letters",
4860
{
49-
'$regexMatch': {
50-
'input': '$domain',
51-
'regex': /^.{2}\.stark$/
52-
}
53-
}, 'two_letters', {
54-
'$cond': [
61+
$cond: [
5562
{
56-
'$regexMatch': {
57-
'input': '$domain',
58-
'regex': /^\d{3}\.stark$/
59-
}
60-
}, '999', {
61-
'$cond': [
63+
$regexMatch: {
64+
input: "$domain",
65+
regex: /^\d{3}\.stark$/,
66+
},
67+
},
68+
"999",
69+
{
70+
$cond: [
71+
{
72+
$regexMatch: {
73+
input: "$domain",
74+
regex: /^.{3}\.stark$/,
75+
},
76+
},
77+
"three_letters",
6278
{
63-
'$regexMatch': {
64-
'input': '$domain',
65-
'regex': /^.{3}\.stark$/
66-
}
67-
}, 'three_letters', {
68-
'$cond': [
79+
$cond: [
6980
{
70-
'$regexMatch': {
71-
'input': '$domain',
72-
'regex': /^\d{4}\.stark$/
73-
}
74-
}, '10k', 'none'
75-
]
76-
}
77-
]
78-
}
79-
]
80-
}
81-
]
82-
}
83-
]
84-
}
85-
]
86-
}
87-
}
88-
}, {
89-
'$match': {
90-
'club': {
91-
'$ne': 'none'
92-
}
93-
}
94-
}
81+
$regexMatch: {
82+
input: "$domain",
83+
regex: /^\d{4}\.stark$/,
84+
},
85+
},
86+
"10k",
87+
"none",
88+
],
89+
},
90+
],
91+
},
92+
],
93+
},
94+
],
95+
},
96+
],
97+
},
98+
],
99+
},
100+
},
101+
},
102+
{
103+
$match: {
104+
club: {
105+
$ne: "none",
106+
},
107+
},
108+
},
95109
])
96110
.toArray()
97111
).map((doc) => {
98112
return {
99113
domain: doc.domain,
100114
club: doc.club,
101-
}
115+
};
102116
});
103117

104118
res.setHeader("cache-control", "max-age=30").status(200).json(output);

‎pages/api/indexer/uri.ts

+88-67
Original file line numberDiff line numberDiff line change
@@ -4,80 +4,101 @@ import NextCors from "nextjs-cors";
44
import { QueryError } from "../../../types/backTypes";
55

66
type TokenURI = {
7-
name: string;
8-
description: string;
9-
image: string;
10-
expiry?: number;
11-
attributes?: Array<{
12-
trait_type: string;
13-
value: string | number | Array<string>;
14-
}>
7+
name: string;
8+
description: string;
9+
image: string;
10+
expiry?: number;
11+
attributes?: Array<{
12+
trait_type: string;
13+
value: string | number | Array<string>;
14+
}>;
1515
};
1616

1717
type DomainQueryResult = {
18-
domain: string;
19-
expiry: number;
20-
}
18+
domain: string;
19+
expiry: number;
20+
};
2121

2222
export default async function handler(
23-
req: NextApiRequest,
24-
res: NextApiResponse<TokenURI | QueryError>
23+
req: NextApiRequest,
24+
res: NextApiResponse<TokenURI | QueryError>
2525
) {
26-
await NextCors(req, res, {
27-
methods: ["GET"],
28-
origin: "*",
29-
optionsSuccessStatus: 200,
26+
await NextCors(req, res, {
27+
methods: ["GET"],
28+
origin: "*",
29+
optionsSuccessStatus: 200,
30+
});
31+
const {
32+
query: { id },
33+
} = req;
34+
const { db } = await connectToDatabase();
35+
const domainCollection = db.collection("domains");
36+
let document: DomainQueryResult | null = null;
37+
await domainCollection
38+
.findOne({ token_id: id, "_chain.valid_to": null })
39+
.then((doc) => {
40+
document = doc as DomainQueryResult | null;
3041
});
31-
const {
32-
query: { id },
33-
} = req;
34-
const { db } = await connectToDatabase();
35-
const domainCollection = db.collection("domains");
36-
let document: DomainQueryResult | null = null;
37-
await domainCollection
38-
.findOne({ token_id: id, "_chain.valid_to": null })
39-
.then((doc) => {
40-
document = doc as DomainQueryResult | null;
41-
});
42-
document = document as DomainQueryResult | null;
43-
44-
if (!document) {
45-
res
46-
.setHeader("cache-control", "max-age=30")
47-
.status(200)
48-
.json({
49-
name: "Starknet ID: " + id,
50-
description: "This token represents an identity on StarkNet.",
51-
image: "https://starknet.id/api/identicons/" + id,
52-
});
53-
return;
54-
}
42+
document = document as DomainQueryResult | null;
5543

56-
const expiryDate = new Date(document.expiry * 1000);
57-
// format date as "Jan 1, 2021"
58-
const expiryDateString = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'June', 'July', 'Aug', 'Sept', 'Oct', 'Nov', 'Dec'][expiryDate.getUTCMonth()]
59-
+ " " + expiryDate.getUTCDate() + ", " + expiryDate.getUTCFullYear();
44+
if (!document) {
6045
res
61-
.setHeader("cache-control", "max-age=30")
62-
.status(200)
63-
.json({
64-
name: document.domain,
65-
description: "This token represents an identity on StarkNet.",
66-
image: "https://starknet.id/api/identicons/" + id,
67-
expiry: document.expiry,
68-
attributes: [
69-
{
70-
trait_type: "Subdomain",
71-
value: document.domain.substring(0, document.domain.length - 6).includes(".") ? "yes" : "no",
72-
},
73-
{
74-
trait_type: "Domain expiry",
75-
value: [expiryDateString],
76-
},
77-
{
78-
trait_type: "Domain expiry timestamp",
79-
value: document.expiry,
80-
}
81-
]
82-
});
46+
.setHeader("cache-control", "max-age=30")
47+
.status(200)
48+
.json({
49+
name: "Starknet ID: " + id,
50+
description: "This token represents an identity on StarkNet.",
51+
image: "https://starknet.id/api/identicons/" + id,
52+
});
53+
return;
54+
}
55+
56+
const expiryDate = new Date(document.expiry * 1000);
57+
// format date as "Jan 1, 2021"
58+
const expiryDateString =
59+
[
60+
"Jan",
61+
"Feb",
62+
"Mar",
63+
"Apr",
64+
"May",
65+
"June",
66+
"July",
67+
"Aug",
68+
"Sept",
69+
"Oct",
70+
"Nov",
71+
"Dec",
72+
][expiryDate.getUTCMonth()] +
73+
" " +
74+
expiryDate.getUTCDate() +
75+
", " +
76+
expiryDate.getUTCFullYear();
77+
res
78+
.setHeader("cache-control", "max-age=30")
79+
.status(200)
80+
.json({
81+
name: document.domain,
82+
description: "This token represents an identity on StarkNet.",
83+
image: "https://starknet.id/api/identicons/" + id,
84+
expiry: document.expiry,
85+
attributes: [
86+
{
87+
trait_type: "Subdomain",
88+
value: document.domain
89+
.substring(0, document.domain.length - 6)
90+
.includes(".")
91+
? "yes"
92+
: "no",
93+
},
94+
{
95+
trait_type: "Domain expiry",
96+
value: [expiryDateString],
97+
},
98+
{
99+
trait_type: "Domain expiry timestamp",
100+
value: document.expiry,
101+
},
102+
],
103+
});
83104
}

‎pages/identities.tsx

+8-4
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ import IdentitiesSkeleton from "../components/UI/identitiesSkeleton";
1818

1919
const Identities: NextPage = () => {
2020
const { address } = useAccount();
21-
const [loading, setLoading] = useState<boolean>(false)
21+
const [loading, setLoading] = useState<boolean>(false);
2222
const [ownedIdentities, setOwnedIdentities] = useState<FullId[]>([]);
2323
const [rightTokenId, setRightTokenId] = useState<number | undefined>(
2424
undefined
@@ -48,12 +48,12 @@ const Identities: NextPage = () => {
4848
useEffect(() => {
4949
if (address) {
5050
// Our Indexer
51-
setLoading(true)
51+
setLoading(true);
5252
fetch(`/api/indexer/addr_to_full_ids?addr=${hexToDecimal(address)}`)
5353
.then((response) => response.json())
5454
.then((data) => {
5555
setOwnedIdentities(data.full_ids);
56-
setLoading(false)
56+
setLoading(false);
5757
});
5858

5959
// // Aspect Indexer
@@ -82,7 +82,11 @@ const Identities: NextPage = () => {
8282
<>
8383
<h1 className="title">Your Starknet identities</h1>
8484
<div className={styles.containerGallery}>
85-
{loading ? <IdentitiesSkeleton /> : <IdentitiesGallery identities={ownedIdentities} />}
85+
{loading ? (
86+
<IdentitiesSkeleton />
87+
) : (
88+
<IdentitiesGallery identities={ownedIdentities} />
89+
)}
8690
<MintIdentity onClick={() => mint()} />
8791
</div>
8892
</>

‎pages/identities/[tokenId].tsx

+75-66
Original file line numberDiff line numberDiff line change
@@ -7,80 +7,89 @@ import { ThreeDots } from "react-loader-spinner";
77
import { Identity } from "../../types/backTypes";
88
import IdentityWarnings from "../../components/identities/identityWarnings";
99
import IdentityCard from "../../components/identities/identityCard";
10-
import IdentityMenu from "../../components/identities/identityMenu";
1110
import IdentityActions from "../../components/identities/identitiesActions";
1211

1312
const TokenIdPage: NextPage = () => {
14-
const router = useRouter();
15-
const tokenId: string = router.query.tokenId as string;
16-
const [identity, setIdentity] = useState<Identity>();
17-
const [isIdentityADomain, setIsIdentityADomain] = useState<
18-
boolean | undefined
19-
>();
20-
const [hideActions, setHideActions] = useState(false)
13+
const router = useRouter();
14+
const tokenId: string = router.query.tokenId as string;
15+
const [identity, setIdentity] = useState<Identity>();
16+
const [isIdentityADomain, setIsIdentityADomain] = useState<
17+
boolean | undefined
18+
>();
19+
const [hideActions, setHideActions] = useState(false);
2120

22-
const hideActionsHandler = (state: boolean) => {
23-
if (state == true) {
24-
setHideActions(true);
25-
} else {
26-
setHideActions(false);
27-
}
21+
const hideActionsHandler = (state: boolean) => {
22+
if (state == true) {
23+
setHideActions(true);
24+
} else {
25+
setHideActions(false);
2826
}
27+
};
2928

30-
useEffect(() => {
31-
if (tokenId) {
32-
const refreshData = () =>
33-
fetch(`/api/indexer/id_to_data?id=${tokenId}`)
34-
.then((response) => response.json())
35-
.then((data: Identity) => {
36-
if (data.error) {
37-
setIsIdentityADomain(false);
38-
return;
39-
}
40-
setIdentity(data);
41-
setIsIdentityADomain(true);
42-
});
43-
refreshData();
44-
const timer = setInterval(() => refreshData(), 30e3);
45-
return () => clearInterval(timer);
46-
}
47-
}, [tokenId]);
29+
useEffect(() => {
30+
if (tokenId) {
31+
const refreshData = () =>
32+
fetch(`/api/indexer/id_to_data?id=${tokenId}`)
33+
.then((response) => response.json())
34+
.then((data: Identity) => {
35+
if (data.error) {
36+
setIsIdentityADomain(false);
37+
return;
38+
}
39+
setIdentity(data);
40+
setIsIdentityADomain(true);
41+
});
42+
refreshData();
43+
const timer = setInterval(() => refreshData(), 30e3);
44+
return () => clearInterval(timer);
45+
}
46+
}, [tokenId]);
4847

49-
return (
50-
<div className={styles.screen}>
51-
<div className={styles2.containerIdentity}>
52-
{isIdentityADomain === undefined ? (
53-
<div className="h-full flex items-center justify-center">
54-
<ThreeDots
55-
height="25"
56-
width="80"
57-
radius="9"
58-
color="#19AA6E"
59-
ariaLabel="three-dots-loading"
60-
visible={true}
61-
/>
62-
</div>
63-
) : (
64-
<>
65-
<div className="flex flex-col items-center lg:flex-row w-full p-4 justify-center lg:gap-20 h-full">
66-
<div className="w-11/12 mt-40 mb-10 lg:mt-0 lg:mb-0 lg:w-6/12 h-full flex justify-center items-center">
67-
<IdentityCard identity={identity} tokenId={tokenId} domain={
68-
isIdentityADomain
69-
? identity?.domain
70-
: `Starknet ID : ${tokenId}`
71-
} />
72-
</div>
73-
{!hideActions &&
74-
<div className="w-full lg:w-3/12 h-full flex justify-center items-center">
75-
<IdentityActions tokenId={tokenId} isIdentityADomain={isIdentityADomain} identity={identity} hideActionsHandler={hideActionsHandler} />
76-
</div>}
77-
</div>
78-
<IdentityWarnings identity={identity} />
79-
</>
80-
)}
48+
return (
49+
<div className={styles.screen}>
50+
<div className={styles2.containerIdentity}>
51+
{isIdentityADomain === undefined ? (
52+
<div className="h-full flex items-center justify-center">
53+
<ThreeDots
54+
height="25"
55+
width="80"
56+
radius="9"
57+
color="#19AA6E"
58+
ariaLabel="three-dots-loading"
59+
visible={true}
60+
/>
61+
</div>
62+
) : (
63+
<>
64+
<div className="flex flex-col items-center lg:flex-row w-full p-4 justify-center lg:gap-20 h-full">
65+
<div className="w-11/12 mt-40 mb-10 lg:mt-0 lg:mb-0 lg:w-6/12 h-full flex justify-center items-center">
66+
<IdentityCard
67+
identity={identity}
68+
tokenId={tokenId}
69+
domain={
70+
isIdentityADomain
71+
? identity?.domain
72+
: `Starknet ID : ${tokenId}`
73+
}
74+
/>
75+
</div>
76+
{!hideActions && (
77+
<div className="w-full lg:w-3/12 h-full flex justify-center items-center">
78+
<IdentityActions
79+
tokenId={tokenId}
80+
isIdentityADomain={isIdentityADomain}
81+
identity={identity}
82+
hideActionsHandler={hideActionsHandler}
83+
/>
84+
</div>
85+
)}
8186
</div>
82-
</div>
83-
);
87+
<IdentityWarnings identity={identity} />
88+
</>
89+
)}
90+
</div>
91+
</div>
92+
);
8493
};
8594

8695
export default TokenIdPage;

‎postcss.config.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,4 @@ module.exports = {
33
tailwindcss: {},
44
autoprefixer: {},
55
},
6-
}
6+
};

‎public/fonts/montserrat/DESCRIPTION.en_us.html

+31-11
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,39 @@
11
<p>
2-
The old posters and signs in the traditional <em>Montserrat</em> neighborhood of Buenos Aires inspired Julieta Ulanovsky to design this typeface and rescue the beauty of urban typography that emerged in the first half of the twentieth century.
3-
As urban development changes that place, it will never return to its original form and loses forever the designs that are so special and unique.
4-
The letters that inspired this project have work, dedication, care, color, contrast, light and life, day and night!
5-
These are the types that make the city look so beautiful.
6-
The Montserrat Project began with the idea to rescue what is in Montserrat and set it free under a libre license, the SIL Open Font License.
2+
The old posters and signs in the traditional <em>Montserrat</em> neighborhood
3+
of Buenos Aires inspired Julieta Ulanovsky to design this typeface and rescue
4+
the beauty of urban typography that emerged in the first half of the twentieth
5+
century. As urban development changes that place, it will never return to its
6+
original form and loses forever the designs that are so special and unique.
7+
The letters that inspired this project have work, dedication, care, color,
8+
contrast, light and life, day and night! These are the types that make the
9+
city look so beautiful. The Montserrat Project began with the idea to rescue
10+
what is in Montserrat and set it free under a libre license, the SIL Open Font
11+
License.
712
</p>
813
<p>
9-
This is the normal family, and it has two sister families so far, <a href="http://fonts.google.com/specimen/Montserrat+Alternates">Alternates</a> and <a href="http://fonts.google.com/specimen/Montserrat+Subrayada">Subrayada</a>.
10-
Many of the letterforms are special in the Alternates family, while 'Subrayada' means 'Underlined' in Spanish and celebrates a special style of underline that is integrated into the letterforms found in the <em>Montserrat</em> neighborhood.
14+
This is the normal family, and it has two sister families so far,
15+
<a href="http://fonts.google.com/specimen/Montserrat+Alternates"
16+
>Alternates</a
17+
>
18+
and
19+
<a href="http://fonts.google.com/specimen/Montserrat+Subrayada">Subrayada</a>.
20+
Many of the letterforms are special in the Alternates family, while
21+
'Subrayada' means 'Underlined' in Spanish and celebrates a special style of
22+
underline that is integrated into the letterforms found in the
23+
<em>Montserrat</em> neighborhood.
1124
</p>
1225
<p>
13-
Updated November 2017: The family was redrawn by Jacques Le Bailly at <a href="http://www.baronvonfonthausen.com/">Baron von Fonthausen</a> over the summer, and the full set of weights were adjusted to make the Regular lighter and better for use in longer texts.
14-
In fall, Julieta Ulanovsky, Sol Matas, and Juan Pablo del Peral, led the development of Cyrillic support, with consultation with Carolina Giovagnoli, Maria Doreuli, and Alexei Vanyashin.
26+
Updated November 2017: The family was redrawn by Jacques Le Bailly at
27+
<a href="http://www.baronvonfonthausen.com/">Baron von Fonthausen</a> over the
28+
summer, and the full set of weights were adjusted to make the Regular lighter
29+
and better for use in longer texts. In fall, Julieta Ulanovsky, Sol Matas, and
30+
Juan Pablo del Peral, led the development of Cyrillic support, with
31+
consultation with Carolina Giovagnoli, Maria Doreuli, and Alexei Vanyashin.
1532
</p>
1633
<p>
17-
The Montserrat project is led by Julieta Ulanovsky, a type designer based in Buenos Aires, Argentina.
18-
To contribute, see <a href="https://github.com/JulietaUla/Montserrat">github.com/JulietaUla/Montserrat</a>
34+
The Montserrat project is led by Julieta Ulanovsky, a type designer based in
35+
Buenos Aires, Argentina. To contribute, see
36+
<a href="https://github.com/JulietaUla/Montserrat"
37+
>github.com/JulietaUla/Montserrat</a
38+
>
1939
</p>

‎styles/components/identityCard.module.css

+33-31
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
.domain {
22
height: 32px;
3-
font-family: 'Quick Zap';
3+
font-family: "Quick Zap";
44
font-style: normal;
55
font-weight: 400;
66
font-size: 30px;
77
line-height: 32px;
8-
color: #402D28;
8+
color: #402d28;
99
flex: none;
1010
order: 0;
1111
flex-grow: 0;
@@ -24,45 +24,47 @@
2424
width: 100%;
2525
height: 70%;
2626

27-
background: radial-gradient(55.2% 127.01% at 50% 50%, #EAE0D5 0%, #FFF9F0 100%) /* warning: gradient uses a rotation that is not supported by CSS and may not behave as expected */;
27+
background: radial-gradient(
28+
55.2% 127.01% at 50% 50%,
29+
#eae0d5 0%,
30+
#fff9f0 100%
31+
)
32+
/* warning: gradient uses a rotation that is not supported by CSS and may not behave as expected */;
2833

29-
border: 2px solid #BF9E7B;
34+
border: 2px solid #bf9e7b;
3035
box-shadow: 0px 2.62766px 35.0355px rgba(64, 45, 40, 0.15);
3136
border-radius: 13.1383px;
3237
}
3338

3439
.lg1 {
35-
position: absolute;
36-
width: (308.16 / 3)px;
37-
height: (378.56 / 3)px;
38-
right: -25px;
39-
bottom: -140px;
40+
position: absolute;
41+
width: (308.16 / 3) px;
42+
height: (378.56 / 3) px;
43+
right: -25px;
44+
bottom: -140px;
4045
}
4146

42-
4347
.lg2 {
44-
position: absolute;
45-
width: (397.34 / 3)px;
46-
height: (446.38 / 3)px;
47-
left: -100px;
48-
bottom: -160px;
48+
position: absolute;
49+
width: (397.34 / 3) px;
50+
height: (446.38 / 3) px;
51+
left: -100px;
52+
bottom: -160px;
4953
}
5054

51-
5255
@media (max-width: 1024px) {
53-
54-
.container {
55-
height: 100%;
56-
}
57-
.lg1 {
58-
height: 200px;
59-
right: -60px;
60-
bottom: -40px;
61-
}
62-
.lg2 {
63-
width: 200px;
64-
height: 250px;
65-
left: -100px;
66-
bottom: -70px;
67-
}
56+
.container {
57+
height: 100%;
58+
}
59+
.lg1 {
60+
height: 200px;
61+
right: -60px;
62+
bottom: -40px;
63+
}
64+
.lg2 {
65+
width: 200px;
66+
height: 250px;
67+
left: -100px;
68+
bottom: -70px;
69+
}
6870
}

‎styles/components/identityMenu.module.css

+8-7
Original file line numberDiff line numberDiff line change
@@ -17,12 +17,16 @@
1717

1818
width: 100%;
1919

20-
background: radial-gradient(382.53% 14823.28% at 46.39% 50%, #FFF9F0 0%, #DCCAB8 100%);
20+
background: radial-gradient(
21+
382.53% 14823.28% at 46.39% 50%,
22+
#fff9f0 0%,
23+
#dccab8 100%
24+
);
2125
/* Secondary/700 */
2226

2327
border-width: 1px 6px 4px 1px;
2428
border-style: solid;
25-
border-color: #402D28;
29+
border-color: #402d28;
2630
/* Button */
2731

2832
box-shadow: 0px 6px 80px rgba(191, 158, 123, 0.07);
@@ -41,24 +45,21 @@
4145
.clickableActionText {
4246
/* Create a subdomain */
4347

44-
4548
width: 157px;
4649
height: 24px;
4750

4851
/* Button/16px */
4952

50-
font-family: 'Quick Zap';
53+
font-family: "Quick Zap";
5154
font-style: normal;
5255
font-weight: 400;
5356
font-size: 15px;
5457
line-height: 24px;
5558
/* identical to box height, or 150% */
5659

57-
5860
/* Secondary/700 */
5961

60-
color: #402D28;
61-
62+
color: #402d28;
6263

6364
/* Inside auto layout */
6465

‎utils/stringService.ts

+46-46
Original file line numberDiff line numberDiff line change
@@ -1,88 +1,88 @@
11
import { BN } from "bn.js";
22

33
export function minifyAddress(address: string | undefined): string {
4-
if (!address) return "";
4+
if (!address) return "";
55

6-
const firstPart = address.substring(0, 4);
7-
const secondPart = address.substring(address.length - 3, address.length);
6+
const firstPart = address.substring(0, 4);
7+
const secondPart = address.substring(address.length - 3, address.length);
88

9-
return (firstPart + "..." + secondPart).toLowerCase();
9+
return (firstPart + "..." + secondPart).toLowerCase();
1010
}
1111

12-
export function responsiveDomain(
13-
domain: string,
14-
characterToBreak?: number
12+
export function shortenDomain(
13+
domain: string,
14+
characterToBreak?: number
1515
): string {
16-
if (domain.length > (characterToBreak ?? 18)) {
17-
const firstPart = domain.substring(0, 4);
18-
const secondPart = domain.substring(domain.length - 3, domain.length);
19-
20-
return (firstPart + "..." + secondPart).toLowerCase();
21-
} else {
22-
return domain.toLowerCase();
23-
}
16+
if (domain.length > (characterToBreak ?? 18)) {
17+
const firstPart = domain.substring(0, 4);
18+
const secondPart = domain.substring(domain.length - 3, domain.length);
19+
20+
return (firstPart + "..." + secondPart).toLowerCase();
21+
} else {
22+
return domain.toLowerCase();
23+
}
2424
}
2525

2626
export function minifyDomain(
27-
domain: string,
28-
characterToBreak?: number
27+
domain: string,
28+
characterToBreak?: number
2929
): string {
30-
if (domain.length > (characterToBreak ?? 18)) {
31-
const firstPart = domain.substring(0, 4);
32-
return (firstPart + "...").toLowerCase();
33-
} else {
34-
return domain.toLowerCase();
35-
}
30+
if (domain.length > (characterToBreak ?? 18)) {
31+
const firstPart = domain.substring(0, 4);
32+
return (firstPart + "...").toLowerCase();
33+
} else {
34+
return domain.toLowerCase();
35+
}
3636
}
3737

3838
export function is1234Domain(domain: string): boolean {
39-
return /^\d{4}$/.test(domain) && parseInt(domain) < 1234;
39+
return /^\d{4}$/.test(domain) && parseInt(domain) < 1234;
4040
}
4141

4242
export function getDomainWithoutStark(str: string | undefined): string {
43-
if (!str) return "";
43+
if (!str) return "";
4444

45-
if (str.endsWith(".stark")) {
46-
return str.slice(0, str.length - 6);
47-
} else {
48-
return str;
49-
}
45+
if (str.endsWith(".stark")) {
46+
return str.slice(0, str.length - 6);
47+
} else {
48+
return str;
49+
}
5050
}
5151

5252
export function isHexString(str: string): boolean {
53-
if (str === "") return true;
54-
return /^0x[0123456789abcdefABCDEF]+$/.test(str);
53+
if (str === "") return true;
54+
return /^0x[0123456789abcdefABCDEF]+$/.test(str);
5555
}
5656

5757
export function generateString(length: number, characters: string): string {
58-
let result = "";
59-
const charactersLength = characters.length;
60-
for (let i = 0; i < length; i++) {
61-
result += characters.charAt(Math.floor(Math.random() * charactersLength));
62-
}
58+
let result = "";
59+
const charactersLength = characters.length;
60+
for (let i = 0; i < length; i++) {
61+
result += characters.charAt(Math.floor(Math.random() * charactersLength));
62+
}
6363

64-
return result;
64+
return result;
6565
}
6666

6767
export function isSubdomain(domain: string | undefined): boolean {
68-
if (!domain) return false;
68+
if (!domain) return false;
6969

70-
return Boolean((domain.match(/\./g) || []).length > 1);
70+
return Boolean((domain.match(/\./g) || []).length > 1);
7171
}
7272

7373
// eslint-disable-next-line @typescript-eslint/adjacent-overload-signatures
7474
export function isStarkRootDomain(domain: string): boolean {
75-
return /^([a-z0-9-]){1,48}\.stark$/.test(domain);
75+
return /^([a-z0-9-]){1,48}\.stark$/.test(domain);
7676
}
7777

7878
export function isStarkDomain(domain: string) {
79-
return /^(?:[a-z0-9-]{1,48}(?:[a-z0-9-]{1,48}[a-z0-9-])?\.)*[a-z0-9-]{1,48}\.stark$/.test(
80-
domain
81-
);
79+
return /^(?:[a-z0-9-]{1,48}(?:[a-z0-9-]{1,48}[a-z0-9-])?\.)*[a-z0-9-]{1,48}\.stark$/.test(
80+
domain
81+
);
8282
}
8383

8484
export function numberToString(element: number | undefined): string {
85-
if (element === undefined) return "";
85+
if (element === undefined) return "";
8686

87-
return new BN(element).toString(10);
87+
return new BN(element).toString(10);
8888
}

0 commit comments

Comments
 (0)
Please sign in to comment.