prettier

src/components/ValidatorReport/BootstrapButton.tsx

@@ -1,40 +1,40 @@
-import { Button, withStyles } from '@material-ui/core'
+import { Button, withStyles } from "@material-ui/core";
 
 export const BootstrapButton = withStyles({
   root: {
-    boxShadow: 'none',
-    textTransform: 'none',
+    boxShadow: "none",
+    textTransform: "none",
     fontSize: 16,
-    padding: '6px 12px',
-    border: '1px solid',
+    padding: "6px 12px",
+    border: "1px solid",
     lineHeight: 1.5,
-    color: '#ffffff',
-    backgroundColor: '#4138ff',
-    borderColor: '#4138ff',
+    color: "#ffffff",
+    backgroundColor: "#4138ff",
+    borderColor: "#4138ff",
     fontFamily: [
-      '-apple-system',
-      'BlinkMacSystemFont',
+      "-apple-system",
+      "BlinkMacSystemFont",
       '"Segoe UI"',
-      'Roboto',
+      "Roboto",
       '"Helvetica Neue"',
-      'Arial',
-      'sans-serif',
+      "Arial",
+      "sans-serif",
       '"Apple Color Emoji"',
       '"Segoe UI Emoji"',
       '"Segoe UI Symbol"',
-    ].join(','),
-    '&:hover': {
-      backgroundColor: '#4138dd',
-      borderColor: '#4138dd',
-      boxShadow: 'none',
+    ].join(","),
+    "&:hover": {
+      backgroundColor: "#4138dd",
+      borderColor: "#4138dd",
+      boxShadow: "none",
     },
-    '&:active': {
-      boxShadow: 'none',
-      backgroundColor: '#4138ee',
-      borderColor: '#4138ee',
+    "&:active": {
+      boxShadow: "none",
+      backgroundColor: "#4138ee",
+      borderColor: "#4138ee",
     },
-    '&:focus': {
-      boxShadow: '0 0 0 0.2rem rgba(0,123,255,.5)',
+    "&:focus": {
+      boxShadow: "0 0 0 0.2rem rgba(0,123,255,.5)",
     },
   },
-})(Button)
+})(Button);

src/components/ValidatorReport/Types.tsx

@@ -3,33 +3,33 @@ export interface EraStatus {
 }
 
 export interface ActiveEra {
-  id: number,
-  era: number,
-  hash: string,
-  block: number,
-  date: string,
-  points: number
+  id: number;
+  era: number;
+  hash: string;
+  block: number;
+  date: string;
+  points: number;
 }
 
 export interface Reports {
-  pageSize: number,
-  totalCount: number,
-  totalBlocks: number,
-  startEra: number,
-  endEra: number,
-  startBlock: number,
-  endBlock: number,
-  startTime: number,
-  endTime: number,
-  report: Array<Report>
+  pageSize: number;
+  totalCount: number;
+  totalBlocks: number;
+  startEra: number;
+  endEra: number;
+  startBlock: number;
+  endBlock: number;
+  startTime: number;
+  endTime: number;
+  report: Array<Report>;
 }
 
 export interface Report {
-  id: number,
-  stakeTotal: number,
-  stakeOwn: number,
-  points: number,
-  rewards: number,
-  commission: number,
-  blocksCount: number
-}
+  id: number;
+  stakeTotal: number;
+  stakeOwn: number;
+  points: number;
+  rewards: number;
+  commission: number;
+  blocksCount: number;
+}

src/components/ValidatorReport/get-status.ts

@@ -1,13 +1,13 @@
-import { JoyApi } from './joyApi'
-import { PromiseAllObj } from './utils'
+import { JoyApi } from "./joyApi";
+import { PromiseAllObj } from "./utils";
 
-const api = new JoyApi()
+const api = new JoyApi();
 
 export async function getChainState() {
-  await api.init
+  await api.init;
 
   return await PromiseAllObj({
     finalizedBlockHeight: await api.finalizedBlockHeight(),
     validators: await api.validatorsData(),
-  })
-}
+  });
+}

src/components/ValidatorReport/index.css

@@ -1,5 +1,5 @@
 .footer {
-    position: relative;
-    background-color: white!important;
-    color: black!important;
+  position: relative;
+  background-color: white !important;
+  color: black !important;
 }

src/components/ValidatorReport/index.tsx

@@ -26,7 +26,7 @@ import Alert from "@material-ui/lab/Alert";
 import Tabs from "@material-ui/core/Tabs";
 import Backdrop from "@material-ui/core/Backdrop";
 import "./index.css";
