Linter: Manual fixes

pioneer/packages/apps/src/JoyTopBar/TopBar.tsx

@@ -5,8 +5,6 @@ import { Available } from '@polkadot/react-query';
 import styled from 'styled-components';
 import { useApi } from '@polkadot/react-hooks';
 
-type Props = {};
-
 const StyledTopBar = styled.div`
   padding: 0.75rem;
   background-color: #3f3f3f;
@@ -25,7 +23,7 @@ const StyledTopBar = styled.div`
   }
 `;
 
-function JoyTopBar (_props: Props) {
+function JoyTopBar () {
   const {
     allAccounts,
     myAddress

pioneer/packages/joy-members/src/Details.tsx

@@ -61,7 +61,7 @@ class Component extends React.PureComponent<Props> {
 
     return (
       <>
-        <div className={`item ProfileDetails ${isMyProfile && 'MyProfile'}`}>
+        <div className={`item ProfileDetails${isMyProfile ? ' MyProfile' : ''}`}>
           {hasAvatar
             ? <img className='ui avatar image' src={avatar_uri.toString()} />
             : <IdentityIcon className='image' value={root_account} size={40} />

pioneer/packages/joy-members/src/List.tsx

@@ -23,7 +23,7 @@ type Props = ApiProps & I18nProps & RouteComponentProps & {
   match: { params: { page?: string } };
 };
 
-type State = {};
+type State = Record<any, never>;
 
 const MEMBERS_PER_PAGE = 20;
 
@@ -33,7 +33,7 @@ class Component extends React.PureComponent<Props, State> {
   onPageChange = (e: React.MouseEvent, data: PaginationProps) => {
     const { history } = this.props;
 
-    history.push(`/members/list/${data.activePage}`);
+    history.push(`/members/list/${data.activePage || 1}`);
   }
 
   renderPagination (currentPage: number, pagesCount: number) {

pioneer/packages/joy-members/src/MemberPreview.tsx

@@ -47,7 +47,7 @@ class InnerMemberPreview extends React.PureComponent<MemberPreviewProps> {
 
     const avatarSize = inline ? InlineAvatarSizePx : AvatarSizePx;
 
-    return <div className={`JoyMemberPreview ${className}`} style={style}>
+    return <div className={`JoyMemberPreview ${className || ''}`} style={style}>
       <FlexCenter>
         {prefixLabel &&
           <MutedSpan className='PrefixLabel'>{prefixLabel}</MutedSpan>

pioneer/packages/joy-members/src/index.tsx

@@ -36,7 +36,7 @@ class App extends React.PureComponent<Props> {
     return [
       {
         name: 'list',
-        text: t('All members') + ` (${memberCount})`,
+        text: t('All members') + ` (${memberCount?.toString() || '-'})`,
         forceMatchParams: true
       },
       {

pioneer/packages/joy-pages/src/index.tsx

@@ -6,9 +6,9 @@ import ToS_md from './md/ToS.md';
 import Privacy_md from './md/Privacy.md';
 
 export function ToS () {
-  return <Page md={ToS_md} />;
+  return <Page md={ToS_md as string} />;
 }
 
 export function Privacy () {
-  return <Page md={Privacy_md} />;
+  return <Page md={Privacy_md as string} />;
 }

pioneer/packages/joy-utils/src/functions/format.ts

@@ -16,7 +16,7 @@ export const formatReward = (
     : next_payment_at_block;
 
   return (
-    `${formatBalance(amount)}${interval.isSome ? ` / ${interval.unwrap()} block(s)` : ''}` +
-    ((showNextPaymentBlock && nextPaymentBlock) ? ` (Next payment: #${nextPaymentBlock})` : '')
+    `${formatBalance(amount)}${interval.isSome ? ` / ${interval.unwrap().toString()} block(s)` : ''}` +
+    ((showNextPaymentBlock && nextPaymentBlock) ? ` (Next payment: #${nextPaymentBlock.toString()})` : '')
   );
 };

pioneer/packages/joy-utils/src/functions/misc.ts

@@ -33,10 +33,10 @@ export const isNum = (x: any): boolean =>
   typeof x === 'number';
 
 export const isEmptyStr = (x: any): boolean =>
-  notDefined(x) || (isStr(x) && x.trim().length === 0);
+  notDefined(x) || (isStr(x) && (x as string).trim().length === 0);
 
 export const nonEmptyStr = (x?: any) =>
