Linter autofix

pioneer/packages/joy-forum/src/CategoryList.tsx

@@ -223,13 +223,14 @@ function InnerCategoryThreads (props: CategoryThreadsProps) {
       const newId = (id: number | BN) => api.createType('ThreadId', id);
       const apiCalls: Promise<Thread>[] = [];
       let id = newId(1);
+
       while (nextThreadId.gt(id)) {
         apiCalls.push(api.query.forum.threadById(id) as Promise<Thread>);
         id = newId(id.add(newId(1)));
       }
 
       const allThreads = await Promise.all<Thread>(apiCalls);
-      const threadsInThisCategory = allThreads.filter(item =>
+      const threadsInThisCategory = allThreads.filter((item) =>
         !item.isEmpty &&
         item.category_id.eq(category.id)
       );
@@ -237,9 +238,9 @@ function InnerCategoryThreads (props: CategoryThreadsProps) {
         threadsInThisCategory,
         // TODO UX: Replace sort by id with sort by blocktime of the last reply.
         [
-          x => x.moderated,
+          (x) => x.moderated,
           // x => x.pinned,
-          x => x.nr_in_category.toNumber()
+          (x) => x.nr_in_category.toNumber()
         ],
         [
           'asc',
@@ -319,6 +320,7 @@ type ViewCategoryByIdProps = UrlHasIdProps & {
 export function ViewCategoryById (props: ViewCategoryByIdProps) {
   const { match: { params: { id } } } = props;
   const { api } = useApi();
+
   try {
     return <ViewCategory id={api.createType('CategoryId', id)} />;
   } catch (err) {
@@ -343,13 +345,14 @@ function InnerCategoryList (props: CategoryListProps) {
       const newId = (id: number | BN) => api.createType('CategoryId', id);
       const apiCalls: Promise<Category>[] = [];
       let id = newId(1);
+
       while (nextCategoryId.gt(id)) {
         apiCalls.push(api.query.forum.categoryById(id) as Promise<Category>);
         id = newId(id.add(newId(1)));
       }
 
       const allCats = await Promise.all<Category>(apiCalls);
-      const filteredCats = allCats.filter(cat =>
+      const filteredCats = allCats.filter((cat) =>
         !cat.isEmpty &&
         !cat.deleted && // TODO show deleted categories if current user is forum sudo
         (parentId ? parentId.eq(cat.parent_id) : cat.isRoot)

pioneer/packages/joy-forum/src/Context.tsx

@@ -113,6 +113,7 @@ function reducer (state: ForumState, action: ForumAction): ForumState {
   switch (action.type) {
     case 'SetForumSudo': {
       const { sudo } = action;
+
       return {
         ...state,
         sudo
@@ -132,19 +133,23 @@ function reducer (state: ForumState, action: ForumAction): ForumState {
 
       if (parent_id) {
         let childrenIds = categoryIdsByParentId.get(parent_id.toNumber());
+
         if (!childrenIds) {
           childrenIds = [];
         }
+
         childrenIds.push(nextCategoryId);
         categoryIdsByParentId.set(parent_id.toNumber(), childrenIds);
       } else {
         if (!rootCategoryIds) {
           rootCategoryIds = [];
         }
+
         rootCategoryIds.push(nextCategoryId);
       }
 
       const newId = nextCategoryId;
+
       categoryById.set(newId, category);
       nextCategoryId = nextCategoryId + 1;
 
@@ -182,13 +187,16 @@ function reducer (state: ForumState, action: ForumAction): ForumState {
       } = state;
 
       let threadIds = threadIdsByCategoryId.get(category_id.toNumber());
+
       if (!threadIds) {
         threadIds = [];
         threadIdsByCategoryId.set(category_id.toNumber(), threadIds);
       }
+
       threadIds.push(nextThreadId);
 
       const newId = nextThreadId;
+
       threadById.set(newId, thread);
       nextThreadId = nextThreadId + 1;
 
@@ -228,6 +236,7 @@ function reducer (state: ForumState, action: ForumAction): ForumState {
         thread.cloneValues(),
         { moderation: createMock('Option<ModerationAction>', moderation) }
       ));
+
       threadById.set(id, threadUpd);
 
       return {
@@ -247,13 +256,16 @@ function reducer (state: ForumState, action: ForumAction): ForumState {
       } = state;
 
       let replyIds = replyIdsByThreadId.get(thread_id.toNumber());
+
       if (!replyIds) {
         replyIds = [];
         replyIdsByThreadId.set(thread_id.toNumber(), replyIds);
       }
+
       replyIds.push(nextReplyId);
 
       const newId = nextReplyId;
+
       replyById.set(newId, reply);
       nextReplyId = nextReplyId + 1;
 
@@ -293,6 +305,7 @@ function reducer (state: ForumState, action: ForumAction): ForumState {
         reply.cloneValues(),
         { moderation: createMock('Option<ModerationAction>', moderation) }
       ));
+
       replyById.set(id, replyUpd);
 
       return {
@@ -324,6 +337,7 @@ export const ForumContext = createContext<ForumContextProps>(contextStub);
 
 export function ForumProvider (props: React.PropsWithChildren<{}>) {
   const [state, dispatch] = useReducer(reducer, initialState);
+
   return (
     <ForumContext.Provider value={{ state, dispatch }}>
       {props.children}

pioneer/packages/joy-forum/src/EditCategory.tsx

@@ -91,6 +91,7 @@ const InnerForm = (props: FormProps) => {
 
   const onTxFailed: TxFailedCallback = (txResult: SubmittableResult | null) => {
     setSubmitting(false);
+
     if (txResult == null) {
       // Tx cancelled.
 
@@ -103,12 +104,15 @@ const InnerForm = (props: FormProps) => {
 
     // Get id of newly created category:
     let _id = id;
+
     if (!_id) {
-      _txResult.events.find(event => {
+      _txResult.events.find((event) => {
         const { event: { data, method } } = event;
+
         if (method === 'CategoryCreated') {
           _id = data.toArray()[0] as CategoryId;
         }
+
         return true;
       });
     }
@@ -190,7 +194,7 @@ const InnerForm = (props: FormProps) => {
 const EditForm = withFormik<OuterProps, FormValues>({
 
   // Transform outer props into form values
-  mapPropsToValues: props => {
+  mapPropsToValues: (props) => {
     const { parentId, struct } = props;
 
     return {
@@ -202,7 +206,7 @@ const EditForm = withFormik<OuterProps, FormValues>({
 
   validationSchema: buildSchema,
 
-  handleSubmit: values => {
+  handleSubmit: (values) => {
     // do submitting things
   }
 })(InnerForm);
@@ -220,6 +224,7 @@ function FormOrLoading (props: OuterProps) {
   }
 
   const isMyStruct = address === struct.moderator_id.toString();
+
   if (isMyStruct) {
     return <EditForm {...props} />;
   }
@@ -231,6 +236,7 @@ function withIdFromUrl (Component: React.ComponentType<OuterProps>) {
   return function (props: UrlHasIdProps) {
     const { match: { params: { id } } } = props;
     const { api } = useApi();
+
     try {
       return <Component id={api.createType('CategoryId', id)} />;
     } catch (err) {
@@ -242,6 +248,7 @@ function withIdFromUrl (Component: React.ComponentType<OuterProps>) {
 function NewSubcategoryForm (props: UrlHasIdProps & OuterProps) {
   const { match: { params: { id } } } = props;
   const { api } = useApi();
+
   try {
     return <EditForm {...props} parentId={api.createType('CategoryId', id)} />;
   } catch (err) {

pioneer/packages/joy-forum/src/EditReply.tsx

@@ -4,7 +4,7 @@ import styled from 'styled-components';
 import { Form, Field, withFormik, FormikProps } from 'formik';
 import * as Yup from 'yup';
 
-import { TxButton } from '@polkadot/joy-utils/react/components';
+import { TxButton, Section } from '@polkadot/joy-utils/react/components';
 import { SubmittableResult } from '@polkadot/api';
 import { withMulti } from '@polkadot/react-api/hoc';
 
@@ -12,7 +12,7 @@ import * as JoyForms from '@polkadot/joy-utils/react/components/forms';
 import { PostId, ThreadId } from '@joystream/types/common';
 import { Post } from '@joystream/types/forum';
 import { withOnlyMembers } from '@polkadot/joy-utils/react/hocs/guards';
-import { Section } from '@polkadot/joy-utils/react/components';
+
 import { useMyAccount } from '@polkadot/joy-utils/react/hooks';
 import { withForumCalls } from './calls';
 import { ValidationProps, withReplyValidation } from './validation';
@@ -87,6 +87,7 @@ const InnerForm = (props: FormProps) => {
 
   const onTxFailed: TxFailedCallback = (txResult: SubmittableResult | null) => {
     setSubmitting(false);
+
     if (txResult == null) {
       // Tx cancelled.
 
@@ -96,6 +97,7 @@ const InnerForm = (props: FormProps) => {
   const onTxSuccess: TxCallback = (_txResult: SubmittableResult) => {
     setSubmitting(false);
     resetForm();
+
     if (!isNew && onEditSuccess) {
       onEditSuccess();
     }
@@ -173,6 +175,7 @@ const InnerForm = (props: FormProps) => {
 
 const getQuotedPostString = (post: Post) => {
   const lines = post.current_text.split('\n');
+
   return lines.reduce((acc, line) => {
     return `${acc}> ${line}\n`;
   }, '');
@@ -181,8 +184,9 @@ const getQuotedPostString = (post: Post) => {
 const EditForm = withFormik<OuterProps, FormValues>({
 
   // Transform outer props into form values
-  mapPropsToValues: props => {
+  mapPropsToValues: (props) => {
     const { struct, quotedPost } = props;
+
     return {
       text: struct
         ? struct.current_text
@@ -194,7 +198,7 @@ const EditForm = withFormik<OuterProps, FormValues>({
 
   validationSchema: buildSchema,
 
-  handleSubmit: values => {
+  handleSubmit: (values) => {
     // do submitting things
   }
 })(InnerForm);
@@ -212,6 +216,7 @@ function FormOrLoading (props: OuterProps) {
   }
 
   const isMyStruct = address === struct.author_id.toString();
+
   if (isMyStruct) {
     return <EditForm {...props} threadId={struct.thread_id} />;
   }

pioneer/packages/joy-forum/src/EditThread.tsx

@@ -6,7 +6,7 @@ import { Form, Field, withFormik, FormikProps } from 'formik';
 import * as Yup from 'yup';
 import { History } from 'history';
 
-import { TxButton } from '@polkadot/joy-utils/react/components';
+import { TxButton, Section } from '@polkadot/joy-utils/react/components';
 import { SubmittableResult } from '@polkadot/api';
 import { withMulti } from '@polkadot/react-api/hoc';
 
@@ -14,7 +14,7 @@ import * as JoyForms from '@polkadot/joy-utils/react/components/forms';
 import { ThreadId } from '@joystream/types/common';
 import { Thread, CategoryId } from '@joystream/types/forum';
 import { withOnlyMembers } from '@polkadot/joy-utils/react/hocs/guards';
-import { Section } from '@polkadot/joy-utils/react/components';
+
 import { useMyAccount } from '@polkadot/joy-utils/react/hooks';
 import { UrlHasIdProps, CategoryCrumbs } from './utils';
 import { withForumCalls } from './calls';
@@ -96,6 +96,7 @@ const InnerForm = (props: FormProps) => {
 
   const onTxFailed: TxFailedCallback = (txResult: SubmittableResult | null) => {
     setSubmitting(false);
+
     if (txResult == null) {
       // Tx cancelled.
 
@@ -108,12 +109,15 @@ const InnerForm = (props: FormProps) => {
 
     // Get id of newly created thread:
     let _id = id;
+
     if (!_id) {
-      _txResult.events.find(event => {
+      _txResult.events.find((event) => {
         const { event: { data, method } } = event;
+
         if (method === 'ThreadCreated') {
           _id = data.toArray()[0] as ThreadId;
         }
+
         return true;
       });
     }
@@ -221,7 +225,7 @@ const InnerForm = (props: FormProps) => {
 const EditForm = withFormik<OuterProps, FormValues>({
 
   // Transform outer props into form values
-  mapPropsToValues: props => {
+  mapPropsToValues: (props) => {
     return {
       // pinned: struct && struct.pinned || false,
       title: '',
@@ -231,7 +235,7 @@ const EditForm = withFormik<OuterProps, FormValues>({
 
   validationSchema: buildSchema,
 
-  handleSubmit: values => {
+  handleSubmit: (values) => {
     // do submitting things
   }
 })(InnerForm);
@@ -249,6 +253,7 @@ function FormOrLoading (props: OuterProps) {
   }
 
   const isMyStruct = address === struct.author_id.toString();
+
   if (isMyStruct) {
     return <EditForm {...props} />;
   }
@@ -260,6 +265,7 @@ function withCategoryIdFromUrl (Component: React.ComponentType<OuterProps>) {
   return function (props: UrlHasIdProps) {
     const { match: { params: { id } } } = props;
     const { api } = useApi();
+
     try {
       return <Component {...props} categoryId={api.createType('CategoryId', id)} />;
     } catch (err) {
@@ -272,6 +278,7 @@ function withIdFromUrl (Component: React.ComponentType<OuterProps>) {
   return function (props: UrlHasIdProps) {
     const { match: { params: { id } } } = props;
     const { api } = useApi();
+
     try {
       return <Component {...props} id={api.createType('ThreadId', id)} />;
     } catch (err) {

pioneer/packages/joy-forum/src/ForumRoot.tsx

@@ -21,7 +21,7 @@ const ForumRoot: React.FC = () => {
     <>
       <CategoryCrumbs root />
       <RecentActivity />
-      <Section title="Top categories">
+      <Section title='Top categories'>
         <CategoryList />
       </Section>
     </>
@@ -65,6 +65,7 @@ const InnerRecentActivity: React.FC<RecentActivityProps> = ({ nextPostId, api })
       const newId = (id: number | BN) => api.createType('PostId', id);
       const apiCalls: Promise<Post>[] = [];
       let id = newId(1);
+
       while (nextPostId.gt(id)) {
         apiCalls.push(api.query.forum.postById(id) as Promise<Post>);
         id = newId(id.add(newId(1)));
@@ -73,16 +74,18 @@ const InnerRecentActivity: React.FC<RecentActivityProps> = ({ nextPostId, api })
       const allPosts = await Promise.all(apiCalls);
       const sortedPosts = orderBy(
         allPosts,
-        [x => x.id.toNumber()],
+        [(x) => x.id.toNumber()],
         ['desc']
       );
 
       const threadsIdsLookup = {} as Record<number, boolean>;
       const postsWithUniqueThreads = sortedPosts.reduce((acc, post) => {
         const threadId = post.thread_id.toNumber();
+
         if (threadsIdsLookup[threadId]) return acc;
 
         threadsIdsLookup[threadId] = true;
+
         return [
           ...acc,
           post
@@ -90,6 +93,7 @@ const InnerRecentActivity: React.FC<RecentActivityProps> = ({ nextPostId, api })
       }, [] as Post[]);
 
       const recentUniquePosts = postsWithUniqueThreads.slice(0, RecentActivityPostsCount);
+
       setRecentPosts(recentUniquePosts);
       setLoaded(true);
     };
@@ -100,12 +104,13 @@ const InnerRecentActivity: React.FC<RecentActivityProps> = ({ nextPostId, api })
   useEffect(() => {
     const loadThreads = async () => {
       const apiCalls: Promise<Thread>[] = recentPosts
-        .filter(p => !threadsLookup[p.thread_id.toNumber()])
-        .map(p => api.query.forum.threadById(p.thread_id) as Promise<Thread>);
+        .filter((p) => !threadsLookup[p.thread_id.toNumber()])
+        .map((p) => api.query.forum.threadById(p.thread_id) as Promise<Thread>);
 
       const threads = await Promise.all(apiCalls);
       const newThreadsLookup = threads.reduce((acc, thread) => {
         acc[thread.id.toNumber()] = thread;
+
         return acc;
       }, {} as Record<number, Thread>);
       const newLookup = {
@@ -123,14 +128,16 @@ const InnerRecentActivity: React.FC<RecentActivityProps> = ({ nextPostId, api })
     if (!loaded) {
       return <i>Loading recent activity...</i>;
     }
+
     if (loaded && !recentPosts.length) {
       return <span>No recent activity</span>;
     }
 
-    return recentPosts.map(p => {
+    return recentPosts.map((p) => {
       const threadId = p.thread_id.toNumber();
 
       const postLinkSearch = new URLSearchParams();
+
       postLinkSearch.set(ReplyIdxQueryParam, p.nr_in_thread.toString());
       const postLinkPathname = `/forum/threads/${threadId}`;
 
@@ -138,7 +145,7 @@ const InnerRecentActivity: React.FC<RecentActivityProps> = ({ nextPostId, api })
 
       return (
         <RecentActivityEntry key={p.id.toNumber()}>
-          <StyledMemberPreview accountId={p.author_id} size="small" showId={false}/>
+          <StyledMemberPreview accountId={p.author_id} size='small' showId={false}/>
           posted in
           {thread && (
             <StyledPostLink to={{ pathname: postLinkPathname, search: postLinkSearch.toString() }}>{thread.title}</StyledPostLink>
@@ -150,7 +157,7 @@ const InnerRecentActivity: React.FC<RecentActivityProps> = ({ nextPostId, api })
   };
 
   return (
-    <Section title="Recent activity">
+    <Section title='Recent activity'>
       {renderSectionContent()}
     </Section>
   );

pioneer/packages/joy-forum/src/ForumSudo.tsx

@@ -3,18 +3,18 @@ import { Button } from 'semantic-ui-react';
 import { Form, Field, withFormik, FormikProps, FieldProps } from 'formik';
 import * as Yup from 'yup';
 
-import { TxButton } from '@polkadot/joy-utils/react/components';
+import { TxButton, Section, JoyError } from '@polkadot/joy-utils/react/components';
 import { SubmittableResult } from '@polkadot/api';
 import { InputAddress } from '@polkadot/react-components/index';
 import { withMulti } from '@polkadot/react-api/hoc';
 
 import * as JoyForms from '@polkadot/joy-utils/react/components/forms';
 import { Option } from '@polkadot/types/codec';
-import { Section } from '@polkadot/joy-utils/react/components';
+
 import { useMyAccount } from '@polkadot/joy-utils/react/hooks';
 import { withOnlySudo } from '@polkadot/joy-utils/react/hocs/guards';
 import { AccountId } from '@polkadot/types/interfaces';
-import { JoyError } from '@polkadot/joy-utils/react/components';
+
 import AddressMini from '@polkadot/react-components/AddressMini';
 import { withForumCalls } from './calls';
 import { TxFailedCallback, TxCallback } from '@polkadot/react-components/Status/types';
@@ -62,6 +62,7 @@ const InnerForm = (props: FormProps) => {
 
   const onTxFailed: TxFailedCallback = (txResult: SubmittableResult | null) => {
     setSubmitting(false);
+
     if (txResult == null) {
       // Tx cancelled.
 
@@ -77,6 +78,7 @@ const InnerForm = (props: FormProps) => {
 
   const buildTxParams = () => {
     if (!isValid) return [];
+
     return [api.createType('Option<AccountId>', sudo)];
   };
 
@@ -152,8 +154,9 @@ const InnerForm = (props: FormProps) => {
 const EditForm = withFormik<OuterProps, FormValues>({
 
   // Transform outer props into form values
-  mapPropsToValues: props => {
+  mapPropsToValues: (props) => {
     const { currentSudo } = props;
+
     return {
       sudo: currentSudo
     };
@@ -161,7 +164,7 @@ const EditForm = withFormik<OuterProps, FormValues>({
 
   validationSchema: buildSchema,
 
-  handleSubmit: values => {
+  handleSubmit: (values) => {
     // do submitting things
   }
 })(InnerForm);
@@ -176,11 +179,13 @@ const withLoadForumSudo = withForumCalls<LoadStructProps>(
 
 function InjectCurrentSudo (props: LoadStructProps) {
   const { structOpt } = props;
+
   if (!structOpt) {
     return <em>Loading forum sudo...</em>;
   }
 
   const sudo = structOpt.isSome ? structOpt.unwrap().toString() : undefined;
+
   return <EditForm currentSudo={sudo} />;
 }
 
@@ -193,6 +198,7 @@ export const EditForumSudo = withMulti(
 function innerWithOnlyForumSudo<P extends LoadStructProps> (Component: React.ComponentType<P>) {
   return function (props: P) {
     const { structOpt } = props;
+
     if (!structOpt) {
       return <em>Loading forum sudo...</em>;
     }
@@ -231,6 +237,7 @@ export const ForumSudoContext = createContext<ForumSudoContextProps>({});
 export function InnerForumSudoProvider (props: React.PropsWithChildren<LoadStructProps>) {
   const { structOpt } = props;
   const forumSudo = structOpt ? structOpt.unwrapOr(undefined) : undefined;
+
   return (
     <ForumSudoContext.Provider value={{ forumSudo }}>
       {props.children}
@@ -251,5 +258,6 @@ export const IfIAmForumSudo = (props: React.PropsWithChildren<any>) => {
   const { forumSudo } = useForumSudo();
   const { state: { address: myAddress } } = useMyAccount();
   const iAmForumSudo: boolean = forumSudo !== undefined && forumSudo.eq(myAddress);
+
   return iAmForumSudo ? props.children : null;
 };

pioneer/packages/joy-forum/src/LegacyPagingRedirect.tsx

@@ -5,6 +5,7 @@ export const LegacyPagingRedirect: React.FC = () => {
   const { pathname } = useLocation();
   const parsingRegexp = /(.+)\/page\/(\d+)/;
   const groups = parsingRegexp.exec(pathname);
+
   if (!groups) {
     return <em>Failed to parse the URL</em>;
   }
@@ -12,6 +13,8 @@ export const LegacyPagingRedirect: React.FC = () => {
   const basePath = groups[1];
   const page = groups[2];
   const search = new URLSearchParams();
+
   search.set('page', page);
+
   return <Redirect to={{ pathname: basePath, search: search.toString() }} />;
 };

pioneer/packages/joy-forum/src/Moderate.tsx

@@ -3,14 +3,14 @@ import { Button } from 'semantic-ui-react';
 import { Form, Field, withFormik, FormikProps } from 'formik';
 import * as Yup from 'yup';
 
-import { TxButton } from '@polkadot/joy-utils/react/components';
+import { TxButton, Section } from '@polkadot/joy-utils/react/components';
 import { SubmittableResult } from '@polkadot/api';
 import { withMulti } from '@polkadot/react-api/hoc';
 
 import * as JoyForms from '@polkadot/joy-utils/react/components/forms';
 import { ThreadId } from '@joystream/types/common';
 import { ReplyId } from '@joystream/types/forum';
-import { Section } from '@polkadot/joy-utils/react/components';
+
 import { withOnlyForumSudo } from './ForumSudo';
 import { ValidationProps, withPostModerationValidation } from './validation';
 import { TxFailedCallback, TxCallback } from '@polkadot/react-components/Status/types';
@@ -73,6 +73,7 @@ const InnerForm = (props: FormProps) => {
 
   const onTxFailed: TxFailedCallback = (txResult: SubmittableResult | null) => {
     setSubmitting(false);
+
     if (txResult == null) {
       // Tx cancelled.
 
@@ -141,7 +142,7 @@ const InnerForm = (props: FormProps) => {
 const EditForm = withFormik<OuterProps, FormValues>({
 
   // Transform outer props into form values
-  mapPropsToValues: _props => {
+  mapPropsToValues: (_props) => {
     return {
       rationale: ''
     };
@@ -149,7 +150,7 @@ const EditForm = withFormik<OuterProps, FormValues>({
 
   validationSchema: buildSchema,
 
-  handleSubmit: values => {
+  handleSubmit: (values) => {
     // do submitting things
   }
 })(InnerForm);

pioneer/packages/joy-forum/src/ViewReply.tsx

@@ -96,37 +96,40 @@ export const ViewReply = React.forwardRef((props: ViewReplyProps, ref: React.Ref
     if (reply.moderated || thread.moderated || category.archived || category.deleted) {
       return null;
     }
+
     const isMyPost = reply.author_id.eq(myAddress);
+
     return <ReplyFooterActionsRow>
       <div>
         {isMyPost &&
-          <Button onClick={onEdit} size="mini">
-            <Icon name="pencil" />
+          <Button onClick={onEdit} size='mini'>
+            <Icon name='pencil' />
             Edit
           </Button>
         }
 
         <IfIAmForumSudo>
           <Button
-            size="mini"
+            size='mini'
             onClick={() => setShowModerateForm(!showModerateForm)}
           >
             Moderate
           </Button>
         </IfIAmForumSudo>
       </div>
-      <Button onClick={onQuote} size="mini">
-        <Icon name="quote left" />
+      <Button onClick={onQuote} size='mini'>
+        <Icon name='quote left' />
         Quote
       </Button>
     </ReplyFooterActionsRow>;
   };
 
   const replyLinkSearch = new URLSearchParams(search);
+
   replyLinkSearch.set(ReplyIdxQueryParam, reply.nr_in_thread.toString());
 
   return (
-    <ReplyContainer className="ui segment" ref={ref} selected={selected}>
+    <ReplyContainer className='ui segment' ref={ref} selected={selected}>
       <ReplyHeader>
         <ReplyHeaderAuthorRow>
           <MemberPreview accountId={reply.author_id} showCouncilBadge showId={false}/>

pioneer/packages/joy-forum/src/ViewThread.tsx

@@ -10,8 +10,8 @@ import { Category, Thread, Post } from '@joystream/types/forum';
 import { Pagination, RepliesPerPage, CategoryCrumbs, TimeAgoDate, usePagination, useQueryParam, ReplyIdxQueryParam, ReplyEditIdQueryParam } from './utils';
 import { ViewReply } from './ViewReply';
 import { Moderate } from './Moderate';
-import { MutedSpan } from '@polkadot/joy-utils/react/components';
-import { JoyWarn } from '@polkadot/joy-utils/react/components';
+import { MutedSpan, JoyWarn } from '@polkadot/joy-utils/react/components';
+
 import { withForumCalls } from './calls';
 import { withApi, withMulti } from '@polkadot/react-api';
 import { ApiProps } from '@polkadot/react-api/types';
@@ -30,6 +30,7 @@ type ThreadTitleProps = {
 
 function ThreadTitle (props: ThreadTitleProps) {
   const { thread, className } = props;
+
   return <span className={className}>
     {/* {thread.pinned && <i
       className='star icon'
@@ -183,26 +184,29 @@ function InnerViewThread (props: ViewThreadProps) {
       const newId = (id: number | BN) => api.createType('PostId', id);
       const apiCalls: Promise<Post>[] = [];
       let id = newId(1);
+
       while (nextPostId.gt(id)) {
         apiCalls.push(api.query.forum.postById(id) as Promise<Post>);
         id = newId(id.add(newId(1)));
       }
 
       const allPosts = await Promise.all<Post>(apiCalls);
-      const postsInThisThread = allPosts.filter(item =>
+      const postsInThisThread = allPosts.filter((item) =>
         !item.isEmpty &&
         item.thread_id.eq(thread.id)
       );
       const sortedPosts = orderBy(
         postsInThisThread,
-        [x => x.nr_in_thread.toNumber()],
+        [(x) => x.nr_in_thread.toNumber()],
         ['asc']
       );
 
       // initialize refs for posts
       postsRefs.current = sortedPosts.reduce((acc, reply) => {
         const refKey = reply.nr_in_thread.toNumber();
+
         acc[refKey] = React.createRef();
+
         return acc;
       }, postsRefs.current);
 
@@ -218,14 +222,17 @@ function InnerViewThread (props: ViewThreadProps) {
     if (!selectedPostIdx) return;
 
     const selectedPostPage = Math.ceil(selectedPostIdx / RepliesPerPage);
+
     if (currentPage !== selectedPostPage) {
       setCurrentPage(selectedPostPage);
     }
 
     if (!loaded) return;
+
     if (selectedPostIdx > posts.length) {
       // eslint-disable-next-line no-console
       console.warn(`Tried to open nonexistent reply with idx: ${selectedPostIdx}`);
+
       return;
     }
 
@@ -248,6 +255,7 @@ function InnerViewThread (props: ViewThreadProps) {
     const minIdx = (currentPage - 1) * RepliesPerPage;
     const maxIdx = minIdx + RepliesPerPage - 1;
     const postsToDisplay = posts.filter((_id, i) => i >= minIdx && i <= maxIdx);
+
     setDisplayedPosts(postsToDisplay);
   }, [loaded, posts, currentPage]);
 
@@ -270,11 +278,12 @@ function InnerViewThread (props: ViewThreadProps) {
     if (!editedPostId) {
       // eslint-disable-next-line no-console
       console.error('editedPostId not set!');
+
       return;
     }
 
     const updatedPost = await api.query.forum.postById(editedPostId) as Post;
-    const updatedPosts = posts.map(post => post.id.eq(editedPostId) ? updatedPost : post);
+    const updatedPosts = posts.map((post) => post.id.eq(editedPostId) ? updatedPost : post);
 
     setPosts(updatedPosts);
     clearEditedPost();
@@ -333,9 +342,10 @@ function InnerViewThread (props: ViewThreadProps) {
     if (thread.moderated || category.archived || category.deleted) {
       return null;
     }
+
     return <span className='JoyInlineActions'>
       <Button onClick={onThreadReplyClick}>
-        <Icon name="reply" />
+        <Icon name='reply' />
         Reply
       </Button>
 
@@ -378,8 +388,8 @@ function InnerViewThread (props: ViewThreadProps) {
       <ThreadInfoAndActions>
         <ThreadInfo>
           Created by
-          <ThreadInfoMemberPreview accountId={thread.author_id} size="small" showId={false}/>
-          <TimeAgoDate date={thread.created_at.momentDate} id="thread" />
+          <ThreadInfoMemberPreview accountId={thread.author_id} size='small' showId={false}/>
+          <TimeAgoDate date={thread.created_at.momentDate} id='thread' />
         </ThreadInfo>
         {renderActions()}
       </ThreadInfoAndActions>
@@ -424,10 +434,12 @@ export function ViewThreadById (props: ViewThreadByIdProps) {
   const { match: { params: { id } } } = props;
 
   let threadId: ThreadId;
+
   try {
     threadId = api.createType('ThreadId', id);
   } catch (err) {
     console.log('Failed to parse thread id form URL');
+
     return <em>Invalid thread ID: {id}</em>;
   }
 

pioneer/packages/joy-forum/src/calls.tsx

@@ -20,6 +20,7 @@ const getReactValue = (state: ForumState, endpoint: string, paramValue: any): an
   const getEntityById = (mapName: EntityMapName, type: keyof InterfaceTypes): any => {
     const id = (paramValue as u64).toNumber();
     const entity = state[mapName].get(id);
+
     return createMock(type, entity);
   };
 
@@ -43,6 +44,7 @@ function withReactCall<P extends ApiProps> (endpoint: string, { paramName, propN
         ...props,
         [_propName]: propValue
       };
+
       return <Inner {..._props} />;
     };
 
@@ -54,10 +56,12 @@ function withForumCall<P extends ApiProps> (endpoint: string, opts: Options = {}
   if (!opts.propName) {
     opts.propName = endpoint;
   }
+
   if (storage === 'react') {
     return withReactCall(endpoint, opts);
   } else {
     endpoint = 'query.forum.' + endpoint;
+
     return withSubstrateCall(endpoint, opts);
   }
 }

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

@@ -24,6 +24,7 @@ type Props = AppMainRouteProps & I18nProps;
 class App extends React.PureComponent<Props> {
   render () {
     const { basePath } = this.props;
+
     return (
       <ForumProvider>
         <ForumSudoProvider>

pioneer/packages/joy-forum/src/utils.tsx

@@ -54,9 +54,10 @@ function InnerCategoryCrumb (p: CategoryCrumbsProps) {
   if (category) {
     try {
       const url = `/forum/categories/${category.id.toString()}`;
+
       return <>
         {category.parent_id ? <CategoryCrumb categoryId={category.parent_id} /> : null}
-        <Breadcrumb.Divider icon="right angle" />
+        <Breadcrumb.Divider icon='right angle' />
         <Breadcrumb.Section as={Link} to={url}>{category.title}</Breadcrumb.Section>
       </>;
     } catch (err) {
@@ -80,9 +81,10 @@ function InnerThreadCrumb (p: CategoryCrumbsProps) {
   if (thread) {
     try {
       const url = `/forum/threads/${thread.id.toString()}`;
+
       return <>
         <CategoryCrumb categoryId={thread.category_id} />
-        <Breadcrumb.Divider icon="right angle" />
+        <Breadcrumb.Divider icon='right angle' />
         <Breadcrumb.Section as={Link} to={url}>{thread.title}</Breadcrumb.Section>
       </>;
     } catch (err) {
@@ -113,8 +115,8 @@ export const CategoryCrumbs = ({ categoryId, threadId, root }: CategoryCrumbsPro
       <Breadcrumb.Section>Forum</Breadcrumb.Section>
       {!root && (
         <>
-          <Breadcrumb.Divider icon="right angle" />
-          <Breadcrumb.Section as={Link} to="/forum">Top categories</Breadcrumb.Section>
+          <Breadcrumb.Divider icon='right angle' />
+          <Breadcrumb.Section as={Link} to='/forum'>Top categories</Breadcrumb.Section>
           <CategoryCrumb categoryId={categoryId} />
           <ThreadCrumb threadId={threadId} />
         </>
@@ -133,7 +135,7 @@ export const TimeAgoDate: React.FC<TimeAgoDateProps> = ({ date, id }) => (
     <span data-tip data-for={`${id}-date-tooltip`}>
       {date.fromNow()}
     </span>
-    <Tooltip id={`${id}-date-tooltip`} place="top" effect="solid">
+    <Tooltip id={`${id}-date-tooltip`} place='top' effect='solid'>
       {date.toLocaleString()}
     </Tooltip>
   </>
@@ -164,6 +166,7 @@ export const useQueryParam = (queryParam: string): QueryReturnType => {
   useEffect(() => {
     const params = new URLSearchParams(search);
     const paramValue = params.get(queryParam);
+
     if (paramValue !== value) {
       setValue(paramValue);
     }
@@ -171,6 +174,7 @@ export const useQueryParam = (queryParam: string): QueryReturnType => {
 
   const setParam: QuerySetValueType = (rawValue, paramsToReset = []) => {
     let parsedValue: string | null;
+
     if (!rawValue && rawValue !== 0) {
       parsedValue = null;
     } else {
@@ -178,13 +182,14 @@ export const useQueryParam = (queryParam: string): QueryReturnType => {
     }
 
     const params = new URLSearchParams(search);
+
     if (parsedValue) {
       params.set(queryParam, parsedValue);
     } else {
       params.delete(queryParam);
     }
 
-    paramsToReset.forEach(p => params.delete(p));
+    paramsToReset.forEach((p) => params.delete(p));
 
     setValue(parsedValue);
     history.push({ pathname, search: params.toString() });
@@ -197,8 +202,10 @@ export const usePagination = (): [number, QuerySetValueType] => {
   const [rawCurrentPage, setCurrentPage] = useQueryParam(PagingQueryParam);
 
   let currentPage = 1;
+
   if (rawCurrentPage) {
     const parsedPage = Number.parseInt(rawCurrentPage);
+
     if (!Number.isNaN(parsedPage)) {
       currentPage = parsedPage;
     } else {

pioneer/packages/joy-forum/src/validation.tsx

@@ -28,14 +28,18 @@ function waitForRequiredConstraints (
   return function (Component: React.ComponentType<any>) {
     const ResultComponent: React.FunctionComponent<ValidationProps> = (props: ValidationProps) => {
       const nonEmptyProps = requiredConstraintNames
-        .filter(name => props[name] !== undefined)
+        .filter((name) => props[name] !== undefined)
         .length;
+
       if (nonEmptyProps !== requiredConstraintNames.length) {
         return <em>Loading validation constraints...</em>;
       }
+
       return <Component {...props} />;
     };
+
     ResultComponent.displayName = `waitForRequiredConstraints(${componentName(Component)})`;
+
     return ResultComponent;
   };
 }

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

@@ -91,6 +91,7 @@ const withMemberIdByAccountId = withCalls<WithMemberIdByAccountIdProps>(
 function setMemberIdByAccountId (Component: React.ComponentType<MemberPreviewProps>) {
   return function (props: WithMemberIdByAccountIdProps & MemberPreviewProps) {
     const { memberIdsByRootAccountId, memberIdsByControllerAccountId } = props;
+
     if (memberIdsByRootAccountId && memberIdsByControllerAccountId) {
       memberIdsByRootAccountId.toArray().concat(memberIdsByControllerAccountId.toArray());
 

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

@@ -23,7 +23,7 @@ const MemberByAccountPreview: React.FunctionComponent<Props> = ({
   showCouncilBadge = false,
   link = true,
   size,
-  className,
+  className
 }) => {
   const transport = useTransport();
   const [member, error, loading] = usePromise<MemberFromAccount | null>(
@@ -58,17 +58,17 @@ type CouncilBadgeProps = {
   memberId: number;
 }
 
-export function CouncilBadge({ memberId }: CouncilBadgeProps) {
+export function CouncilBadge ({ memberId }: CouncilBadgeProps) {
   const transport = useTransport();
   const [councilMembers] = usePromise(() => transport.council.councilMembers(), []);
 
-  if (councilMembers && councilMembers.find(cm => cm.memberId.toNumber() === memberId)) {
+  if (councilMembers && councilMembers.find((cm) => cm.memberId.toNumber() === memberId)) {
     return (
       <b style={{ color: '#607d8b' }}>
         <i className='university icon'></i>
         Council member
       </b>
-    )
+    );
   } else {
     return null;
   }

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

@@ -12,7 +12,7 @@ type ProfilePreviewSize = 'small' | 'medium';
 const AVATAR_SIZES_PX: { [k in ProfilePreviewSize]: number } = {
   small: 20,
   medium: 40
-}
+};
 
 type ProfileItemProps = {
   avatar_uri: string | Text;
@@ -32,20 +32,20 @@ const StyledProfilePreview = styled.div<StyledPartProps>`
   align-items: center;
   & .ui.avatar.image {
     margin: 0 !important;
-    width: ${(props) => `${AVATAR_SIZES_PX[props.size]}px` } !important;
-    height: ${(props) => `${AVATAR_SIZES_PX[props.size]}px` } !important;
+    width: ${(props) => `${AVATAR_SIZES_PX[props.size]}px`} !important;
+    height: ${(props) => `${AVATAR_SIZES_PX[props.size]}px`} !important;
   }
 `;
 
 const Details = styled.div<StyledPartProps>`
-  margin-left: ${(props) => props.size === 'small' ? '0.5rem' : '1rem' };
+  margin-left: ${(props) => props.size === 'small' ? '0.5rem' : '1rem'};
   display: grid;
   grid-row-gap: 0.25rem;
   grid-template-columns: 100%;
 `;
 
 const DetailsHandle = styled.h4<StyledPartProps>`
-  ${ props => props.size === 'small' && css`font-size: 1em` };
+  ${(props) => props.size === 'small' && css`font-size: 1em`};
   margin: 0;
   font-weight: bold;
   color: #333;

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

@@ -70,6 +70,7 @@ type OnlySudoProps = {
 function OnlySudo<P extends OnlySudoProps> (Component: React.ComponentType<P>) {
   return function (props: P) {
     const { sudo } = props;
+
     if (!sudo) {
       return <em>Loading sudo key...</em>;
     }