structure fix
This commit is contained in:
parent
63612d6cae
commit
d20b331242
7 changed files with 74 additions and 106 deletions
|
|
@ -1,87 +0,0 @@
|
|||
import styles from "@/styles/Blockchain.module.scss";
|
||||
import Header from "@/components/default/Header/Header";
|
||||
import StatsPanel from "@/components/default/StatsPanel/StatsPanel";
|
||||
import InfoTopPanel from "@/components/default/InfoTopPanel/InfoTopPanel";
|
||||
import LatestBlocks from "./components/LatestBlocks/LatestBlocks";
|
||||
import TransactionPool, { PoolElement } from "./components/TransactionPool/TransactionPool";
|
||||
import { useEffect, useState } from "react";
|
||||
import Fetch from "@/utils/methods";
|
||||
import VisibilityInfo from "@/interfaces/state/VisibilityInfo";
|
||||
import Info from "@/interfaces/state/Info";
|
||||
import Block from "@/interfaces/state/Block";
|
||||
|
||||
function Blockchain({
|
||||
fetchedVisibilityInfo,
|
||||
fetchedIsOnline,
|
||||
fetchedInfo,
|
||||
fetchedLatestBlocks,
|
||||
fetchedTxPoolElements,
|
||||
}: {
|
||||
fetchedVisibilityInfo: VisibilityInfo | null,
|
||||
fetchedInfo: Info | null,
|
||||
fetchedIsOnline: boolean,
|
||||
fetchedLatestBlocks: Block[],
|
||||
fetchedTxPoolElements: PoolElement[],
|
||||
}) {
|
||||
const [burgerOpened, setBurgerOpened] = useState(false);
|
||||
|
||||
const [visibilityInfo, setVisibilityInfo] = useState<VisibilityInfo | null>(fetchedVisibilityInfo);
|
||||
const [isOnline, setIsOnline] = useState(fetchedIsOnline);
|
||||
|
||||
useEffect(() => {
|
||||
async function fetchVisibilityInfo() {
|
||||
const result = await Fetch.getVisibilityInfo();
|
||||
if (result.success === false) return;
|
||||
setVisibilityInfo(result);
|
||||
}
|
||||
|
||||
async function checkOnline() {
|
||||
try {
|
||||
const result = await Fetch.getInfo();
|
||||
if (result.status === "OK") {
|
||||
setIsOnline(true);
|
||||
} else {
|
||||
setIsOnline(false);
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
setIsOnline(false);
|
||||
}
|
||||
}
|
||||
|
||||
fetchVisibilityInfo();
|
||||
const interval = setInterval(checkOnline, 5000);
|
||||
return () => clearInterval(interval);
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div className={styles["blockchain"]}>
|
||||
<Header
|
||||
page="Blockchain"
|
||||
burgerOpened={burgerOpened}
|
||||
setBurgerOpened={setBurgerOpened}
|
||||
/>
|
||||
<InfoTopPanel
|
||||
burgerOpened={burgerOpened}
|
||||
title="Blockchain"
|
||||
content={
|
||||
<div className={styles["info__top__daemon"]}>
|
||||
<p>Daemon state: {isOnline ? 'Online' : 'Offline'}</p>
|
||||
<p>Default network fee: 0,01</p>
|
||||
<p>Minimum network fee: 0,01</p>
|
||||
</div>
|
||||
}
|
||||
/>
|
||||
<StatsPanel visibilityInfo={visibilityInfo} fetchedInfo={fetchedInfo} />
|
||||
<LatestBlocks
|
||||
fetchedLatestBlocks={fetchedLatestBlocks}
|
||||
fetchedInfo={fetchedInfo}
|
||||
/>
|
||||
<TransactionPool
|
||||
fetchedTxPoolElements={fetchedTxPoolElements}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default Blockchain;
|
||||
|
|
@ -1,11 +1,16 @@
|
|||
import Blockchain from './Blockchain/index';
|
||||
import { GetServerSideProps } from 'next'
|
||||
import VisibilityInfo from '@/interfaces/state/VisibilityInfo';
|
||||
import Info from '@/interfaces/state/Info';
|
||||
import Block from '@/interfaces/state/Block';
|
||||
import { PoolElement } from './Blockchain/components/TransactionPool/TransactionPool';
|
||||
import { getMainPageProps } from '@/utils/ssr';
|
||||
|
||||
import styles from "@/styles/Blockchain.module.scss";
|
||||
import Header from "@/components/default/Header/Header";
|
||||
import StatsPanel from "@/components/default/StatsPanel/StatsPanel";
|
||||
import InfoTopPanel from "@/components/default/InfoTopPanel/InfoTopPanel";
|
||||
import LatestBlocks from "@/components/default/LatestBlocks/LatestBlocks";
|
||||
import TransactionPool, { PoolElement } from "@/components/default/TransactionPool/TransactionPool";
|
||||
import { useEffect, useState } from "react";
|
||||
import Fetch from "@/utils/methods";
|
||||
import VisibilityInfo from "@/interfaces/state/VisibilityInfo";
|
||||
import Info from "@/interfaces/state/Info";
|
||||
import Block from "@/interfaces/state/Block";
|
||||
import { GetServerSideProps } from "next";
|
||||
import { getMainPageProps } from "@/utils/ssr";
|
||||
export interface MainPageProps {
|
||||
visibilityInfo: VisibilityInfo | null;
|
||||
isOnline: boolean;
|
||||
|
|
@ -14,16 +19,66 @@ export interface MainPageProps {
|
|||
txPoolElements: PoolElement[]
|
||||
}
|
||||
|
||||
function MainPage({ visibilityInfo, isOnline, info, latestBlocks, txPoolElements }: MainPageProps) {
|
||||
function MainPage({ visibilityInfo: fetchedVisibilityInfo, isOnline: fetchedIsOnline, info, latestBlocks, txPoolElements }: MainPageProps) {
|
||||
const [burgerOpened, setBurgerOpened] = useState(false);
|
||||
|
||||
const [visibilityInfo, setVisibilityInfo] = useState<VisibilityInfo | null>(fetchedVisibilityInfo);
|
||||
const [isOnline, setIsOnline] = useState(fetchedIsOnline);
|
||||
|
||||
useEffect(() => {
|
||||
async function fetchVisibilityInfo() {
|
||||
const result = await Fetch.getVisibilityInfo();
|
||||
if (result.success === false) return;
|
||||
setVisibilityInfo(result);
|
||||
}
|
||||
|
||||
async function checkOnline() {
|
||||
try {
|
||||
const result = await Fetch.getInfo();
|
||||
if (result.status === "OK") {
|
||||
setIsOnline(true);
|
||||
} else {
|
||||
setIsOnline(false);
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
setIsOnline(false);
|
||||
}
|
||||
}
|
||||
|
||||
fetchVisibilityInfo();
|
||||
const interval = setInterval(checkOnline, 5000);
|
||||
return () => clearInterval(interval);
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<Blockchain
|
||||
fetchedVisibilityInfo={visibilityInfo}
|
||||
fetchedIsOnline={isOnline}
|
||||
fetchedInfo={info}
|
||||
fetchedLatestBlocks={latestBlocks}
|
||||
fetchedTxPoolElements={txPoolElements}
|
||||
/>
|
||||
);
|
||||
<div className={styles["blockchain"]}>
|
||||
<Header
|
||||
page="Blockchain"
|
||||
burgerOpened={burgerOpened}
|
||||
setBurgerOpened={setBurgerOpened}
|
||||
/>
|
||||
<InfoTopPanel
|
||||
burgerOpened={burgerOpened}
|
||||
title="Blockchain"
|
||||
content={
|
||||
<div className={styles["info__top__daemon"]}>
|
||||
<p>Daemon state: {isOnline ? 'Online' : 'Offline'}</p>
|
||||
<p>Default network fee: 0,01</p>
|
||||
<p>Minimum network fee: 0,01</p>
|
||||
</div>
|
||||
}
|
||||
/>
|
||||
<StatsPanel visibilityInfo={visibilityInfo} fetchedInfo={info} />
|
||||
<LatestBlocks
|
||||
fetchedLatestBlocks={latestBlocks}
|
||||
fetchedInfo={info}
|
||||
/>
|
||||
<TransactionPool
|
||||
fetchedTxPoolElements={txPoolElements}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const getServerSideProps: GetServerSideProps = getMainPageProps;
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
import VisibilityInfo from "@/interfaces/state/VisibilityInfo";
|
||||
import Fetch from "./methods";
|
||||
import Block from "@/interfaces/state/Block";
|
||||
import { PoolElement } from "@/pages/Blockchain/components/TransactionPool/TransactionPool";
|
||||
import { PoolElement } from "@/components/default/TransactionPool/TransactionPool";
|
||||
import Info from "@/interfaces/state/Info";
|
||||
import { latestBlocksInitState } from "@/pages/Blockchain/components/LatestBlocks/LatestBlocks";
|
||||
import { latestBlocksInitState } from "@/components/default/LatestBlocks/LatestBlocks";
|
||||
import Utils from "./utils";
|
||||
import { DEFAULT_ITEMS_ON_PAGE } from "@/pages/aliases";
|
||||
import { DEFAULT_ASSETS_ON_PAGE } from "@/pages/assets";
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue