Skip to content

Commit e893151

Browse files
netpoenetpoe
committed
feat(DetailsModal): renders ownerOf from tokenID
1 parent 912e73c commit e893151

20 files changed

+536
-84
lines changed

‎app/package.json

+1
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@
3030
"clsx": "^2.0.0",
3131
"dropzone": "^6.0.0-beta.2",
3232
"eslint-config-next": "^14.2.1",
33+
"ethers": "^6.12.0",
3334
"final-form": "^4.20.4",
3435
"final-form-arrays": "^3.0.2",
3536
"ipfs-http-client": "^60.0.1",

‎app/src/context/evm/larskristo-hellheads/LarskristoHellheadsContext.types.ts

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
11
import { ReactNode } from "react";
22

3-
import { LarsKristoHellheads } from "providers/evm/contracts/larskristohellheads/LarsKristoHellheads";
4-
53
export type LarskristoHellheadsContextControllerProps = {
64
children: ReactNode;
75
};
@@ -11,12 +9,14 @@ export type LarskristoHellheadsContextActions = {
119
};
1210

1311
export type LarskristoHellheadsContractValues = {
14-
name: LarsKristoHellheads["name"];
15-
symbol: LarsKristoHellheads["symbol"];
12+
name: string;
13+
symbol: string;
1614
};
1715

1816
export type LarskristoHellheadsContextType = {
1917
contractValues?: LarskristoHellheadsContractValues;
18+
contractAddress?: string;
2019
actions: LarskristoHellheadsContextActions;
2120
fetchContractValues: (address: string) => Promise<void>;
21+
ownerOf: (tokenId: number) => Promise<`0x${string}`>;
2222
};

‎app/src/context/evm/larskristo-hellheads/LarskristoHellheadsContextController.tsx

+35-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { useState } from "react";
1+
import React, { useEffect, useState } from "react";
22
import { getContract } from "viem";
33

44
import { LarsKristoHellheads__factory } from "providers/evm/contracts/larskristohellheads/LarsKristoHellheads__factory";
@@ -12,14 +12,36 @@ import {
1212
LarskristoHellheadsContractValues,
1313
} from "./LarskristoHellheadsContext.types";
1414

