Merge pull request #399 from fxhash/fix/prettier-back

Bring prettier back due to improper merge

.eslintrc.json

@@ -1,3 +1,12 @@
 {
-  "extends": "next/core-web-vitals"
+  "plugins": [
+    "prettier"
+  ],
+  "extends": [
+    "prettier",
+    "next/core-web-vitals"
+  ],
+  "rules": {
+    "prettier/prettier": "error"
+  }
 }

.prettierrc.json

@@ -0,0 +1,6 @@
+{
+  "trailingComma": "es5",
+  "tabWidth": 2,
+  "semi": false,
+  "singleQuote": false
+}

package.json

@@ -6,7 +6,8 @@
     "dev": "next dev",
     "build": "next build",
     "start": "next start",
-    "lint": "next lint"
+    "lint": "next lint",
+    "lint:fix": "next lint --fix"
   },
   "dependencies": {
     "@apollo/client": "^3.4.16",
@@ -87,6 +88,10 @@
     "@types/react-router-dom": "^5.3.1",
     "eslint": "8.0.0",
     "eslint-config-next": "11.1.2",
+    "eslint-config-prettier": "^8.5.0",
+    "eslint-plugin-prettier": "^4.0.0",
+    "eslint-plugin-react": "^7.31.8",
+    "prettier": "2.6.2",
     "typescript": "4.4.3"
   }
 }

src/components/Activity/Action.tsx

@@ -20,8 +20,8 @@ export const ActionReference = ({ action }: { action: ActionType }) => {
       target="_blank"
       rel="noreferrer"
     >
-      <DateDistance timestamptz={action.createdAt}/>
-      <i aria-hidden className="fas fa-external-link-square"/>
+      <DateDistance timestamptz={action.createdAt} />
+      <i aria-hidden className="fas fa-external-link-square" />
     </a>
   )
 }
@@ -31,27 +31,19 @@ type ILinkWrapperProps = PropsWithChildren<{
   action: ActionType
   linkFn?: TActionLinkFn | null
 }>
-function LinkWrapper({ 
-  action,
-  linkFn,
-  children 
-}: ILinkWrapperProps) {
-  const link = useMemo(
-    () => linkFn?.(action) || null,
-    [action, linkFn]
-  )
+function LinkWrapper({ action, linkFn, children }: ILinkWrapperProps) {
+  const link = useMemo(() => linkFn?.(action) || null, [action, linkFn])
 
-  return link
-    ? (
-      <article className={cs(style.container, style.is_link)}>
-        <Link href={link}>
-          <a className={cs(style.link_wrapper)}/>
-        </Link>
-        { children }
-      </article>
-    ):(
-      <article className={cs(style.container)}>{ children }</article>
-    )
+  return link ? (
+    <article className={cs(style.container, style.is_link)}>
+      <Link href={link}>
+        <a className={cs(style.link_wrapper)} />
+      </Link>
+      {children}
+    </article>
+  ) : (
+    <article className={cs(style.container)}>{children}</article>
+  )
 }
 
 export function Action({ action, verbose }: Props) {
@@ -62,25 +54,18 @@ export function Action({ action, verbose }: Props) {
   }
 
   return (
-    <LinkWrapper
-      action={action}
-      linkFn={def.link}
-    >
+    <LinkWrapper action={action} linkFn={def.link}>
       <div className={cs(style.content)}>
         <div className={cs(style.details)}>
           <i
             aria-hidden
-            className={cs(
-              def.icon,
-              colors[def.iconColor],
-              style.icon,
-            )}
+            className={cs(def.icon, colors[def.iconColor], style.icon)}
           />
           <div className={cs(style.details_content)}>
             {def.render({ action, verbose })}
           </div>
         </div>
-        <ActionReference action={action}/>
+        <ActionReference action={action} />
       </div>
     </LinkWrapper>
   )

src/components/Activity/ActionDefinitions.ts

@@ -1,4 +1,7 @@
-import { Action as ActionType, TokenActionType } from "../../types/entities/Action"
+import {
+  Action as ActionType,
+  TokenActionType,
+} from "../../types/entities/Action"
 import { getArticleUrl } from "../../utils/entities/articles"
 import { ActionDefinition, TActionLinkFn } from "./Actions/Action"
 import { ActionMinted } from "./Actions/ActionMinted"
@@ -24,15 +27,12 @@ import { ActionListingAcceptedV3 } from "./Actions/ActionListingAcceptedV3"
 import { ActionListingCancelledV3 } from "./Actions/ActionListingCancelledV3"
 import { getObjktUrl } from "../../utils/objkt"
 
-
 const ActionLinks = {
   gentk: (action: ActionType) => `/gentk/${action.objkt?.id}`,
   token: (action: ActionType) => `/generative/${action.token?.id}`,
   article: (action: ActionType) => getArticleUrl(action.article!),
-  gentkOrArticle: (action: ActionType) => 
-    action.article 
-      ? getArticleUrl(action.article)
-      : getObjktUrl(action.objkt!)
+  gentkOrArticle: (action: ActionType) =>
+    action.article ? getArticleUrl(action.article) : getObjktUrl(action.objkt!),
 } as const
 
 const ActionTodoDefinition: ActionDefinition = {
@@ -222,4 +222,4 @@ export const ActionDefinitions: Record<TokenActionType, ActionDefinition> = {
   AUCTION_BID: ActionTodoDefinition,
   AUCTION_CANCELLED: ActionTodoDefinition,
   AUCTION_FULFILLED: ActionTodoDefinition,
-}
+}

src/components/Activity/Actions/Action.ts

@@ -9,12 +9,12 @@ interface Props {
 
 export type TActionComp = FunctionComponent<Props>
 
-export type TActionLinkFn = (action: Action) => string|null
+export type TActionLinkFn = (action: Action) => string | null
 
 export interface ActionDefinition {
   icon: string
-  iconColor: TColor,
+  iconColor: TColor
   render: TActionComp
   predecescence: number
   link: TActionLinkFn | null
-}
+}

src/components/Activity/Actions/ActionArticleLocked.tsx

@@ -15,4 +15,4 @@ export const ActionArticleLocked: TActionComp = ({ action, verbose }) => (
       locked article <strong>{action.article!.title}</strong>
     </span>
   </>
-)
+)

src/components/Activity/Actions/ActionArticleMinted.tsx

@@ -15,4 +15,4 @@ export const ActionArticleMinted: TActionComp = ({ action, verbose }) => (
       minted article <strong>{action.article!.title}</strong>
     </span>
   </>
-)
+)