-import { alternativeBackendApis } from '../../config'
+import { alternativeBackendApis } from "../../config";
 
 config();
 
@@ -56,11 +56,11 @@ const ValidatorReport = () => {
     moment().subtract(14, "d").format(dateFormat)
   );
   const [dateTo, setDateTo] = useState(moment().format(dateFormat));
-  const [startBlock, setStartBlock] = useState("" as unknown as number);
-  const [endBlock, setEndBlock] = useState("" as unknown as number);
+  const [startBlock, setStartBlock] = useState(("" as unknown) as number);
+  const [endBlock, setEndBlock] = useState(("" as unknown) as number);
   const [isLoading, setIsLoading] = useState(false);
   const [error, setError] = useState(undefined);
-  const [backendUrl] = useState(alternativeBackendApis)
+  const [backendUrl] = useState(alternativeBackendApis);
   const [currentPage, setCurrentPage] = useState(1);
   const [filterTab, setFilterTab] = useState(0 as number);
   const [columns] = useState([
@@ -93,7 +93,7 @@ const ValidatorReport = () => {
       sortable: true,
     },
   ]);
-  const [report, setReport] = useState({
+  const [report, setReport] = useState(({
     pageSize: 0,
     totalCount: 0,
     totalBlocks: 0,
@@ -103,8 +103,8 @@ const ValidatorReport = () => {
     endBlock: -1,
     startTime: -1,
     endTime: -1,
-    report: [] as unknown as Report[],
-  } as unknown as Reports);
+    report: ([] as unknown) as Report[],
+  } as unknown) as Reports);
 
   const isDateRange = filterTab === 0;
   const isBlockRange = filterTab === 1;
@@ -170,13 +170,13 @@ const ValidatorReport = () => {
   const startOrStopLoading = () =>
     isLoading ? stopLoadingReport() : loadReport(1);
   const updateStartBlock = (e: { target: { value: unknown } }) =>
-    setStartBlock(e.target.value as unknown as number);
+    setStartBlock((e.target.value as unknown) as number);
   const updateEndBlock = (e: { target: { value: unknown } }) =>
-    setEndBlock(e.target.value as unknown as number);
+    setEndBlock((e.target.value as unknown) as number);
   const updateDateFrom = (e: { target: { value: unknown } }) =>
-    setDateFrom(e.target.value as unknown as string);
+    setDateFrom((e.target.value as unknown) as string);
   const updateDateTo = (e: { target: { value: unknown } }) =>
-    setDateTo(e.target.value as unknown as string);
+    setDateTo((e.target.value as unknown) as string);
 
   const setCurrentPeriodStartBlock = () => {
     const blocksToEndOfDay = moment().endOf("d").diff(moment(), "seconds") / 6;
@@ -211,10 +211,7 @@ const ValidatorReport = () => {
     }
     return "Choose dates or blocks range";
   };
-  const updateStash = (
-    event: ChangeEvent<{}>,
-    value: string | null
-  ) => {
+  const updateStash = (event: ChangeEvent<{}>, value: string | null) => {
     setStash(value || "");
   };
 
@@ -390,7 +387,7 @@ const ValidatorReport = () => {
               </Backdrop>
               <DataGrid
                 rows={report.report}
-                columns={columns as unknown as GridColumns}
+                columns={(columns as unknown) as GridColumns}
                 rowCount={report.totalCount}
                 pagination
                 paginationMode="server"

src/components/ValidatorReport/joyApi.ts

@@ -1,75 +1,84 @@
-import { ApiPromise, WsProvider } from '@polkadot/api'
-import { types } from '@joystream/types'
-import { AccountId, Hash } from '@polkadot/types/interfaces'
-import { config } from 'dotenv'
-import BN from 'bn.js'
-import { Option, Vec } from '@polkadot/types'
-import { wsLocation } from '../../config'
+import { ApiPromise, WsProvider } from "@polkadot/api";
+import { types } from "@joystream/types";
+import { AccountId, Hash } from "@polkadot/types/interfaces";
+import { config } from "dotenv";
+import BN from "bn.js";
+import { Option, Vec } from "@polkadot/types";
+import { wsLocation } from "../../config";
 
-config()
+config();
 
 export class JoyApi {
-  endpoint: string
-  isReady: Promise<ApiPromise>
-  api!: ApiPromise
+  endpoint: string;
+  isReady: Promise<ApiPromise>;
+  api!: ApiPromise;
 
   constructor() {
-    this.endpoint = wsLocation
+    this.endpoint = wsLocation;
     this.isReady = (async () =>
-      await new ApiPromise({ provider: new WsProvider(wsLocation), types }).isReadyOrError)()
+      await new ApiPromise({ provider: new WsProvider(wsLocation), types })
+        .isReadyOrError)();
   }
 
   get init(): Promise<JoyApi> {
     return this.isReady.then((instance) => {
-      this.api = instance
-      return this
-    })
+      this.api = instance;
+      return this;
+    });
   }
 
   async finalizedHash() {
-    return this.api.rpc.chain.getFinalizedHead()
+    return this.api.rpc.chain.getFinalizedHead();
   }
 
   async finalizedBlockHeight() {
-    const finalizedHash = await this.finalizedHash()
-    const { number } = await this.api.rpc.chain.getHeader(`${finalizedHash}`)
-    return number.toNumber()
+    const finalizedHash = await this.finalizedHash();
+    const { number } = await this.api.rpc.chain.getHeader(`${finalizedHash}`);
+    return number.toNumber();
   }
 
-  async findActiveValidators(hash: Hash, searchPreviousBlocks: boolean): Promise<AccountId[]> {
-    const block = await this.api.rpc.chain.getBlock(hash)
+  async findActiveValidators(
+    hash: Hash,
+    searchPreviousBlocks: boolean
+  ): Promise<AccountId[]> {
+    const block = await this.api.rpc.chain.getBlock(hash);
 
-    let currentBlockNr = block.block.header.number.toNumber()
-    let activeValidators
+    let currentBlockNr = block.block.header.number.toNumber();
+    let activeValidators;
     do {
-      let currentHash = (await this.api.rpc.chain.getBlockHash(currentBlockNr)) as Hash
-      let allValidators = await this.api.query.staking.snapshotValidators.at(currentHash) as Option<Vec<AccountId>>
+      let currentHash = (await this.api.rpc.chain.getBlockHash(
+        currentBlockNr
+      )) as Hash;
+      let allValidators = (await this.api.query.staking.snapshotValidators.at(
+        currentHash
+      )) as Option<Vec<AccountId>>;
       if (!allValidators.isEmpty) {
-        let max = (await this.api.query.staking.validatorCount.at(currentHash)).toNumber()
-        activeValidators = Array.from(allValidators.unwrap()).slice(0, max)
+        let max = (
+          await this.api.query.staking.validatorCount.at(currentHash)
+        ).toNumber();
+        activeValidators = Array.from(allValidators.unwrap()).slice(0, max);
       }
 
       if (searchPreviousBlocks) {
-        --currentBlockNr
+        --currentBlockNr;
       } else {
-        ++currentBlockNr
+        ++currentBlockNr;
       }
-
-    } while (activeValidators === undefined)
-    return activeValidators
+    } while (activeValidators === undefined);
+    return activeValidators;
   }
 
   async validatorsData() {
-    const validators = await this.api.query.session.validators()
-    const era = await this.api.query.staking.currentEra()
-    const totalStake = era.isSome ?
-      await this.api.query.staking.erasTotalStake(era.unwrap())
-      : new BN(0)
+    const validators = await this.api.query.session.validators();
+    const era = await this.api.query.staking.currentEra();
+    const totalStake = era.isSome
+      ? await this.api.query.staking.erasTotalStake(era.unwrap())
+      : new BN(0);
 
     return {
       count: validators.length,
       validators: validators.toJSON(),
       total_stake: totalStake.toNumber(),
-    }
+    };
   }
 }

src/components/ValidatorReport/utils.ts

@@ -1,5 +1,5 @@
 const fromEntries = (xs: [string | number | symbol, any][]) =>
-  xs.reduce((acc, [key, value]) => ({ ...acc, [key]: value }), {})
+  xs.reduce((acc, [key, value]) => ({ ...acc, [key]: value }), {});
 
 export function PromiseAllObj(obj: {
   [k: string]: any;
@@ -8,7 +8,7 @@ export function PromiseAllObj(obj: {
     Object.entries(obj).map(([key, val]) =>
       val instanceof Promise
         ? val.then((res) => [key, res])
-        : new Promise((res) => res([key, val])),
-    ),
-  ).then((res: any[]) => fromEntries(res))
+        : new Promise((res) => res([key, val]))
+    )
+  ).then((res: any[]) => fromEntries(res));
 }