+
+
+
+ 
+
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/src/Home.tsx b/src/Home.tsx
new file mode 100644
index 0000000..1c477b0
--- /dev/null
+++ b/src/Home.tsx
@@ -0,0 +1,180 @@
+import React, { useState } from 'react';
+import {
+ Content,
+ Container,
+ Form,
+ Section,
+ Heading,
+ Tile,
+ Notification,
+ Button,
+} from 'react-bulma-components';
+import api from './api.ts';
+
+interface NetItem {
+ title: string
+ containerId: string
+}
+
+interface FormData {
+ spanStart: number | ''
+ spanEnd: number | ''
+ network: number
+}
+
+const Home = ({
+ onModal,
+ nets,
+ setArchive,
+ setProgress,
+ isLoading,
+ setLoading,
+}) => {
+ const [formData, setFormData] = useState({
+ spanStart: '',
+ spanEnd: '',
+ network: 0,
+ });
+
+ const roundNumber = (num: number): number => {
+ const rounded = num.toFixed(2);
+ return parseFloat(rounded) % 1 === 0 ? parseInt(rounded) : parseFloat(rounded);
+ };
+
+ const fetchBlocksInRange = async () => {
+ if (formData.spanStart === '' || formData.spanStart < 0 || formData.spanEnd === '' || formData.spanEnd < 0) return onModal('failed', 'Insert correct data');
+
+ onModal('loading', formData);
+ setLoading(true);
+ const currentNet: NetItem = nets[formData.network];
+ let archiveData: Uint8Array[] = [];
+
+ for (let block = formData.spanStart; block <= formData.spanEnd; block++) {
+ const objectId: Uint8Array | string = await fetchBlock(currentNet, block);
+ if (typeof objectId === 'string') {
+ onModal('failed', objectId);
+ return
+ }
+ archiveData.push(objectId);
+ setProgress(roundNumber(((block - formData.spanStart + 1) / (formData.spanEnd - formData.spanStart + 1)) * 100));
+ }
+
+ setArchive(archiveData);
+ setLoading(false);
+ };
+
+ const fetchBlock = async (currentNet: NetItem, blockNumber: number): Promise => {
+ try {
+ const searchResponse: any = await api('POST', `/objects/${currentNet.containerId}/search?walletConnect=false&offset=0&limit=1`, {
+ filters: [{
+ "key": "Block",
+ "match": "MatchStringEqual",
+ "value": blockNumber.toString(),
+ }],
+ });
+
+ const objectId = searchResponse.objects[0]?.address.objectId;
+ if (!objectId) {
+ return `Error: Object not found for block #${blockNumber}`;
+ }
+
+ const blockResponse = await api('GET', `/objects/${currentNet.containerId}/by_id/${objectId}?walletConnect=false`);
+ return blockResponse as Uint8Array;
+ } catch (err: any) {
+ return `Error loading block #${blockNumber}: ${err.message}`;
+ }
+ };
+
+ return (
+
+
+
+
+
+ Archive.NeoFS – Download Blockchain Data Snapshot
+
+
+
+
+
+
+
+
+
+
+ {
+ if (e.target.value === '' || /^[0-9]*[.]?[0-9]*$/.test(e.target.value)) {
+ setFormData({ ...formData, spanStart: e.target.value >= 0 ? e.target.value : '' });
+ }
+ }}
+ disabled={isLoading}
+ />
+
+
+ {
+ if (e.target.value === '' || /^[0-9]*[.]?[0-9]*$/.test(e.target.value)) {
+ setFormData({ ...formData, spanEnd: e.target.value >= 0 ? e.target.value : '' });
+ }
+ }}
+ disabled={isLoading}
+ />
+
+
+
+
+ setFormData({ ...formData, network: Number(e.target.value) })}
+ value={formData.network}
+ disabled={isLoading}
+ >
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+}
+
+export default Home;
diff --git a/src/NotFound.tsx b/src/NotFound.tsx
new file mode 100644
index 0000000..b1f393d
--- /dev/null
+++ b/src/NotFound.tsx
@@ -0,0 +1,35 @@
+import React from 'react';
+import {
+ Container,
+ Section,
+ Heading,
+ Tile,
+ Notification,
+ Button,
+} from 'react-bulma-components';
+
+const NotFound = () => {
+ return (
+
+
+
+
+
+ 404 Not Found
+ Page not found
+
+
+
+
+
+
+
+
+ );
+};
+
+export default NotFound;
diff --git a/src/api.ts b/src/api.ts
new file mode 100644
index 0000000..f697779
--- /dev/null
+++ b/src/api.ts
@@ -0,0 +1,48 @@
+const server = 'https://rest.fs.neo.org/v1';
+
+type Methods = "GET" | "POST";
+
+async function serverRequest(method: Methods, url: string, params: object, headers: any) {
+ const json: any = {
+ method,
+ headers,
+ }
+
+ if (json['headers']['Content-Type']) {
+ json['body'] = params;
+ } else if (Object.keys(params).length > 0) {
+ json['body'] = JSON.stringify(params);
+ json['headers']['Content-Type'] = 'application/json';
+ }
+
+ let activeUrl: string = url;
+ if (server) {
+ activeUrl = `${server}${url}`;
+ }
+
+ return fetch(activeUrl, json).catch((error: any) => {
+ console.log(error);
+ });
+}
+
+export default function api(method: Methods, url: string, params: object = {}, headers: object = {}) {
+ return new Promise((resolve, reject) => {
+ serverRequest(method, url, params, headers).then(async (response: any) => {
+ if (response && response.status === 204) {
+ resolve({ status: 'success' });
+ } else {
+ let res: any = response;
+ if (response.status === 200 && url.indexOf('by_id') !== -1) {
+ res = await response.arrayBuffer();
+ resolve(res);
+ } else if (response.status === 200) {
+ res = await response.json();
+ resolve(res);
+ } else {
+ res = await response.json();
+ reject(res);
+ }
+ }
+ });
+ });
+}
diff --git a/src/index.tsx b/src/index.tsx
new file mode 100644
index 0000000..6302304
--- /dev/null
+++ b/src/index.tsx
@@ -0,0 +1,13 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import { App } from './App.tsx';
+import { BrowserRouter } from "react-router-dom";
+
+ReactDOM.render(
+
+
+
+ ,
+ document.getElementById('root')
+);
onModal()}
+ />
+
+ )}
+ {modal.current === 'loading' && (
+
+ {modal.current === 'success' ? 'Success' : 'Failed'}
+
+ onModal()}
+ >
+ 
+
+
+ {modal.params}
+
+
+ )}
+
+ Loading
+ {`Snapshot: ${modal.params.spanStart} - ${modal.params.spanEnd} (${nets[modal.params.network].title})`}
+
+ {`Progress: ${progress}%`}
+
+
+
+
+
+ Easily download an offline package of blockchain data up to a specific block height.
+Manual steps:
+-
+
- Choose
startandendsnapshot option for the data range;
+ - Select the desired
network;
+ - Click the Download button; +
- Wait for the full blockchain data to prepared; +
- Download the
.accfile to your device. 🚀
+