wallet-porfolio

src/common/api/hive-engine.ts

@@ -165,12 +165,7 @@ export const getMetrics: any = async (symbol?: any, account?: any) => {
     },
     id: 1
   };
-
-  // const result = await axios
-  //     .post(HIVE_ENGINE_RPC_URL, data, {
-  //       headers: { "Content-type": "application/json" }
-  //     })
-  //     return result;
+
   return axios
     .post(HIVE_ENGINE_RPC_URL, data, {
       headers: { "Content-type": "application/json" }
@@ -188,3 +183,35 @@ export const getMarketData = async (symbol: any) => {
   });
   return history;
 };
+
+export async function getTransactions(symbol: string, account: string, limit: number, offset?: number): Promise<any> {
+  const url: any = engine.mainTransactionUrl;
+  return axios({
+    url,
+    method: "GET",
+    params: {
+      account,
+      token: symbol,
+      limit,
+      offset
+    }
+  }).then((response) => {
+    return response.data;
+  });
+};
+
+export async function getOtherTransactions(account: string, limit: number, symbol: string, offset: number = 0) {
+  const url: any = engine.otherTransactionsUrl;
+  const response = await axios({
+    url,
+    method: "GET",
+    params: {
+      account,
+      limit,
+      offset,
+      type: "user",
+      symbol
+    }
+  });
+  return response.data;
+}

src/common/api/misc.ts

@@ -71,3 +71,17 @@ export const fetchGif = async (query: string | null, limit: string, offset: stri
   }
   return gifs;
 };
+
+export const marketInfo = async (): Promise<number> => {
+
+  const url = `https://api.coingecko.com/api/v3/coins/markets?vs_currency=usd&ids=hive%2C%20hive_dollar&order=market_cap_desc&per_page=100&page=1&sparkline=false`;
+  const { data } = await axios.get(url)
+  return data;
+};
+
+export const marketChart = async (token: string): Promise<number> => {
+
+  const url = `https://api.coingecko.com/api/v3/coins/${token}/market_chart?vs_currency=usd&days=30`;
+  const { data } = await axios.get(url)
+  return data;
+};

src/common/api/spk-api.ts

@@ -123,6 +123,18 @@ export const getSpkWallet = async (username: string): Promise<SpkApiWallet> => {
   const resp = await axios.get<SpkApiWallet>(`${spkNode}/@${username}`);
   return resp.data;
 };
+export const getMarketInfo = async (): Promise<SpkApiWallet> => {
+  const resp = await axios.get<SpkApiWallet>(`${spkNode}/dex`);
+  // console.log(resp.data)
+  return resp.data;
+};
+
+export const getLarynxData = async () => {
+  fetch(`https://spknode.blocktrades.us/dex`).then((data: any)=> data.json())
+  .then((result: any) =>{ 
+  // console.log(result)
+  })
+}
 
 export const getMarkets = async (): Promise<Markets> => {
   const resp = await axios.get<SpkMarkets>(`${spkNode}/markets`);

src/common/app.tsx

@@ -143,6 +143,12 @@ const App = (props: any) => {
           path={routes.PROPOSAL_DETAIL}
           component={ProposalDetailContainer}
         />
+        <Route
+          exact={true}
+          strict={true}
+          path={routes.TOKEN_DETAIL}
+          component={ProfilePage}
+        />
         <Route exact={true} strict={true} path={routes.ABOUT} component={AboutPage} />
         <Route exact={true} strict={true} path={routes.GUESTS} component={GuestPostPage} />
         <Route exact={true} strict={true} path={routes.CONTRIBUTE} component={ContributePage} />

src/common/components/community-card/index.tsx

@@ -76,7 +76,6 @@ export class EditPic extends BaseComponent<EditPicProps, EditPicState> {
 
     const { addAccount, onUpdate } = this.props;
     const { profile } = account;
-
     const newProfile = {
       profile_image: url
     };

src/common/components/engine-tokens-estimated/index.tsx

@@ -23,8 +23,6 @@ export const EngineTokensEstimated = (props: any) => {
       };
     });
 
-    //  const walletTokens = mappedBalanceMetrics.filter((w: any) => w.balance !== 0 || w.stakedBalance !== 0)
-
     const tokens_usd_prices = mappedBalanceMetrics.map((w: any) => {
       return w.symbol === "SWAP.HIVE"
         ? Number(pricePerHive * w.balance)

src/common/components/engine-tokens-list/index.scss

@@ -0,0 +1,33 @@
+@import "src/style/colors";
+@import "src/style/variables";
+@import "src/style/bootstrap_vars";
+@import "src/style/mixins";
+
+.portfolio-list-container{
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+
+    .token-list{
+        padding: 10px;
+        gap: 5px;
+        // flex-wrap: wrap;
+
+        img{        
+            width: 50px;
+            height: 50px;
+            border-radius: 50%;
+        }
+        span{
+            margin: 0 15px;
+        }
+    }
+
+    .add-btn{
+
+        input{
+            width: 20px;
+            height: 20px;
+        }
+    }
+}

src/common/components/engine-tokens-list/index.tsx

@@ -0,0 +1,35 @@
+import React, { useEffect, useState} from 'react'
+import { _t } from '../../i18n';
+import "./index.scss";
+
+const EngineTokensList = (props: any) => {
+    const { token, handleChange, i, favoriteToken } = props;
+
+    const [checked, setChecked] = useState(favoriteToken)
+
+  return (
+    <>
+    <div className="list-body portfolio-list-container cursor-pointer">
+        <div className="token-list">
+          <img src={token.icon} />
+          <span className="item-name notransalte cursor-pointer">
+            {token?.name}
+          </span>                      
+        </div>
+        <div className='add-btn'>
+          <input
+            type="checkbox"
+            value={token?.name}
+            checked={(checked ? true : false)}
+            onChange={(e) => {
+              handleChange(e.target.checked, token);
+              setChecked(!checked)
+            }}
+          />
+        </div>
+    </div>   
+    </>
+  )
+}
+
+export default EngineTokensList;

src/common/components/hive-engine-chart/index.tsx

@@ -31,8 +31,8 @@ export const HiveEngineChart = (props: any) => {
       enabled: false
     },
     chart: {
-      height: "70",
-      width: "600",
+      height: "40",
+      width: "100",
       zoomType: "x",
       backgroundColor: "transparent",
       border: "none",
@@ -56,7 +56,7 @@ export const HiveEngineChart = (props: any) => {
       area: {
         fillColor: theme === Theme.night ? "#2e3d51" : "#f3f7fb",
         lineColor: "transparent",
-        lineWidth: 399
+        lineWidth: 150
       },
       series: {
         marker: {
@@ -120,14 +120,14 @@ export const HiveEngineChart = (props: any) => {
     series: [
       {
         name: "tokens",
-        data: prices.length === 0 ? [0, 0] : prices,
+        data: prices?.length === 0 ? [0, 0] : prices,
         type: "line",
         enableMouseTracking: true
       }
     ]
   };
   return (
-    <div className="market-graph d-flex justify-items-center ml-5">
+    <div className="market-graph d-flex justify-items-center">
       <div className="graph">
         <ReactHighcharts config={config} />
       </div>