15+
const SEPOLIA_TESTNET_ADDRESS = "0x5D003EBE7348d6D3aC1a397619ED2016711d7615";
16+
const ETHEREUM_MAINNET_ADDRESS = "0x5D003EBE7348d6D3aC1a397619ED2016711d7615";
17+
1518
export const LarskristoHellheadsContextController = ({ children }: LarskristoHellheadsContextControllerProps) => {
19+
const [contractAddress, setContractAddress] = useState<string | undefined>();
1620
const [contractValues, setContractValues] = useState<LarskristoHellheadsContractValues>();
1721
const [actions, setActions] = useState<LarskristoHellheadsContextActions>({
1822
fetchContractValues: {
1923
isLoading: false,
2024
},
2125
});
2226

27+
const ownerOf = async (tokenId: number) => {
28+
try {
29+
const contract = getContract({
30+
address: contractAddress as `0x{string}`,
31+
abi: LarsKristoHellheads__factory.abi,
32+
client: evm.client,
33+
});
34+
35+
const owner = await contract.read.ownerOf([BigInt(tokenId)]);
36+
37+
return owner;
38+
} catch (error) {
39+
console.error(error);
40+
}
41+
42+
return "0x";
43+
};
44+
2345
const fetchContractValues = async (address: string) => {
2446
setActions((prev) => ({
2547
...prev,
@@ -55,10 +77,22 @@ export const LarskristoHellheadsContextController = ({ children }: LarskristoHel
5577
}));
5678
};
5779

80+
useEffect(() => {
81+
const address =
82+
process.env.NEXT_PUBLIC_DEFAULT_NETWORK_ENV === "testnet" ? SEPOLIA_TESTNET_ADDRESS : ETHEREUM_MAINNET_ADDRESS;
83+
setContractAddress(address);
84+
85+
(async () => {
86+
await fetchContractValues(address);
87+
})();
88+
}, []);
89+
5890
const props: LarskristoHellheadsContextType = {
5991
fetchContractValues,
6092
contractValues,
6193
actions,
94+
contractAddress,
95+
ownerOf,
6296
};
6397

6498
return <LarskristoHellheadsContext.Provider value={props}>{children}</LarskristoHellheadsContext.Provider>;

‎app/src/context/evm/wallet-selector/EvmWalletSelectorContextController.tsx

+7-2
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
1-
import React from "react";
1+
import React, { useState } from "react";
22
import { defaultWagmiConfig } from "@web3modal/wagmi/react/config";
33
import { createWeb3Modal } from "@web3modal/wagmi/react";
44
import { WagmiProvider, cookieStorage, createStorage } from "wagmi";
55
import { mainnet, sepolia } from "wagmi/chains";
6+
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
67

78
import { EvmWalletSelectorContext } from "./EvmWalletSelectorContext";
89
import {
@@ -40,11 +41,15 @@ createWeb3Modal({
4041
});
4142

4243
export const EvmWalletSelectorContextController = ({ children }: EvmWalletSelectorContextControllerProps) => {
44+
const [queryClient] = useState(() => new QueryClient());
45+
4346
const props: EvmWalletSelectorContextType = {};
4447

4548
return (
4649
<WagmiProvider config={wagmiConfig}>
47-
<EvmWalletSelectorContext.Provider value={props}>{children}</EvmWalletSelectorContext.Provider>
50+
<QueryClientProvider client={queryClient}>
51+
<EvmWalletSelectorContext.Provider value={props}>{children}</EvmWalletSelectorContext.Provider>
52+
</QueryClientProvider>
4853
</WagmiProvider>
4954
);
5055
};

‎app/src/providers/evm/contracts/common.ts

+92
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,92 @@
1+
/* Autogenerated file. Do not edit manually. */
2+
/* tslint:disable */
3+
/* eslint-disable */
4+
import type {
5+
FunctionFragment,
6+
Typed,
7+
EventFragment,
8+
ContractTransaction,
9+
ContractTransactionResponse,
10+
DeferredTopicFilter,
11+
EventLog,
12+
TransactionRequest,
13+
LogDescription,
14+
} from "ethers";
15+
16+
export interface TypedDeferredTopicFilter<_TCEvent extends TypedContractEvent> extends DeferredTopicFilter {}
17+
18+
export interface TypedContractEvent<
19+
InputTuple extends Array<any> = any,
20+
OutputTuple extends Array<any> = any,
21+
OutputObject = any,
22+
> {
23+
(...args: Partial<InputTuple>): TypedDeferredTopicFilter<TypedContractEvent<InputTuple, OutputTuple, OutputObject>>;
24+
name: string;
25+
fragment: EventFragment;
26+
getFragment(...args: Partial<InputTuple>): EventFragment;
27+
}
28+
29+
type __TypechainAOutputTuple<T> = T extends TypedContractEvent<infer _U, infer W> ? W : never;
30+
type __TypechainOutputObject<T> = T extends TypedContractEvent<infer _U, infer _W, infer V> ? V : never;
31+
32+
export interface TypedEventLog<TCEvent extends TypedContractEvent> extends Omit<EventLog, "args"> {
33+
args: __TypechainAOutputTuple<TCEvent> & __TypechainOutputObject<TCEvent>;
34+
}
35+
36+
export interface TypedLogDescription<TCEvent extends TypedContractEvent> extends Omit<LogDescription, "args"> {
37+
args: __TypechainAOutputTuple<TCEvent> & __TypechainOutputObject<TCEvent>;
38+
}
39+
40+
export type TypedListener<TCEvent extends TypedContractEvent> = (
41+
...listenerArg: [...__TypechainAOutputTuple<TCEvent>, TypedEventLog<TCEvent>, ...undefined[]]
42+
) => void;
43+
44+
export type MinEthersFactory<C, ARGS> = {
45+
deploy(...a: ARGS[]): Promise<C>;
46+
};
47+
48+
export type GetContractTypeFromFactory<F> = F extends MinEthersFactory<infer C, any> ? C : never;
49+
export type GetARGsTypeFromFactory<F> = F extends MinEthersFactory<any, any> ? Parameters<F["deploy"]> : never;
50+
51+
export type StateMutability = "nonpayable" | "payable" | "view";
52+
53+
export type BaseOverrides = Omit<TransactionRequest, "to" | "data">;
54+
export type NonPayableOverrides = Omit<BaseOverrides, "value" | "blockTag" | "enableCcipRead">;
55+
export type PayableOverrides = Omit<BaseOverrides, "blockTag" | "enableCcipRead">;
56+
export type ViewOverrides = Omit<TransactionRequest, "to" | "data">;
57+
export type Overrides<S extends StateMutability> = S extends "nonpayable"
58+
? NonPayableOverrides
59+
: S extends "payable"
60+
? PayableOverrides
61+
: ViewOverrides;
62+
63+
export type PostfixOverrides<A extends Array<any>, S extends StateMutability> = A | [...A, Overrides<S>];
64+
export type ContractMethodArgs<A extends Array<any>, S extends StateMutability> = PostfixOverrides<
65+
{ [I in keyof A]-?: A[I] | Typed },
66+
S
67+
>;
68+
69+
export type DefaultReturnType<R> = R extends Array<any> ? R[0] : R;
70+
71+
// export interface ContractMethod<A extends Array<any> = Array<any>, R = any, D extends R | ContractTransactionResponse = R | ContractTransactionResponse> {
72+
export interface TypedContractMethod<
73+
A extends Array<any> = Array<any>,
74+
R = any,
75+
S extends StateMutability = "payable",
76+
> {
77+
(...args: ContractMethodArgs<A, S>): S extends "view"
78+
? Promise<DefaultReturnType<R>>
79+
: Promise<ContractTransactionResponse>;
80+
81+
name: string;
82+
83+
fragment: FunctionFragment;
84+
85+
getFragment(...args: ContractMethodArgs<A, S>): FunctionFragment;
86+
87+
populateTransaction(...args: ContractMethodArgs<A, S>): Promise<ContractTransaction>;
88+
staticCall(...args: ContractMethodArgs<A, "view">): Promise<DefaultReturnType<R>>;
89+
send(...args: ContractMethodArgs<A, S>): Promise<ContractTransactionResponse>;
90+
estimateGas(...args: ContractMethodArgs<A, S>): Promise<bigint>;
91+
staticCallResult(...args: ContractMethodArgs<A, "view">): Promise<R>;
92+
}

‎app/src/providers/evm/contracts/larskristohellheads/LarsKristoHellheads__factory.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@
33
/* eslint-disable */
44
import { Contract, ContractFactory, ContractTransactionResponse, Interface } from "ethers";
55
import type { Signer, ContractDeployTransaction, ContractRunner } from "ethers";
6-
import type { NonPayableOverrides } from "../../common";
7-
import type { LarsKristoHellheads, LarsKristoHellheadsInterface } from "../../contracts/LarsKristoHellheads";
6+
import type { NonPayableOverrides } from "../common";
7+
import type { LarsKristoHellheads, LarsKristoHellheadsInterface } from "./LarsKristoHellheads";
88

99
const _abi = [
1010
{

‎app/src/theme/variants/_svpervnder.scss

+2-2
Original file line numberDiff line numberDiff line change
@@ -32,8 +32,8 @@ body[data-theme="lease-721"] {
3232

3333
// Brand
3434
--color-primary: #faff0a;
35-
--color-primary-shade-mid: #faff0a;
36-
--color-primary-shade-low: #faff0a;
35+
--color-primary-shade-mid: #e5e907;
36+
--color-primary-shade-low: #d5d907;
3737
--color-secondary: #fff;
3838
--color-secondary-shade-mid: var(--color-dark-4);
3939
--color-secondary-shade-low: var(--color-dark-7);

‎app/src/ui/modal/Modal.module.scss

+2-2
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
@mixin fullscreen {
44
position: absolute;
55
align-self: center;
6-
width: 95vw;
6+
width: 75vw;
77
max-height: 95%;
88
overflow-y: auto;
99
}
@@ -113,7 +113,7 @@
113113

114114
&__content {
115115
@include font-properties($typography-text);
116-
max-height: 50vh;
116+
max-height: 65vh;
117117
padding: $space-ml;
118118
overflow-y: auto;
119119
background-color: var(--color-background-contrast);

‎app/src/ui/svpervnder/collections/larskristo_hellheads/LarsKristoHellheads.module.scss

+5
Original file line numberDiff line numberDiff line change
@@ -56,6 +56,11 @@
5656
&--expand {
5757
font-size: $font-size-text;
5858
color: var(--color-typography-description);
59+
60+
&:hover {
61+
color: var(--color-primary);
62+
cursor: pointer;
63+
}
5964
}
6065
}
6166
}

0 commit comments

Comments
 (0)