2020-05-22 14:38:19 +02:00
|
|
|
import React, { ReactElement } from 'react'
|
2023-01-29 22:58:19 +01:00
|
|
|
import { HeadProps } from 'gatsby'
|
2022-05-08 14:49:18 +02:00
|
|
|
import { RainbowKitProvider } from '@rainbow-me/rainbowkit'
|
2022-08-25 09:37:35 +02:00
|
|
|
import { WagmiConfig } from 'wagmi'
|
2023-01-29 22:58:19 +01:00
|
|
|
import Copy from '../components/atoms/Copy'
|
2022-11-19 16:09:13 +01:00
|
|
|
import Meta, { HeadMetaProps } from '../components/atoms/HeadMeta'
|
2023-01-29 22:58:19 +01:00
|
|
|
import Icon from '../components/atoms/Icon'
|
|
|
|
import Web3Donation from '../components/molecules/Web3Donation'
|
|
|
|
import { chains, theme, wagmiClient } from '../helpers/rainbowkit'
|
|
|
|
import { useSiteMetadata } from '../hooks/useSiteMetadata'
|
|
|
|
import * as styles from './thanks.module.css'
|
2022-11-19 16:09:13 +01:00
|
|
|
|
|
|
|
const meta: Partial<HeadMetaProps> = {
|
|
|
|
title: `Say Thanks`
|
|
|
|
}
|
2019-11-17 23:56:29 +01:00
|
|
|
|
2022-05-08 14:49:18 +02:00
|
|
|
function Coin({ address, title }: { address: string; title: string }) {
|
|
|
|
return (
|
2022-11-11 03:31:54 +01:00
|
|
|
<div className={styles.coin}>
|
|
|
|
<h4 className={styles.titleCoin}>{title}</h4>
|
|
|
|
<pre className={styles.code}>
|
2022-05-08 14:49:18 +02:00
|
|
|
<code>{address}</code>
|
|
|
|
<Copy text={address} />
|
|
|
|
</pre>
|
|
|
|
</div>
|
|
|
|
)
|
|
|
|
}
|
2019-11-17 23:56:29 +01:00
|
|
|
|
|
|
|
const BackButton = () => (
|
|
|
|
<button
|
2022-11-11 03:31:54 +01:00
|
|
|
className={`link ${styles.buttonBack}`}
|
2019-11-17 23:56:29 +01:00
|
|
|
onClick={() => window.history.back()}
|
|
|
|
>
|
|
|
|
<Icon name="ChevronLeft" /> Go Back
|
|
|
|
</button>
|
|
|
|
)
|
|
|
|
|
2020-05-22 14:38:19 +02:00
|
|
|
export default function Thanks(): ReactElement {
|
2019-11-17 23:56:29 +01:00
|
|
|
const { author } = useSiteMetadata()
|
2022-05-08 14:49:18 +02:00
|
|
|
const coins = Object.entries(author).filter(
|
|
|
|
([key]) => key === 'bitcoin' || key === 'ether'
|
2019-11-17 23:56:29 +01:00
|
|
|
)
|
|
|
|
|
|
|
|
return (
|
2022-11-19 16:09:13 +01:00
|
|
|
<article className={styles.thanks}>
|
|
|
|
<BackButton />
|
|
|
|
<header>
|
|
|
|
<h1 className={styles.title}>{meta.title}</h1>
|
|
|
|
</header>
|
2019-11-17 23:56:29 +01:00
|
|
|
|
2022-11-19 16:09:13 +01:00
|
|
|
<WagmiConfig client={wagmiClient}>
|
|
|
|
<RainbowKitProvider chains={chains} theme={theme}>
|
|
|
|
<Web3Donation address={author.ether} />
|
|
|
|
</RainbowKitProvider>
|
|
|
|
</WagmiConfig>
|
2019-11-17 23:56:29 +01:00
|
|
|
|
2022-11-19 16:09:13 +01:00
|
|
|
<div className={styles.coins}>
|
|
|
|
<h3 className={styles.subTitle}>
|
|
|
|
Send Bitcoin or ERC-20 tokens from any wallet.
|
|
|
|
</h3>
|
2019-11-17 23:56:29 +01:00
|
|
|
|
2022-11-19 16:09:13 +01:00
|
|
|
{coins.map(([key, value]) => (
|
|
|
|
<Coin key={key} title={key} address={value} />
|
|
|
|
))}
|
|
|
|
</div>
|
|
|
|
</article>
|
|
|
|
)
|
|
|
|
}
|
2019-11-22 21:26:50 +01:00
|
|
|
|
2022-11-19 16:09:13 +01:00
|
|
|
export function Head(props: HeadProps) {
|
|
|
|
return (
|
|
|
|
<Meta {...meta} slug={props.location.pathname}>
|
|
|
|
<meta name="robots" content="noindex,nofollow" />
|
|
|
|
</Meta>
|
2019-11-17 23:56:29 +01:00
|
|
|
)
|
|
|
|
}
|