src/components/Activity/Actions/ActionArticleTransfered.tsx

@@ -3,7 +3,10 @@ import cs from "classnames"
 import { TActionComp } from "./Action"
 import { UserBadge } from "../../User/UserBadge"
 
-export const ActionArticleEditionsTransfered: TActionComp = ({ action, verbose }) => (
+export const ActionArticleEditionsTransfered: TActionComp = ({
+  action,
+  verbose,
+}) => (
   <>
     <UserBadge
       className={cs(style.user)}
@@ -12,7 +15,13 @@ export const ActionArticleEditionsTransfered: TActionComp = ({ action, verbose }
       size="small"
     />
     <span>
-      transfered <strong>{action.numericValue}</strong> editions {verbose && <>of <strong>{action.article!.title}</strong></>} to
+      transfered <strong>{action.numericValue}</strong> editions{" "}
+      {verbose && (
+        <>
+          of <strong>{action.article!.title}</strong>
+        </>
+      )}{" "}
+      to
     </span>
     <UserBadge
       className={cs(style.user)}
@@ -21,4 +30,4 @@ export const ActionArticleEditionsTransfered: TActionComp = ({ action, verbose }
       size="small"
     />
   </>
-)
+)

src/components/Activity/Actions/ActionArticleUpdated.tsx

@@ -6,49 +6,50 @@ import { TActionComp } from "./Action"
 import { UserBadge } from "../../User/UserBadge"
 import { NFTArticleRevision } from "../../../types/entities/Article"
 
-
 interface ArticleRevisionLinkProps {
   revision: NFTArticleRevision
 }
 
-function ArticleRevisionLink({
-  revision
-}: ArticleRevisionLinkProps) {
+function ArticleRevisionLink({ revision }: ArticleRevisionLinkProps) {
   return (
-   <a
+    <a
       className={style.link}
       href={ipfsGatewayUrl(revision.metadataUri)}
       target="_blank"
       rel="noreferrer"
     >
       <strong>
-	{revision.iteration === 0
-	  ? "initial mint"
-	  : getNumberWithOrdinal(revision.iteration) + " revision"
-	}
+        {revision.iteration === 0
+          ? "initial mint"
+          : getNumberWithOrdinal(revision.iteration) + " revision"}
       </strong>
     </a>
   )
 }
 
 export const ActionArticleUpdated: TActionComp = ({ action, verbose }) => {
   const { from, to } = action.metadata!
-  const revisionFrom = action.article!.revisions!.find(r => r.metadataUri === from)
-  const revisionTo = action.article!.revisions!.find(r => r.metadataUri === to)
+  const revisionFrom = action.article!.revisions!.find(
+    (r) => r.metadataUri === from
+  )
+  const revisionTo = action.article!.revisions!.find(
+    (r) => r.metadataUri === to
+  )
 
   return (
-  <>
-    <UserBadge
-      className={cs(style.user)}
-      hasLink={true}
-      user={action.issuer!}
-      size="small"
-    />
-    <span>
-      updated article {` `}
-      <ArticleRevisionLink revision={revisionFrom!} />
-       {` `} to {` `}
-      <ArticleRevisionLink revision={revisionTo!} />
-    </span>
-  </>
-)}
+    <>
+      <UserBadge
+        className={cs(style.user)}
+        hasLink={true}
+        user={action.issuer!}
+        size="small"
+      />
+      <span>
+        updated article {` `}
+        <ArticleRevisionLink revision={revisionFrom!} />
+        {` `} to {` `}
+        <ArticleRevisionLink revision={revisionTo!} />
+      </span>
+    </>
+  )
+}

src/components/Activity/Actions/ActionBurnSupply.tsx

@@ -14,12 +14,12 @@ export const ActionBurnSupply: TActionComp = ({ action }) => {
         user={action.issuer!}
         size="small"
       />
+      <span>burnt some supply:</span>
       <span>
-        burnt some supply:
-      </span>
-      <span>
-        <strong className={cs(colors.secondary)}>{metadata.from}</strong>{" -> "}<strong className={cs(colors.secondary)}>{metadata.to}</strong>
+        <strong className={cs(colors.secondary)}>{metadata.from}</strong>
+        {" -> "}
+        <strong className={cs(colors.secondary)}>{metadata.to}</strong>
       </span>
     </>
   )
-}
+}

