LaconicNetwork/icns-frontend
3
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'main' of https://github.com/interchain-name/icns-frontend into main

Browse Source
This commit is contained in:
delivan 2022-12-17 00:53:45 +09:00
commit 2efe20f0a0
7 changed files with 115 additions and 90 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

131
components/skeleton/skeleton-chain-list.tsx
View File

@ -27,8 +27,8 @@ import {
} from "../chain-list";
export const SkeletonChainList: FunctionComponent = () => (
<SkeletonContainer>
<ContentContainer>
<ContentContainer>
<SkeletonContainer>
<ProfileContainer color={color.grey["700"]}>
<SkeletonCircle width="5.5rem" height="5.5rem" />
@ -48,84 +48,85 @@ export const SkeletonChainList: FunctionComponent = () => (
<SkeletonText width="20rem" height="1rem" />
</ProfileContentContainer>
</ProfileContainer>
</SkeletonContainer>
<ChainListTitleContainer>
<SkeletonTitle />
</ChainListTitleContainer>
<ChainListTitleContainer>
<SkeletonTitle />
</ChainListTitleContainer>
<ChainContainer color={color.grey["700"]}>
<ChainItemContainer isLoading={true}>
<ChainImageContainer width="3rem" height="3rem">
<SkeletonCircle width="3rem" height="3rem" />
</ChainImageContainer>
<ChainInfoContainer>
<SkeletonText width="4rem" height="1rem" />
<SkeletonText width="12rem" height="1rem" />
</ChainInfoContainer>
</ChainItemContainer>
<ChainContainer color={color.grey["700"]}>
<ChainItemContainer isLoading={true}>
<ChainImageContainer width="3rem" height="3rem">
<SkeletonCircle width="3rem" height="3rem" />
</ChainImageContainer>
<ChainInfoContainer>
<SkeletonText width="4rem" height="1rem" />
<SkeletonText width="12rem" height="1rem" />
</ChainInfoContainer>
</ChainItemContainer>
<SkeletonDivider />
<SkeletonDivider />
<ChainItemContainer isLoading={true}>
<ChainImageContainer width="3rem" height="3rem">
<SkeletonCircle width="3rem" height="3rem" />
</ChainImageContainer>
<ChainInfoContainer>
<SkeletonText width="4rem" height="1rem" />
<SkeletonText width="12rem" height="1rem" />
</ChainInfoContainer>
</ChainItemContainer>
<ChainItemContainer isLoading={true}>
<ChainImageContainer width="3rem" height="3rem">
<SkeletonCircle width="3rem" height="3rem" />
</ChainImageContainer>
<ChainInfoContainer>
<SkeletonText width="4rem" height="1rem" />
<SkeletonText width="12rem" height="1rem" />
</ChainInfoContainer>
</ChainItemContainer>
<SkeletonDivider />
<SkeletonDivider />
<ChainItemContainer isLoading={true}>
<ChainImageContainer width="3rem" height="3rem">
<SkeletonCircle width="3rem" height="3rem" />
</ChainImageContainer>
<ChainInfoContainer>
<SkeletonText width="4rem" height="1rem" />
<SkeletonText width="12rem" height="1rem" />
</ChainInfoContainer>
</ChainItemContainer>
<ChainItemContainer isLoading={true}>
<ChainImageContainer width="3rem" height="3rem">
<SkeletonCircle width="3rem" height="3rem" />
</ChainImageContainer>
<ChainInfoContainer>
<SkeletonText width="4rem" height="1rem" />
<SkeletonText width="12rem" height="1rem" />
</ChainInfoContainer>
</ChainItemContainer>
<SkeletonDivider />
<SkeletonDivider />
<ChainItemContainer isLoading={true}>
<ChainImageContainer width="3rem" height="3rem">
<SkeletonCircle width="3rem" height="3rem" />
</ChainImageContainer>
<ChainInfoContainer>
<SkeletonText width="4rem" height="1rem" />
<SkeletonText width="12rem" height="1rem" />
</ChainInfoContainer>
</ChainItemContainer>
<ChainItemContainer isLoading={true}>
<ChainImageContainer width="3rem" height="3rem">
<SkeletonCircle width="3rem" height="3rem" />
</ChainImageContainer>
<ChainInfoContainer>
<SkeletonText width="4rem" height="1rem" />
<SkeletonText width="12rem" height="1rem" />
</ChainInfoContainer>
</ChainItemContainer>
<SkeletonDivider />
<SkeletonDivider />
<ChainItemContainer isLoading={true}>
<ChainImageContainer width="3rem" height="3rem">
<SkeletonCircle width="3rem" height="3rem" />
</ChainImageContainer>
<ChainInfoContainer>
<SkeletonText width="4rem" height="1rem" />
<SkeletonText width="12rem" height="1rem" />
</ChainInfoContainer>
</ChainItemContainer>
<ChainItemContainer isLoading={true}>
<ChainImageContainer width="3rem" height="3rem">
<SkeletonCircle width="3rem" height="3rem" />
</ChainImageContainer>
<ChainInfoContainer>
<SkeletonText width="4rem" height="1rem" />
<SkeletonText width="12rem" height="1rem" />
</ChainInfoContainer>
</ChainItemContainer>
<SkeletonDivider />
</ChainContainer>
<SkeletonDivider />
</ChainContainer>
<SkeletonButtonContainer>
<ButtonContainer>
<SkeletonButton />
</ButtonContainer>
</SkeletonButtonContainer>
</ContentContainer>
</SkeletonContainer>
<SkeletonButtonContainer>
<ButtonContainer>
<SkeletonButton />
</ButtonContainer>
</SkeletonButtonContainer>
</ContentContainer>
);
const SkeletonContainer = styled.div`
padding: 2.4rem 0;
width: 100%;
padding-top: 2.4rem;
`;
const SkeletonTitle = styled.div`

10
constants/icns.ts
View File

@ -2,13 +2,17 @@ export const MainChainId = "osmo-test-4";
export const REFERRAL_KEY = "icns-referral";
export const RPC_URL = "https://rpc.testnet.osmosis.zone";
export const REST_URL = "https://lcd.testnet.osmosis.zone";
export const RPC_URL =
process.env.OSMOSIS_RPC_URL ?? "https://rpc.testnet.osmosis.zone";
export const REST_URL =
process.env.OSMOSIS_REST_URL ?? "https://lcd.testnet.osmosis.zone";
// TODO: .evn에 없으면 디폴트값 설정
export const NAME_NFT_ADDRESS =
process.env.ICNS_NAME_NFT_CONTRACT_ADDRESS ??
"osmo1xahnjn872smah6xle8n3z5a5teqq390qr959l805mkuw0kcy8g5smtdagg";
export const REGISTRAR_ADDRESS =
process.env.ICNS_REGISTRAR_CONTRACT_ADDRESS ??
"osmo1npn97g7hsgqlp70rw8nhd7c7vyvkukv9x0n25sn4fk5mgcjlz4gq9zlgf3";
export const RESOLVER_ADDRESS =
process.env.ICNS_RESOLVER_CONTRACT_ADDRESS ??
"osmo1002awr7frr9wk44lc3vfzt0d2w6vz5z03ql6fszjsjy8vdcvk0sskruz3c";

5
pages/_app.tsx
View File

@ -3,7 +3,6 @@ import { useRouter } from "next/router";
import React, { useMemo } from "react";
import { DefaultTheme, ThemeProvider } from "styled-components";
import ErrorBoundary from "../components/error-boundary";
import { PageBackground } from "../styles/background";
import { GlobalStyle } from "../styles/global";
@ -29,9 +28,7 @@ export default function App({ Component, pageProps }: AppProps) {
<React.Fragment>
<GlobalStyle />
<ErrorBoundary>
<PageBackground>
<Component {...pageProps} />
</PageBackground>
<Component {...pageProps} />
</ErrorBoundary>
</React.Fragment>
</ThemeProvider>

37
pages/_document.tsx
View File

@ -5,24 +5,39 @@ import Document, {
Main,
NextScript,
} from "next/document";
import { ServerStyleSheet } from "styled-components";
class MyDocument extends Document {
static async getInitialProps(ctx: DocumentContext) {
const sheet = new ServerStyleSheet();
const originalRenderPage = ctx.renderPage;
// Run the React rendering logic synchronously
ctx.renderPage = () =>
originalRenderPage({
// Useful for wrapping the whole react tree
enhanceApp: (App) => App,
// Useful for wrapping in a per-page basis
enhanceComponent: (Component) => Component,
});
try {
// Run the React rendering logic synchronously
ctx.renderPage = () =>
originalRenderPage({
// Useful for wrapping the whole react tree
enhanceApp: (App) => (props) =>
sheet.collectStyles(<App {...props} />),
// Useful for wrapping in a per-page basis
enhanceComponent: (Component) => Component,
});
// Run the parent `getInitialProps`, it now includes the custom `renderPage`
const initialProps = await Document.getInitialProps(ctx);
// Run the parent `getInitialProps`, it now includes the custom `renderPage`
const initialProps = await Document.getInitialProps(ctx);
return initialProps;
return {
...initialProps,
styles: (
<div>
{initialProps.styles}
{sheet.getStyleElement()}
</div>
),
};
} finally {
sheet.seal();
}
}
render() {

2
pages/api/icns-verification.ts
View File

@ -1,7 +1,7 @@
import { withIronSessionApiRoute } from "iron-session/next";
import type { NextApiRequest, NextApiResponse } from "next";
import { ironOptions } from "../../iron.config";
import { IcnsVerificationResponse } from "../../types/api-response";
import { IcnsVerificationResponse } from "../../types";
import { request } from "../../utils/url";
export default withIronSessionApiRoute(async function handler(

10
pages/verification/index.tsx
View File

@ -136,6 +136,16 @@ export default function VerificationPage() {
init();
}, []);
useEffect(() => {
setAllChains({
chainId: "all chains",
chainName: "all chains",
prefix: `all chains(${chainList.length})`,
address: chainList.map((chain) => chain.chainName).join(", "),
chainImageUrl: AllChainsIcon,
});
}, [chainList]);
useEffect(() => {
const disabledChainList = chainList.filter((chain) => {
for (const registeredChain of registeredChainList) {

10
styles/global.ts
View File

@ -14,15 +14,13 @@ export const GlobalStyle = createGlobalStyle`
background-size: 5rem 5rem;
background-position: top left;
background-repeat: repeat;
background-image: linear-gradient(
${({ theme }) => theme.bgGridColor ?? color.grey[600]} 0.1rem,
transparent 0.1rem
),
background-image: linear-gradient(${({ theme }) =>
theme.bgGridColor ?? color.grey[600]} 0.1rem,
transparent 0.1rem),
linear-gradient(90deg, ${({ theme }) =>
theme.bgGridColor ?? color.grey[600]} 0.1rem, transparent 0.1rem);
}
}
* {
box-sizing: border-box;
}