setToggle(!toggle)}>
4 |
5 |
6 | )
7 | }
8 |
9 | export default ToggleSwitch
10 |
--------------------------------------------------------------------------------
/themes/primary.tsx:
--------------------------------------------------------------------------------
1 | const theme = {
2 | '--default-button-background-color': 'linear-gradient(97.62deg, #5f5bcd 0%, #a8a4f7 100%)',
3 | '--secondary-button-background-color': 'linear-gradient(97.62deg, #2b064d 0%, #4d0c8b 100%)',
4 | '--backColor': 'linear-gradient(180deg, #FD954E 0%, #FC8549 100%)',
5 | '--default-label-color': 'linear-gradient(180deg, #FD954E 0%, #FC8549 100%)',
6 | '--mainColor': 'black',
7 | }
8 |
9 |
10 | export default theme
11 |
--------------------------------------------------------------------------------
/themes/theme1.tsx:
--------------------------------------------------------------------------------
1 | const theme = {
2 | '--default-button-background-color': 'linear-gradient(8.3deg, #4470A2 -57.29%, #29858B 135.56%)',
3 | '--secondary-button-background-color': 'linear-gradient(.3deg, #4470A2 -57.29%, #29858B 135.56%)',
4 | '--backColor': 'linear-gradient(360deg, #EB2F3D 0%, #F84332 100%)',
5 | '--default-label-color': 'linear-gradient(98.3deg, #4470A2 -57.29%, #29858B 135.56%)',
6 | '--mainColor': 'black'
7 |
8 | }
9 |
10 | export default theme
11 |
--------------------------------------------------------------------------------
/lib/useInterval.js:
--------------------------------------------------------------------------------
1 | import { useEffect, useRef } from 'react'
2 |
3 | // https://overreacted.io/making-setinterval-declarative-with-react-hooks/
4 | const useInterval = (callback, delay) => {
5 | const savedCallback = useRef()
6 | useEffect(() => {
7 | savedCallback.current = callback
8 | }, [callback])
9 | useEffect(() => {
10 | const handler = (...args) => savedCallback.current(...args)
11 |
12 | if (delay !== null) {
13 | const id = setInterval(handler, delay)
14 | return () => clearInterval(id)
15 | }
16 | }, [delay])
17 | }
18 |
19 | export default useInterval
20 |
--------------------------------------------------------------------------------
/components/Layout/Footer.tsx:
--------------------------------------------------------------------------------
1 | import Link from 'next/link';
2 |
3 | const Footer = () => {
4 | return (
5 | <>
6 |
19 |
20 | );
21 | };
22 |
23 | export default Footer;
24 |
--------------------------------------------------------------------------------
/.env.mainnet:
--------------------------------------------------------------------------------
1 | # Token sale site config
2 | NEXT_PUBLIC_SITE_TITLE=Staking
3 | NEXT_PUBLIC_SITE_ICON_URL=/juno.svg
4 |
5 |
6 | # Chain config
7 | NEXT_PUBLIC_STAKING_CONTRACT=juno1z8aj6l5m758nz8ru3n2zf86ttyell7htns9jtanahrzfsrey40nskakqtg
8 | NEXT_PUBLIC_STAKING_TOKEN_ADDRESS=juno1t46z6hg8vvsena7sue0vg6w85ljar3cundplkre9sz0skeqkap9sxyyy6m
9 | NEXT_PUBLIC_CHAIN_ID=juno-1
10 | NEXT_PUBLIC_CHAIN_NAME=Juno
11 | NEXT_PUBLIC_CHAIN_BECH32_PREFIX=juno
12 | NEXT_PUBLIC_CHAIN_RPC_ENDPOINT=https://rpc-juno.itastakers.com
13 | NEXT_PUBLIC_CHAIN_REST_ENDPOINT=https://lcd-juno.itastakers.com
14 | NEXT_PUBLIC_STAKING_DENOM=ujuno
15 |
--------------------------------------------------------------------------------
/.env:
--------------------------------------------------------------------------------
1 | # Token sale site config
2 | NEXT_PUBLIC_SITE_TITLE=Staking
3 | NEXT_PUBLIC_SITE_ICON_URL=/juno.svg
4 |
5 |
6 | # Chain config
7 | NEXT_PUBLIC_STAKING_CONTRACT=juno1g7v2vrx95uxpwhpdyj6r0qgrlt3kqjqygwp6wy6ayktrklz4v04s06apfn
8 | NEXT_PUBLIC_STAKING_TOKEN_ADDRESS=juno17pevjnfrg36h80refmsdgqn4puxmp9d6lqtkhh6xn45r2q3flp2qsmmzep
9 | NEXT_PUBLIC_CHAIN_ID=uni-5
10 | NEXT_PUBLIC_CHAIN_NAME=Juno Testnet - Uni
11 | NEXT_PUBLIC_CHAIN_BECH32_PREFIX=juno
12 | NEXT_PUBLIC_CHAIN_RPC_ENDPOINT=https://rpc.juno.giansalex.dev
13 | NEXT_PUBLIC_CHAIN_REST_ENDPOINT=https://lcd.juno.giansalex.dev
14 | NEXT_PUBLIC_STAKING_DENOM=ujunox
15 |
--------------------------------------------------------------------------------
/.env,devnet:
--------------------------------------------------------------------------------
1 | # Token sale site config
2 | NEXT_PUBLIC_SITE_TITLE=CoinFlip
3 | NEXT_PUBLIC_SITE_ICON_URL=/juno.svg
4 |
5 |
6 | NEXT_PUBLIC_COINFLIP_CONTRACT=juno14hj2tavq8fpesdwxxcu44rty3hh90vhujrvcmstl4zr3txmfvw9skjuwg8
7 | NEXT_PUBLIC_CHAIN_ID=testing
8 | NEXT_PUBLIC_CHAIN_NAME=Juno Local Testnet
9 | NEXT_PUBLIC_CHAIN_BECH32_PREFIX=juno
10 | #NEXT_PUBLIC_CHAIN_RPC_ENDPOINT=http://95.217.56.252:26657
11 | #NEXT_PUBLIC_CHAIN_REST_ENDPOINT=http://95.217.56.252:1317
12 | NEXT_PUBLIC_CHAIN_RPC_ENDPOINT=http://localhost:26657
13 | NEXT_PUBLIC_CHAIN_REST_ENDPOINT=http://localhost:1317
14 | NEXT_PUBLIC_STAKING_DENOM=ujunox
15 |
16 |
--------------------------------------------------------------------------------
/.env.testnet:
--------------------------------------------------------------------------------
1 | # Token sale site config
2 | NEXT_PUBLIC_SITE_TITLE=Staking
3 | NEXT_PUBLIC_SITE_ICON_URL=/juno.svg
4 |
5 |
6 | # Chain config
7 | NEXT_PUBLIC_STAKING_CONTRACT=juno100gwhcjsfdjyq2nd2lqss7w6fg68j25cj73tweqesqgpylyzaffsazu4wh
8 | NEXT_PUBLIC_STAKING_TOKEN_ADDRESS=juno1x57danrk4j8yf28wwqj8ndnfgwzehy709lfnwjjzgusefmtlasasw6xr9d
9 | NEXT_PUBLIC_CHAIN_ID=uni-5
10 | NEXT_PUBLIC_CHAIN_NAME=Juno Testnet - Uni
11 | NEXT_PUBLIC_CHAIN_BECH32_PREFIX=juno
12 | NEXT_PUBLIC_CHAIN_RPC_ENDPOINT=https://rpc.juno.giansalex.dev
13 | NEXT_PUBLIC_CHAIN_REST_ENDPOINT=https://lcd.juno.giansalex.dev
14 | NEXT_PUBLIC_STAKING_DENOM=ujunox
15 |
--------------------------------------------------------------------------------
/util/ActiveLink.tsx:
--------------------------------------------------------------------------------
1 | import { withRouter } from 'next/router';
2 | import Link from 'next/link';
3 | import React, { Children } from 'react';
4 |
5 | const ActiveLink = ({ router, children, ...props }) => {
6 | const child = Children.only(children);
7 |
8 | let className = child.props.className || '';
9 | if (router.pathname === props.href && props.activeClassName) {
10 | className = `${className} ${props.activeClassName}`.trim();
11 | }
12 |
13 | delete props.activeClassName;
14 |
15 | return {React.cloneElement(child, { className })};
16 | };
17 |
18 | export default withRouter(ActiveLink);
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "es5",
4 | "lib": [
5 | "dom",
6 | "dom.iterable",
7 | "esnext"
8 | ],
9 | "allowJs": true,
10 | "skipLibCheck": true,
11 | "strict": false,
12 | "noImplicitAny": false,
13 | "forceConsistentCasingInFileNames": true,
14 | "noEmit": true,
15 | "esModuleInterop": true,
16 | "module": "esnext",
17 | "moduleResolution": "node",
18 | "resolveJsonModule": true,
19 | "isolatedModules": true,
20 | "jsx": "preserve"
21 | },
22 | "include": [
23 | "next-env.d.ts",
24 | "**/*.ts",
25 | "**/*.tsx"
26 | ],
27 | "exclude": [
28 | "node_modules"
29 | ]
30 | }
31 |
--------------------------------------------------------------------------------
/components/Shared/GoTop.tsx:
--------------------------------------------------------------------------------
1 | import React, { useState, useEffect } from 'react';
2 |
3 | const GoTop = () => {
4 | const [isVisible, setisVisible] = useState(false);
5 |
6 | useEffect(() => {
7 | document.addEventListener('scroll', function (e) {
8 | toggleVisibility();
9 | });
10 | }, []);
11 |
12 | const toggleVisibility = () => {
13 | if (window.pageYOffset > 300) {
14 | setisVisible(true);
15 | } else {
16 | setisVisible(false);
17 | }
18 | };
19 |
20 | const scrollToTop = () => {
21 | window.scrollTo({
22 | top: 0,
23 | behavior: 'smooth',
24 | });
25 | };
26 |
27 | return (
28 | <>
29 | {isVisible && (
30 | scrollToTop()}>
31 |
32 |
33 | )}
34 |
35 | );
36 | };
37 |
38 | export default GoTop;
39 |
--------------------------------------------------------------------------------
/components/Notification/index.tsx:
--------------------------------------------------------------------------------
1 | import { useContext } from 'react'
2 |
3 | import NotificationContext from './context'
4 | import Notification from './element'
5 | import useData from './useData'
6 |
7 | const NotificationContainer = ({ children }) => {
8 | // type is success or error. true is success, false is error
9 | const { notifications, success, error, remove } = useData()
10 |
11 | return (
12 |
66 |
102 |
103 | );
104 | };
105 |
106 | export default TopHeader;
107 |
--------------------------------------------------------------------------------
/public/css/blackHole.css:
--------------------------------------------------------------------------------
1 | .blackhole-main-wrapper {
2 | max-width: 1400px;
3 | width: 100%;
4 | padding: 20px;
5 | }
6 |
7 | .apys-select-combo {
8 | color: white;
9 | margin-top: 50px;
10 | }
11 |
12 | .apys-select-combo svg {
13 | color: white;
14 | }
15 |
16 | .apys-select-combo .MuiInputBase-root {
17 | border-radius: 32px;
18 | }
19 |
20 | .apys-select-combo .MuiFormLabel-root {
21 | color: grey;
22 | }
23 |
24 | .apys-select-combo .MuiFormControl-root button {
25 | margin: 0px;
26 | padding: 0px;
27 | background-color: transparent;
28 | }
29 |
30 | .apys-select-combo fieldset {
31 | border: 2px solid white;
32 | }
33 |
34 | .apys-select-combo fieldset:hover {
35 | border: 2px solid white;
36 | }
37 |
38 | .apys-select-combo input {
39 | color: white;
40 | }
41 |
42 | .value-slider .MuiSlider-root {
43 | width: calc(100% - 80px);
44 | }
45 |
46 | .value-slider .MuiButton-root {
47 | width: 64px;
48 | border: 1px solid;
49 | padding: 0;
50 | border-radius: 16px;
51 | font-size: 12px;
52 | font-weight: 700;
53 | }
54 |
55 | .value-slider .MuiButton-root:focus {
56 | outline: none;
57 | }
58 |
59 | .artist-value-slider .MuiSlider-root {
60 | color: #673ab7;
61 | }
62 |
63 | .artist-value-slider .MuiButton-root {
64 | color: #673ab7;
65 | }
66 |
67 | .artist-value-slider .MuiSlider-valueLabel {
68 | background-color: #673ab780;
69 | }
70 |
71 | .burn-value-slider .MuiSlider-root {
72 | color: #4caf50;
73 | }
74 |
75 | .burn-value-slider .MuiButton-root {
76 | color: #4caf50;
77 | }
78 |
79 | .burn-value-slider .MuiSlider-valueLabel {
80 | background-color: #4caf5080;
81 | }
82 |
83 | .charity-value-slider .MuiSlider-root {
84 | color: #ff9800;
85 | }
86 |
87 | .charity-value-slider .MuiButton-root {
88 | color: #ff9800;
89 | }
90 |
91 | .charity-value-slider .MuiSlider-valueLabel {
92 | background-color: #ff980080;
93 | }
94 |
95 | .my-value-slider .MuiSlider-root {
96 | color: #009688;
97 | }
98 |
99 | .my-value-slider .MuiButton-root {
100 | color: #009688;
101 | }
102 |
103 | .my-value-slider .MuiSlider-valueLabel {
104 | background-color: #00968880;
105 | }
106 |
107 | .value-slider p {
108 | color: grey;
109 | font-weight: 700;
110 | }
111 |
112 | .staking-panel svg {
113 | color: black;
114 | }
115 |
116 | .staking-panel p {
117 | color: black;
118 | }
119 |
120 | .amount-max-button {
121 | position: absolute;
122 | top: 100px;
123 | right: 10px;
124 | border-radius: 10px;
125 | margin: 0px;
126 | padding: 0px;
127 | font-size: 12px;
128 | color: white !important;
129 | }
130 |
131 | @keyframes rocketFly {
132 | 0% {
133 | -webkit-transform: translate3d(0%, 100vh, 0);
134 | transform: translate3d(0%, 100vh, 0);
135 | }
136 |
137 | 100% {
138 | -webkit-transform: translate3d(0, calc(-100vh - 250px), 0);
139 | transform: translate3d(0, calc(-100vh - 250px), 0);
140 | }
141 | }
142 |
143 | .stake-rocket {
144 | position: fixed;
145 | height: 250px;
146 | bottom: -250px;
147 | }
148 |
149 | .rocket-animation {
150 | -webkit-animation: rocketFly 5s linear infinite;
151 | animation: rocketFly 5s linear infinite;
152 | }
--------------------------------------------------------------------------------
/components/Layout/Layout.tsx:
--------------------------------------------------------------------------------
1 | import Head from 'next/head';
2 | import { useRouter } from 'next/router';
3 | import React, { useState, createContext, useContext, useEffect } from 'react'
4 | //top header
5 | import TopHeader from './TopHeader';
6 |
7 | //navbar
8 | import Navbar from './Navbar';
9 |
10 | //footer
11 | import Footer from './Footer';
12 |
13 | import ThemeContext from '../../contexts/ThemeContext'
14 | import useTheme from '../../hooks/useTheme'
15 | import styled from 'styled-components'
16 |
17 | const Wrapper = styled.div`
18 | background: ${props => {
19 | switch (props.slot) {
20 | case '/gFOTmodule':
21 | return !props.defaultChecked ? 'transparent' : `transparent`
22 | case '/fortisDungeon':
23 | return `var(--background-color)`
24 | case '/communitySale':
25 | return !props.defaultChecked
26 | ? `url('/images/MacBook Pro 14_ - 2.png')`
27 | : `transparent`
28 | default:
29 | return `transparent`
30 | }
31 | }};
32 | background-repeat: round;
33 | min-height: 100vh;
34 | display: flex;
35 | flex-direction: column;
36 | align-items: center;
37 | filter: ${props =>
38 | !props.defaultChecked && props.slot === '/sFOTVault'
39 | ? 'hue-rotate(240deg)'
40 | : !props.defaultChecked && props.slot === '/castleDex'
41 | ? 'hue-rotate(15deg)'
42 | : ''};
43 | `
44 | export const ToggleContext = createContext({
45 | toggle: false,
46 | setToggle: null,
47 | asset: 0,
48 | setAsset: null,
49 | page: 0,
50 | setPage: null,
51 | })
52 |
53 | const Layout = ({ children }) => {
54 | const router = useRouter();
55 | const { pathname } = router;
56 |
57 | const themeContext = useTheme('theme1')
58 |
59 | const [toggle, setToggle] = useState(false)
60 | const [page, setPage] = useState(0)
61 | const [asset, setAsset] = useState(0)
62 |
63 | useEffect(() => {
64 | let temp = localStorage.getItem('toggle')
65 | if (temp) {
66 | setToggle(JSON.parse(temp))
67 | }
68 | }, [])
69 |
70 | return (
71 | <>
72 |
67 |
101 |
68 | {display ? (
69 |
72 | {newData &&
73 | newData.length > 0 &&
74 | newData.slice(0, 20).map((data) => (
75 |
96 | ) : (
97 | ''
98 | )}
99 |
100 |
76 |
94 | ))}
95 | 77 | 78 | {data.name}/{data.symbol} 79 | 80 | {data.current_price} 81 | {data.price_change_percentage_24h < 0 ? ( 82 | 83 | - 84 | {data.price_change_percentage_24h.toFixed(2)}% 85 | 86 | ) : ( 87 | 88 | + 89 | {data.price_change_percentage_24h.toFixed(2)}% 90 | 91 | )} 92 |
93 |
57 |
104 |
105 | );
106 | };
107 |
108 | export default Admin;
109 |
--------------------------------------------------------------------------------
/components/Notification/element.tsx:
--------------------------------------------------------------------------------
1 | import styled from 'styled-components'
2 | import { useEffect } from 'react'
3 |
4 | interface ElementProps {
5 | type?: boolean
6 | defaultChecked?: boolean
7 | }
8 |
9 | const Wrapper = styled.div
58 |
102 |
103 |
59 |
101 |
60 |
67 |
61 |
62 | Treasury Amount
64 |
65 |
66 |
62 | Treasury Amount
{convertMicroDenomToDenom(config.treasury_amount)} JUNO
63 |
64 |
65 |
68 |
100 |
69 |
70 |
99 |
71 |
72 | {
79 | setFetchAmount(Number(e.target.value))
80 |
81 | }}
82 | error={fetchAmount==0}
83 | />
84 |
85 |
86 |
87 |
88 | Hole amount
73 | 74 |
89 |
90 |
91 |
92 |
93 |
98 |
265 | theme.zIndex.drawer + 1 }}
475 | open={loadingView}
476 | >
477 |
479 | {/* theme.zIndex.drawer + 1 }}
481 | open={lodingView}
482 | // onClick={hideLoading}
483 | >
484 | 
485 |
486 | theme.zIndex.drawer + 1 }}
488 | open={rocketView}
489 | // onClick={hideRocket}
490 | >
491 | 
492 | */}
493 |
495 |
496 | );
497 | };
498 |
499 | export default Flip;
500 |
--------------------------------------------------------------------------------
276 |
277 | 
278 |
279 |
303 |
278 |
279 |
284 |
285 |
291 | Drops
286 | 287 | 288 |Staking
289 | 290 |
292 |
293 | 
297 |
298 |
299 | 
300 |
301 |
302 |
297 |
298 |
299 |
300 |
301 |
305 |
473 |
306 |
472 |
307 |
330 |
331 |
341 |
471 |
342 | {
374 | setApyValue(newValue);
375 | }}
376 | sx={{ width: "100%" }}
377 | renderInput={(params) =>
402 |
409 |
343 |
344 |
366 |
367 | Hole staking amount
345 | { 351 | setLevel(event.target.value.toString()) 352 | }} 353 | style={{ 354 | marginTop: "50px", 355 | width: "100%", 356 | backgroundColor: "transparent", 357 | borderRadius: "32px", 358 | height: "48px", 359 | fontSize: "18px", 360 | padding: "5px 20px", 361 | color: "grey" 362 | }} 363 | /> 364 | 365 |
380 |
389 |
390 |
391 |
400 |
401 |
410 |
470 |
411 |
422 | Artist Wallet :
412 |
418 | onChangeSliderValue(value, 1)} />
419 |
420 |
421 |
423 |
434 | Burn Wallet :
424 |
430 | onChangeSliderValue(value, 2)} />
431 |
432 |
433 |
435 |
446 | Charity Wallet :
436 |
442 | onChangeSliderValue(value, 3)} />
443 |
444 |
445 |
447 |
458 | My Wallet :
448 |
454 | onChangeSliderValue(value, 4)} />
455 |
456 |
457 |
459 |
468 |
469 |
485 |
492 |