src/components/Activity/Actions/ActionListing.tsx

@@ -13,7 +13,11 @@ export const ActionListing: TActionComp = ({ action, verbose }) => (
       size="small"
     />
     <span>
-      listed <strong>{verbose ? action.objkt!.name : `#${action.objkt!.iteration}`}</strong> for
+      listed{" "}
+      <strong>
+        {verbose ? action.objkt!.name : `#${action.objkt!.iteration}`}
+      </strong>{" "}
+      for
     </span>
     <span className={cs(style.price)}>
       <DisplayTezos
@@ -23,4 +27,4 @@ export const ActionListing: TActionComp = ({ action, verbose }) => (
       />
     </span>
   </>
-)
+)

src/components/Activity/Actions/ActionListingAccepted.tsx

@@ -13,7 +13,11 @@ export const ActionListingAccepted: TActionComp = ({ action, verbose }) => (
       size="small"
     />
     <span>
-      bought <strong>{verbose ? action.objkt!.name : `#${action.objkt!.iteration}`}</strong> from
+      bought{" "}
+      <strong>
+        {verbose ? action.objkt!.name : `#${action.objkt!.iteration}`}
+      </strong>{" "}
+      from
     </span>
     <UserBadge
       className={cs(style.user)}
@@ -32,4 +36,4 @@ export const ActionListingAccepted: TActionComp = ({ action, verbose }) => (
       </span>
     </span>
   </>
-)
+)

src/components/Activity/Actions/ActionListingAcceptedV3.tsx

@@ -13,7 +13,13 @@ const ActionListingArticleAccepted: TActionComp = ({ action, verbose }) => (
       size="small"
     />
     <span>
-      bought <strong>{action.metadata.amountCollected}</strong> editions {verbose && <>of <strong>{action.article!.title}</strong></>} from
+      bought <strong>{action.metadata.amountCollected}</strong> editions{" "}
+      {verbose && (
+        <>
+          of <strong>{action.article!.title}</strong>
+        </>
+      )}{" "}
+      from
     </span>
     <UserBadge
       className={cs(style.user)}
@@ -44,7 +50,11 @@ const ActionListingObjktAccepted: TActionComp = ({ action, verbose }) => (
       size="small"
     />
     <span>
-      bought <strong>{verbose ? action.objkt!.name : `#${action.objkt!.iteration}`}</strong> from
+      bought{" "}
+      <strong>
+        {verbose ? action.objkt!.name : `#${action.objkt!.iteration}`}
+      </strong>{" "}
+      from
     </span>
     <UserBadge
       className={cs(style.user)}
@@ -68,4 +78,4 @@ const ActionListingObjktAccepted: TActionComp = ({ action, verbose }) => (
 export const ActionListingAcceptedV3: TActionComp = (props) => {
   // todo: when add support for gentks, add a filter upfront to pick right comp.
   return ActionListingArticleAccepted(props)
-}
+}