-  isStr(x) && x.trim().length > 0;
+  isStr(x) && (x as string).trim().length > 0;
 
 export const parseNumStr = (num: string): number | undefined => {
   try {

pioneer/packages/joy-utils/src/react/components/FlexCenter.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
 
-export function FlexCenter (props: React.PropsWithChildren<{}>) {
+export function FlexCenter (props: React.PropsWithChildren<unknown>) {
   return <div className='FlexCenter'>{props.children}</div>;
 }

pioneer/packages/joy-utils/src/react/components/MutedText.tsx

@@ -9,7 +9,7 @@ type Props = React.PropsWithChildren<{
 function getClassNames (props: Props): string {
   const { smaller = false, className } = props;
 
-  return `grey text ${smaller ? 'smaller' : ''} ${className}`;
+  return `grey text ${smaller ? 'smaller' : ''} ${className || ''}`;
 }
 
 export const MutedSpan = (props: Props) => {

pioneer/packages/joy-utils/src/react/components/TxButton.tsx

@@ -68,7 +68,7 @@ class TxButtonInner extends React.PureComponent<PropsWithApi & InjectedProps> {
 
     queueExtrinsic({
       accountId: origin,
-      extrinsic: api.tx[section][method](...params) as any, // ???
+      extrinsic: api.tx[section][method](...params),
       txFailedCb,
       txSuccessCb,
       txStartCb,

pioneer/packages/joy-utils/src/react/context/account.tsx

@@ -5,7 +5,7 @@ export const ACCOUNT_CHANGED_EVENT_NAME = 'account-changed';
 export const MY_ADDRESS_STORAGE_KEY = 'joy.myAddress';
 
 function readMyAddress (): string | undefined {
-  const myAddress: string | undefined = store.get(MY_ADDRESS_STORAGE_KEY);
+  const myAddress = store.get(MY_ADDRESS_STORAGE_KEY) as string | undefined;
 
   console.log('Read my address from the local storage:', myAddress);
 
@@ -98,7 +98,7 @@ const contextStub: MyAccountContextProps = {
 
 export const MyAccountContext = createContext<MyAccountContextProps>(contextStub);
 
-export function MyAccountProvider (props: React.PropsWithChildren<{}>) {
+export function MyAccountProvider (props: React.PropsWithChildren<unknown>) {
   const [state, dispatch] = useReducer(reducer, initialState);
 
   const handleAccountChangeEvent = (e: Event) => {

pioneer/packages/joy-utils/src/react/hocs/guards.tsx

@@ -36,7 +36,7 @@ export type MyAccountProps = MyAddressProps & {
   allAccounts?: SubjectInfo;
 };
 
-export function MembershipRequired<P extends {}> (Component: React.ComponentType<P>): React.ComponentType<P> {
+export function MembershipRequired<P extends Record<string, unknown>> (Component: React.ComponentType<P>): React.ComponentType<P> {
   const ResultComponent: React.FunctionComponent<P> = (props: P) => {
     const { myMemberIdChecked, iAmMember } = useMyMembership();
 
@@ -67,7 +67,7 @@ export function MembershipRequired<P extends {}> (Component: React.ComponentType
   return ResultComponent;
 }
 
-export function AccountRequired<P extends {}> (Component: React.ComponentType<P>): React.ComponentType<P> {
+export function AccountRequired<P extends Record<string, unknown>> (Component: React.ComponentType<P>): React.ComponentType<P> {
   const ResultComponent: React.FunctionComponent<P> = (props: P) => {
     const { allAccounts } = useMyMembership();
 
@@ -97,7 +97,7 @@ export function AccountRequired<P extends {}> (Component: React.ComponentType<P>
 export const withOnlyAccounts = <P extends MyAccountProps>(Component: React.ComponentType<P>): React.ComponentType<P> =>
   withMulti(Component, withMyAccount, AccountRequired);
 
-export const withMembershipRequired = <P extends {}> (Component: React.ComponentType<P>): React.ComponentType<P> =>
+export const withMembershipRequired = <P extends Record<string, unknown>> (Component: React.ComponentType<P>): React.ComponentType<P> =>
   withMulti(Component, AccountRequired, MembershipRequired);
 
 export const withOnlyMembers = <P extends MyAccountProps>(Component: React.ComponentType<P>): React.ComponentType<P> =>