release: version 0.9.0

README.md

@@ -41,6 +41,10 @@ Run Cypress tests with:
 npm run test:cypress
 ```
 
+## Compatibility
+
+iOS / Safari are currently not supported due to the ARK crypto package using the `BigInt` type which is not yet supported on Apple products.
+
 ## Credits
 
 This project exists thanks to all the people who [contribute](../../contributors).

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ark-messenger-client",
-  "version": "0.8.0",
+  "version": "0.9.0",
   "description": "A decentralized chat application built on ARK.",
   "license": "MIT",
   "contributors": [
@@ -27,11 +27,12 @@
     "@fortawesome/react-fontawesome": "^0.1.7",
     "animate.css": "^3.7.2",
     "axios": "^0.19.0",
+    "bignumber.js": "^9.0.0",
     "bip39": "^3.0.2",
     "bootstrap": "^4.4.1",
     "crypto-browserify": "^3.12.0",
     "jquery": "^3.4.1",
-    "markdown-to-jsx": "^6.10.3",
+    "markdown-to-jsx": "^6.11.0",
     "node-sass": "^4.13.0",
     "popper.js": "^1.16.0",
     "react": "^16.12.0",
@@ -46,6 +47,7 @@
     "@testing-library/jest-dom": "^4.2.4",
     "@testing-library/react": "^9.3.2",
     "@testing-library/user-event": "^7.1.2",
+    "@types/bignumber.js": "^5.0.0",
     "@types/bytebuffer": "^5.0.40",
     "@types/jest": "^24.0.0",
     "@types/markdown-to-jsx": "^6.9.1",

src/__tests__/jest/api.tests.ts

@@ -1,3 +1,4 @@
+import BigNumber from 'bignumber.js';
 import {
   checkAccountExists,
   getTransactions,
@@ -79,13 +80,13 @@ describe('api', () => {
   });
 
   test('it should return the nonce of the entered username', async () => {
-    const nonce = await fetchRemoteNonce('genesis_1');
-    expect(nonce).toBe('4');
+    const nonce = await fetchRemoteNonce('APnhwwyTbMiykJwYbGhYjNgtHiVJDSEhSn');
+    expect(nonce).toBe('52');
   });
 
   test('it should return the balance of the entered address', async () => {
-    const amount = await fetchBalance('genesis_1');
-    expect(typeof amount).toBe('number');
+    const amount = await fetchBalance('APnhwwyTbMiykJwYbGhYjNgtHiVJDSEhSn');
+    expect(amount).toMatchObject(new BigNumber('-12500000000000000'));
   });
 
   test('it should return the registration date of the entered address as a timestamp', async () => {

src/__tests__/jest/formatters.test.ts

@@ -7,7 +7,7 @@ describe('formatters', () => {
 
   test('it should truncate the message', () => {
     expect(truncateMessage('This is a relatively long message that should be truncated')).toBe(
-      'This is a relatively long messag...'
+      'This is a relatively long mes...'
     );
   });
 

src/components/Chat/ChatBubble/index.tsx

@@ -35,7 +35,13 @@ export default function ChatBubble({ data }: IProps) {
         <hr className="my-1" />
 
         <div className="chat-message">
-          <Markdown>{message}</Markdown>
+          <Markdown
+            // Ignoring due to typings being outdated / not including this attribute
+            // @ts-ignore
+            options={{ disableParsingRawHTML: true }}
+          >
+            {message}
+          </Markdown>
         </div>
       </div>
     </div>

src/components/Chat/MessageInput/index.tsx

@@ -36,9 +36,9 @@ export default function MessageInput({ message, handleSubmit, setMessage }: IPro
         setModalIsOpen={setModalIsOpen}
       />
       <small className="text-muted alt-font pointer" onClick={() => setModalIsOpen(!modalIsOpen)}>
-        <FontAwesomeIcon icon="search" /> Preview
+        <FontAwesomeIcon icon="search" /> Markdown preview
       </small>
-      <div className="input-group">
+      <div className="input-group mt-1">
         <textarea
           className="form-control"
           rows={1}

src/components/Sidebar/UserInfo/index.tsx

@@ -2,6 +2,7 @@ import React, { useState, useEffect, useContext } from 'react';
 import PulseLoader from 'react-spinners/PulseLoader';
 import HomeButton from './HomeButton';
 import LogOutButton from './LogOutButton';
+import BigNumber from 'bignumber.js';
 
 import constants from '../../../constants';
 import { LoginContext } from '../../../contexts';
@@ -15,7 +16,7 @@ export default function UserInfo() {
     username: 'N/A',
     registeredOn: 'N/A',
     totalMessages: 0,
-    balance: 0
+    balance: new BigNumber(0)
   });
   const [isLoading, setIsLoading] = useState<boolean>(true);
 
@@ -79,7 +80,7 @@ export default function UserInfo() {
                     {isLoading ? (
                       <PulseLoader sizeUnit={'em'} size={0.25} color={'#6c5b7b'} />
                     ) : (
-                      (userInfo.balance / 100000000).toLocaleString() + ' ' + constants.ticker
+                      userInfo.balance.dividedBy(100000000) + ' ' + constants.ticker
                     )}
                   </div>
                 </div>

src/interfaces/index.ts

@@ -1,3 +1,5 @@
+import BigNumber from 'bignumber.js';
+
 export interface ITransaction {
   id: string;
   blockId: string;
@@ -88,7 +90,7 @@ export interface IUser extends IAccount {
 
 export interface IUserInfo {
   username: string;
-  balance: number;
+  balance: BigNumber;
   registeredOn: string;
   totalMessages: number;
 }

src/utils/api.ts

@@ -1,17 +1,20 @@
 import config from '../config';
 import constants from '../constants';
 import axios from 'axios';
+import BigNumber from 'bignumber.js';
+
 import { IMessageTransaction, ITransactionData, IPostTransactionResponse } from '../interfaces';
 
 const path = (endpoint: string): string => config.nodes[0] + '/api' + endpoint;
 
 export const checkAccountExists = async (id: string): Promise<boolean> => {
-  const hits = await axios
-    .get(path('/delegates/' + id))
-    .then(res => Object.keys(res.data.data).length)
-    .catch(err => 0);
+  try {
+    const res = await axios.get(path('/delegates/' + id));
 
-  return hits > 0;
+    return Object.keys(res.data.data).length > 0;
+  } catch {
+    return false;
+  }
 };
 
 export const getTransactions = async (channel: string): Promise<IMessageTransaction[]> => {
@@ -35,14 +38,13 @@ export const getLastMessage = async (channel: string): Promise<IMessageTransacti
 };
 
 export const fetchUsername = async (address: string): Promise<string | null> => {
-  const username = await axios
-    .get(path('/delegates/' + address))
-    .then(res => {
-      return res ? res.data.data.username : null;
-    })
-    .catch(() => null);
-
-  return username;
+  try {
+    const res = await axios.get(path('/delegates/' + address));
+
+    return res.data.data.username;
+  } catch {
+    return null;
+  }
 };
 
 export const fetchTotalMessages = async (): Promise<number> => {
@@ -71,24 +73,23 @@ export const fetchTotalUsers = async (): Promise<number> => {
 };
 
 export const fetchRemoteNonce = async (address: string): Promise<string> => {
-  let nonce;
+  let nonce: BigNumber;
 
   try {
-    nonce = await axios
-      .get(path(`/v2/wallets/${address}`))
-      .then(res => parseInt(res.data.data.nonce))
-      .catch(() => 0);
+    const res = await axios.get(path(`/v2/wallets/${address}`));
+
+    nonce = new BigNumber(res.data.data.nonce);
   } catch {
-    nonce = 0;
+    nonce = new BigNumber(0);
   }
 
-  return String(nonce + 1);
+  return nonce.plus(1).toString();
 };
 
-export const fetchBalance = async (address: string): Promise<number> => {
+export const fetchBalance = async (address: string): Promise<BigNumber> => {
   const res = await axios.get(path(`/wallets/${address}`));
 
-  return parseInt(res.data.data.balance);
+  return new BigNumber(res.data.data.balance);
 };
 
 export const fetchRegistrationDate = async (

src/utils/formatters.ts

@@ -1,5 +1,5 @@
 export const truncateChannel = (channel: string, pad: number = 9) => {
-  const regex = /^[123456789ABCDEFGHJKLMNPQRSTUVWXYZabcdefghijkmnopqrstuvwxyz]{34}$/;
+  const regex = /^[0-9A-Za-z]{34}$/;
 
   if (channel.match(regex) || channel.length >= 28) {
     const start = channel.substr(0, pad);
@@ -13,7 +13,7 @@ export const truncateChannel = (channel: string, pad: number = 9) => {
 
 export const truncateMessage = (message: string) => {
   if (message.length > 32) {
-    return message.substr(0, 32) + '...';
+    return message.substr(0, 29) + '...';
   }
 
   return message;