mirror
/
moonstream
kopia lustrzana https://github.com/bugout-dev/moonstream
1
0
Forkuj 0
Kod Zgłoszenia Projekty Wydania Wiki Aktywność

useQuery for Status page

pull/298/head
kompotkot 2021-10-06 14:40:31 +00:00
rodzic 1534230b75
commit 1b1169882e
6 zmienionych plików z 14464 dodań i 152 usunięć
Pokaż statystyki Ściągnij plik aktualizacji Ściągnij plik porównania Expand all files Collapse all files

14328
frontend/package-lock.json wygenerowano 100644
Wyświetl plik

Plik diff jest za duży Load Diff

65
frontend/pages/status/index.js
Wyświetl plik

@ -30,18 +30,12 @@ const Status = () => {
};
const {
apiServerStatus,
apiServerData,
crawlersServerStatus,
crawlersServerData,
gethStatus,
gethData,
crawlersStatus,
crawlersData,
dbServerStatus,
dbServerData,
latestBlockDBStatus,
latestBlockDBData,
apiServerStatusCache,
ethereumClusterServerStatusCache,
gethStatusCache,
crawlersStatusCache,
dbServerStatusCache,
latestBlockDBStatusCache,
} = useStatus();
const [background, setBackground] = useState("background720");
@ -63,13 +57,6 @@ const Status = () => {
]);
useEffect(() => {
apiServerStatus();
crawlersServerStatus();
crawlersStatus();
gethStatus();
dbServerStatus();
latestBlockDBStatus();
assets[
"background720"
] = `${AWS_ASSETS_PATH}/product-background-720x405.png`;
@ -175,12 +162,14 @@ const Status = () => {
<Spacer />
<Text
color={
apiServerData?.data?.status == "ok"
!apiServerStatusCache.isLoading &&
apiServerStatusCache?.data?.status == "ok"
? healthyStatusColor
: downStatusColor
}
>
{apiServerData?.data?.status == "ok"
{!apiServerStatusCache.isLoading &&
apiServerStatusCache?.data?.status == "ok"
? healthyStatusText
: downStatusText}
</Text>
@ -191,12 +180,14 @@ const Status = () => {
<Spacer />
<Text
color={
crawlersServerData?.data?.status == "ok"
!ethereumClusterServerStatusCache.isLoading &&
ethereumClusterServerStatusCache?.data?.status == "ok"
? healthyStatusColor
: downStatusColor
}
>
{crawlersServerData?.data?.status == "ok"
{!ethereumClusterServerStatusCache.isLoading &&
ethereumClusterServerStatusCache?.data
? healthyStatusText
: downStatusText}
</Text>
@ -205,15 +196,21 @@ const Status = () => {
<Text>Latest block in Geth</Text>
<Spacer />
<Text>
{gethData?.data?.current_block ? gethData.data.current_block : 0}
{!gethStatusCache.isLoading &&
gethStatusCache?.data?.current_block
? gethStatusCache.data.current_block
: 0}
</Text>
</Flex>
<Flex mb={3}>
<Text>Txpool latest record ts</Text>
<Spacer />
<Text>
{crawlersData?.data?.ethereum_txpool_timestamp
? shortTimestamp(crawlersData?.data?.ethereum_txpool_timestamp)
{!crawlersStatusCache.isLoading &&
crawlersStatusCache?.data?.ethereum_txpool_timestamp
? shortTimestamp(
crawlersStatusCache?.data?.ethereum_txpool_timestamp
)
: downStatusText}
</Text>
</Flex>
@ -221,9 +218,10 @@ const Status = () => {
<Text>Trending latest record ts</Text>
<Spacer />
<Text>
{crawlersData?.data?.ethereum_trending_timestamp
{!crawlersStatusCache.isLoading &&
crawlersStatusCache?.data?.ethereum_trending_timestamp
? shortTimestamp(
crawlersData?.data?.ethereum_trending_timestamp
crawlersStatusCache?.data?.ethereum_trending_timestamp
)
: downStatusText}
</Text>
@ -234,12 +232,14 @@ const Status = () => {
<Spacer />
<Text
color={
dbServerData?.data?.status == "ok"
!dbServerStatusCache.isLoading &&
dbServerStatusCache?.data?.status == "ok"
? healthyStatusColor
: downStatusColor
}
>
{dbServerData?.data?.status == "ok"
{!dbServerStatusCache.isLoading &&
dbServerStatusCache?.data?.status == "ok"
? healthyStatusText
: downStatusText}
</Text>
@ -248,8 +248,9 @@ const Status = () => {
<Text>Latest block in Database</Text>
<Spacer />
<Text>
{latestBlockDBData?.data?.block_number
? latestBlockDBData.data.block_number
{!latestBlockDBStatusCache.isLoading &&
latestBlockDBStatusCache?.data?.block_number
? latestBlockDBStatusCache.data.block_number
: 0}
</Text>
</Flex>

129
frontend/src/core/hooks/useStatus.js
Wyświetl plik

@ -1,90 +1,67 @@
import { useMutation } from "react-query";
import { useToast } from "./";
import { AuthService } from "../../core/services";
import { useQuery } from "react-query";
import { queryCacheProps } from "./hookCommon";
import { StatusService } from "../../core/services";
const useStatus = () => {
const toast = useToast();
const getAPIServerStatus = async () => {
const response = await StatusService.apiServerStatus();
return response.data;
};
const getEthereumClusterServerStatus = async () => {
const response = await StatusService.ethereumClusterServerStatus();
return response.data;
};
const getGethStatus = async () => {
const response = await StatusService.gethStatus();
return response.data;
};
const getCrawlersStatus = async () => {
const response = await StatusService.crawlersStatus();
return response.data;
};
const getDBServerStatus = async () => {
const response = await StatusService.dbServerStatus();
return response.data;
};
const getLatestBlockDBStatus = async () => {
const response = await StatusService.latestBlockDBStatus();
return response.data;
};
const { mutate: apiServerStatus, data: apiServerData } = useMutation(
AuthService.apiServerStatus,
const apiServerStatusCache = useQuery("apiServer", getAPIServerStatus, {
...queryCacheProps,
});
const ethereumClusterServerStatusCache = useQuery(
"ethereumClusterServer",
getEthereumClusterServerStatus,
{
onError: (error) => {
// toast(error, "error");
},
onSuccess: () => {
// toast("Status received", "success");
},
...queryCacheProps,
}
);
const { mutate: crawlersServerStatus, data: crawlersServerData } =
useMutation(AuthService.crawlersServerStatus, {
onError: (error) => {
// toast(error, "error");
},
onSuccess: () => {
// toast("Status received", "success");
},
});
const { mutate: gethStatus, data: gethData } = useMutation(
AuthService.gethStatus,
const gethStatusCache = useQuery("geth", getGethStatus, {
...queryCacheProps,
});
const crawlersStatusCache = useQuery("crawlers", getCrawlersStatus, {
...queryCacheProps,
});
const dbServerStatusCache = useQuery("dbServer", getDBServerStatus, {
...queryCacheProps,
});
const latestBlockDBStatusCache = useQuery(
"latestBlockDB",
getLatestBlockDBStatus,
{
onError: (error) => {
// toast(error, "error");
},
onSuccess: () => {
// toast("Status received", "success");
},
}
);
const { mutate: crawlersStatus, data: crawlersData } = useMutation(
AuthService.crawlersStatus,
{
onError: (error) => {
// toast(error, "error");
},
onSuccess: () => {
// toast("Status received", "success");
},
}
);
const { mutate: dbServerStatus, data: dbServerData } = useMutation(
AuthService.dbServerStatus,
{
onError: (error) => {
// toast(error, "error");
},
onSuccess: () => {
// toast("Status received", "success");
},
}
);
const { mutate: latestBlockDBStatus, data: latestBlockDBData } = useMutation(
AuthService.latestBlockDBStatus,
{
onError: (error) => {
// toast(error, "error");
},
onSuccess: () => {
// toast("Status received", "success");
},
...queryCacheProps,
}
);
return {
apiServerStatus,
apiServerData,
crawlersServerStatus,
crawlersServerData,
gethStatus,
gethData,
crawlersStatus,
crawlersData,
dbServerStatus,
dbServerData,
latestBlockDBStatus,
latestBlockDBData,
apiServerStatusCache,
ethereumClusterServerStatusCache,
gethStatusCache,
crawlersStatusCache,
dbServerStatusCache,
latestBlockDBStatusCache,
};
};

44
frontend/src/core/services/auth.service.js
Wyświetl plik

@ -1,8 +1,6 @@
import { http } from "../utils";
const API_URL = process.env.NEXT_PUBLIC_MOONSTREAM_API_URL;
const DB_URL = process.env.NEXT_PUBLIC_MOONSTREAM_DB_URL;
const CRAWLERS_URL = process.env.NEXT_PUBLIC_MOONSTREAM_ETHEREUM_CLUSTER_URL;
export const AUTH_URL = `${API_URL}/users`;
export const login = ({ username, password, token_note }) => {
@ -103,45 +101,3 @@ export const revokeToken = (token) => {
url: `${AUTH_URL}/revoke/${token}`,
});
};
export const apiServerStatus = () => {
return http({
method: "GET",
url: `${API_URL}/ping`,
});
};
export const crawlersServerStatus = () => {
return http({
method: "GET",
url: `${CRAWLERS_URL}/ping`,
});
};
export const gethStatus = () => {
return http({
method: "GET",
url: `${CRAWLERS_URL}/status`,
});
};
export const crawlersStatus = () => {
return http({
method: "GET",
url: `${API_URL}/status`,
});
};
export const dbServerStatus = () => {
return http({
method: "GET",
url: `${DB_URL}/ping`,
});
};
export const latestBlockDBStatus = () => {
return http({
method: "GET",
url: `${DB_URL}/block/latest`,
});
};

2
frontend/src/core/services/index.js
Wyświetl plik

@ -6,6 +6,7 @@ import * as GroupService from "./group.service";
import * as PreferencesService from "./preferences.service";
import * as HumbugService from "./humbug.service";
import * as InvitesService from "./invites.service";
import * as StatusService from "./status.service";
import * as SubscriptionsService from "./subscriptions.service";
import * as StreamService from "./stream.service";
import * as TxInfoService from "./txinfo.service";
@ -18,6 +19,7 @@ export {
PreferencesService,
HumbugService,
InvitesService,
StatusService,
SubscriptionsService,
StreamService,
TxInfoService,

48
frontend/src/core/services/status.service.js 100644
Wyświetl plik

@ -0,0 +1,48 @@
import { http } from "../utils";
const API_URL = process.env.NEXT_PUBLIC_MOONSTREAM_API_URL;
const DB_URL = process.env.NEXT_PUBLIC_MOONSTREAM_DB_URL;
const ETHEREUM_CLUSTER_URL =
process.env.NEXT_PUBLIC_MOONSTREAM_ETHEREUM_CLUSTER_URL;
export const apiServerStatus = () => {
return http({
method: "GET",
url: `${API_URL}/ping`,
});
};
export const ethereumClusterServerStatus = () => {
return http({
method: "GET",
url: `${ETHEREUM_CLUSTER_URL}/ping`,
});
};
export const gethStatus = () => {
return http({
method: "GET",
url: `${ETHEREUM_CLUSTER_URL}/status`,
});
};
export const crawlersStatus = () => {
return http({
method: "GET",
url: `${API_URL}/status`,
});
};
export const dbServerStatus = () => {
return http({
method: "GET",
url: `${DB_URL}/ping`,
});
};
export const latestBlockDBStatus = () => {
return http({
method: "GET",
url: `${DB_URL}/block/latest`,
});
};