From 61155a1bb74152e990c5110adb777da5c33fb1d1 Mon Sep 17 00:00:00 2001
From: Roza Eisenberg <45665959+rozanagy@users.noreply.github.com>
Date: Wed, 6 Mar 2024 15:21:16 +0100
Subject: [PATCH] feat: create initial por page with mock function (#51)
* feat: create initial por page with mock function
---
src/app/app.tsx | 2 ++
.../protocol-summary-stack.tsx | 3 +-
.../transaction-form/transaction-form.tsx | 2 +-
.../components/walkthrough/walkthrough.tsx | 3 +-
.../components/proof-of-reserve-layout.tsx | 10 +++++++
.../proof-of-reserve/proof-of-reserve.tsx | 30 +++++++++++++++++++
.../vaults-list-group-container.tsx | 1 -
.../proof-of-reserve-page.tsx | 10 +++++++
.../providers/balance-context-provider.tsx | 2 +-
src/app/providers/vault-context-provider.tsx | 3 +-
10 files changed, 57 insertions(+), 9 deletions(-)
create mode 100644 src/app/components/proof-of-reserve/components/proof-of-reserve-layout.tsx
create mode 100644 src/app/components/proof-of-reserve/proof-of-reserve.tsx
create mode 100644 src/app/pages/proof-of-reserve/proof-of-reserve-page.tsx
diff --git a/src/app/app.tsx b/src/app/app.tsx
index 308339b6..b7c2b576 100644
--- a/src/app/app.tsx
+++ b/src/app/app.tsx
@@ -2,6 +2,7 @@ import { Route } from 'react-router-dom';
import { AppLayout } from '@components/app.layout';
import { MyVaults } from '@pages/my-vaults/my-vaults';
+import { ProofOfReservePage } from '@pages/proof-of-reserve/proof-of-reserve-page';
import { BalanceContextProvider } from '@providers/balance-context-provider';
import { About } from './pages/about/about';
@@ -18,6 +19,7 @@ export function App(): React.JSX.Element {
} />
} />
} />
+ } />
diff --git a/src/app/components/mint-unmint/components/protocol-summary-stack/protocol-summary-stack.tsx b/src/app/components/mint-unmint/components/protocol-summary-stack/protocol-summary-stack.tsx
index 2641abcb..9d6495b5 100644
--- a/src/app/components/mint-unmint/components/protocol-summary-stack/protocol-summary-stack.tsx
+++ b/src/app/components/mint-unmint/components/protocol-summary-stack/protocol-summary-stack.tsx
@@ -1,8 +1,7 @@
// import { ProtocolHistory } from "@components/protocol-history/protocol-history";
-
import { Skeleton, Text, VStack } from '@chakra-ui/react';
-
import { useBlockchainContext } from '@hooks/use-blockchain-context';
+
import { ProtocolSummaryStackLayout } from './components/protocol-summary-stack.layout';
export function ProtocolSummaryStack(): React.JSX.Element {
diff --git a/src/app/components/mint-unmint/components/transaction-form/transaction-form.tsx b/src/app/components/mint-unmint/components/transaction-form/transaction-form.tsx
index 73d639c9..4309beae 100644
--- a/src/app/components/mint-unmint/components/transaction-form/transaction-form.tsx
+++ b/src/app/components/mint-unmint/components/transaction-form/transaction-form.tsx
@@ -2,10 +2,10 @@ import { useState } from 'react';
import { Button, FormControl, FormErrorMessage, Text, VStack, useToast } from '@chakra-ui/react';
import { customShiftValue } from '@common/utilities';
+import { useBlockchainContext } from '@hooks/use-blockchain-context';
import { EthereumError } from '@models/error-types';
import { Form, Formik } from 'formik';
-import { useBlockchainContext } from '@hooks/use-blockchain-context';
import { TransactionFormInput } from './components/transaction-form-input';
import { TransactionFormWarning } from './components/transaction-form-warning';
diff --git a/src/app/components/mint-unmint/components/walkthrough/walkthrough.tsx b/src/app/components/mint-unmint/components/walkthrough/walkthrough.tsx
index 0a12db82..77c748b5 100644
--- a/src/app/components/mint-unmint/components/walkthrough/walkthrough.tsx
+++ b/src/app/components/mint-unmint/components/walkthrough/walkthrough.tsx
@@ -1,8 +1,7 @@
-
import { Button, HStack, Image, Link, Text } from '@chakra-ui/react';
import { TutorialVideo } from '@components/tutorial-video/tutorial-video';
-
import { useBlockchainContext } from '@hooks/use-blockchain-context';
+
import { WalkthroughHeader } from './components/walkthrough-header';
import { WalkthroughLayout } from './components/walkthrough.layout';
diff --git a/src/app/components/proof-of-reserve/components/proof-of-reserve-layout.tsx b/src/app/components/proof-of-reserve/components/proof-of-reserve-layout.tsx
new file mode 100644
index 00000000..679d16e5
--- /dev/null
+++ b/src/app/components/proof-of-reserve/components/proof-of-reserve-layout.tsx
@@ -0,0 +1,10 @@
+import { CustomCard } from '@components/how-it-works/components/custom-card';
+import { HasChildren } from '@models/has-children';
+
+export function ProofOfReserveLayout({ children }: HasChildren): React.JSX.Element {
+ return (
+
+ {children}
+
+ );
+}
diff --git a/src/app/components/proof-of-reserve/proof-of-reserve.tsx b/src/app/components/proof-of-reserve/proof-of-reserve.tsx
new file mode 100644
index 00000000..ae6151b9
--- /dev/null
+++ b/src/app/components/proof-of-reserve/proof-of-reserve.tsx
@@ -0,0 +1,30 @@
+import { useEffect, useState } from 'react';
+
+import { Text, VStack } from '@chakra-ui/react';
+
+import { ProofOfReserveLayout } from './components/proof-of-reserve-layout';
+
+export function ProofOfReserve(): React.JSX.Element {
+ const [content, setContent] = useState('');
+
+ useEffect(() => {
+ fetch('http://localhost:8811/get-proof-of-reserve')
+ .then(response => response.json())
+ .then(data => {
+ setContent(data);
+ })
+ .catch(error => {
+ console.error('Error fetching data:', error);
+ });
+ }, []);
+ return (
+
+ {
+
+ BTC Reserve
+ {content}
+
+ }
+
+ );
+}
diff --git a/src/app/components/vaults-list/components/vaults-list-group-container.tsx b/src/app/components/vaults-list/components/vaults-list-group-container.tsx
index 90343561..f0e5a7c0 100644
--- a/src/app/components/vaults-list/components/vaults-list-group-container.tsx
+++ b/src/app/components/vaults-list/components/vaults-list-group-container.tsx
@@ -1,4 +1,3 @@
-
import { Button, HStack, Image, Spinner, Text, VStack } from '@chakra-ui/react';
import { VaultCard } from '@components/vault/vault-card';
import { useBlockchainContext } from '@hooks/use-blockchain-context';
diff --git a/src/app/pages/proof-of-reserve/proof-of-reserve-page.tsx b/src/app/pages/proof-of-reserve/proof-of-reserve-page.tsx
new file mode 100644
index 00000000..69db701b
--- /dev/null
+++ b/src/app/pages/proof-of-reserve/proof-of-reserve-page.tsx
@@ -0,0 +1,10 @@
+import { ProofOfReserve } from '@components/proof-of-reserve/proof-of-reserve';
+import { PageLayout } from '@pages/components/page.layout';
+
+export function ProofOfReservePage(): React.JSX.Element {
+ return (
+
+
+
+ );
+}
diff --git a/src/app/providers/balance-context-provider.tsx b/src/app/providers/balance-context-provider.tsx
index f39457e1..06251f97 100644
--- a/src/app/providers/balance-context-provider.tsx
+++ b/src/app/providers/balance-context-provider.tsx
@@ -1,10 +1,10 @@
import { createContext, useContext, useEffect, useState } from 'react';
import { useSelector } from 'react-redux';
+import { useBlockchainContext } from '@hooks/use-blockchain-context';
import { HasChildren } from '@models/has-children';
import { RootState } from '@store/index';
-import { useBlockchainContext } from '@hooks/use-blockchain-context';
import { VaultContext } from './vault-context-provider';
interface VaultContextType {
diff --git a/src/app/providers/vault-context-provider.tsx b/src/app/providers/vault-context-provider.tsx
index 326bc186..a0174733 100644
--- a/src/app/providers/vault-context-provider.tsx
+++ b/src/app/providers/vault-context-provider.tsx
@@ -1,10 +1,9 @@
import { createContext } from 'react';
+import { useBlockchainContext } from '@hooks/use-blockchain-context';
import { UseVaultsReturnType, useVaults } from '@hooks/use-vaults';
import { HasChildren } from '@models/has-children';
-import { useBlockchainContext } from '@hooks/use-blockchain-context';
-
interface VaultContextType {
vaults: UseVaultsReturnType;
}