diff --git a/package.json b/package.json index 78b595b..4ab2fa6 100644 --- a/package.json +++ b/package.json @@ -11,7 +11,7 @@ "dev": "turbo run dev", "format": "turbo run format", "format:check": "turbo run format:check", - "lint": "FORCE_COLOR=1 turbo run lint --filter='./packages/snap'", + "lint": "FORCE_COLOR=1 turbo run lint", "publish": "yarn build && changeset publish", "test": "FORCE_COLOR=1 turbo run test", "typecheck": "turbo run typecheck" diff --git a/packages/site/src/App.tsx b/packages/site/src/App.tsx index 2ce230d..613b557 100644 --- a/packages/site/src/App.tsx +++ b/packages/site/src/App.tsx @@ -2,7 +2,7 @@ import './polyfills'; import type { FunctionComponent, ReactNode } from 'react'; import { useContext } from 'react'; -import styled from 'styled-components'; +import { styled } from 'styled-components'; import { Footer, Header } from './components'; import { GlobalStyle } from './config/theme'; diff --git a/packages/site/src/components/Buttons.tsx b/packages/site/src/components/Buttons.tsx index 1a7a4d3..ac5c11d 100644 --- a/packages/site/src/components/Buttons.tsx +++ b/packages/site/src/components/Buttons.tsx @@ -1,5 +1,5 @@ import type { ComponentProps } from 'react'; -import styled from 'styled-components'; +import { styled } from 'styled-components'; import type { MetamaskState } from '../hooks'; import { shouldDisplayReconnectButton } from '../utils'; diff --git a/packages/site/src/components/Card.tsx b/packages/site/src/components/Card.tsx index 2e86284..c382ee0 100644 --- a/packages/site/src/components/Card.tsx +++ b/packages/site/src/components/Card.tsx @@ -1,5 +1,5 @@ import type { ReactNode } from 'react'; -import styled from 'styled-components'; +import { styled } from 'styled-components'; type CardProps = { content: { diff --git a/packages/site/src/components/Footer.tsx b/packages/site/src/components/Footer.tsx index 9b11648..eccff22 100644 --- a/packages/site/src/components/Footer.tsx +++ b/packages/site/src/components/Footer.tsx @@ -1,4 +1,4 @@ -import styled, { useTheme } from 'styled-components'; +import { styled, useTheme } from 'styled-components'; import { MetaMask } from './MetaMask'; import { PoweredBy } from './PoweredBy'; diff --git a/packages/site/src/components/Header.tsx b/packages/site/src/components/Header.tsx index 0aa4806..962736f 100644 --- a/packages/site/src/components/Header.tsx +++ b/packages/site/src/components/Header.tsx @@ -1,10 +1,11 @@ import { useContext } from 'react'; -import styled, { useTheme } from 'styled-components'; -import { MetamaskActions, MetaMaskContext } from '../hooks'; -import { connectSnap, getThemePreference, getSnap } from '../utils'; +import { styled, useTheme } from 'styled-components'; + import { HeaderButtons } from './Buttons'; import { SnapLogo } from './SnapLogo'; import { Toggle } from './Toggle'; +import { MetamaskActions, MetaMaskContext } from '../hooks'; +import { connectSnap, getThemePreference, getSnap } from '../utils'; const HeaderWrapper = styled.header` display: flex; @@ -54,9 +55,9 @@ export const Header = ({ type: MetamaskActions.SetInstalled, payload: installedSnap, }); - } catch (e) { - console.error(e); - dispatch({ type: MetamaskActions.SetError, payload: e }); + } catch (error) { + console.error(error); + dispatch({ type: MetamaskActions.SetError, payload: error }); } }; return ( diff --git a/packages/site/src/components/ListConversations.tsx b/packages/site/src/components/ListConversations.tsx index b4b2e46..9695b1a 100644 --- a/packages/site/src/components/ListConversations.tsx +++ b/packages/site/src/components/ListConversations.tsx @@ -31,6 +31,7 @@ export const ListConversations = ({ client }: { client: Client | null }) => { title: 'List conversations with connected client', description: 'List all conversations', button: ( + // eslint-disable-next-line @typescript-eslint/no-misused-promises diff --git a/packages/site/src/components/ListUserPreferences.tsx b/packages/site/src/components/ListUserPreferences.tsx index 19c96e9..fec0c2d 100644 --- a/packages/site/src/components/ListUserPreferences.tsx +++ b/packages/site/src/components/ListUserPreferences.tsx @@ -32,6 +32,7 @@ export const ListUserPreferences = ({ client }: { client: Client | null }) => { description: 'List user preferences', button: ( <> + {/* eslint-disable-next-line @typescript-eslint/no-misused-promises */} diff --git a/packages/site/src/components/Toggle.tsx b/packages/site/src/components/Toggle.tsx index b5b3f63..275f78d 100644 --- a/packages/site/src/components/Toggle.tsx +++ b/packages/site/src/components/Toggle.tsx @@ -1,5 +1,5 @@ import { useState } from 'react'; -import styled from 'styled-components'; +import { styled } from 'styled-components'; type CheckedProps = { readonly checked: boolean; diff --git a/packages/site/src/hooks/MetamaskContext.tsx b/packages/site/src/hooks/MetamaskContext.tsx index e0afd06..964c870 100644 --- a/packages/site/src/hooks/MetamaskContext.tsx +++ b/packages/site/src/hooks/MetamaskContext.tsx @@ -1,12 +1,7 @@ -import { - createContext, - Dispatch, - ReactNode, - Reducer, - useEffect, - useReducer, -} from 'react'; -import { Snap } from '../types'; +import type { Dispatch, ReactNode, Reducer } from 'react'; +import { createContext, useEffect, useReducer } from 'react'; + +import type { Snap } from '../types'; import { isFlask, getSnap } from '../utils'; export type MetamaskState = { @@ -64,12 +59,12 @@ const reducer: Reducer = (state, action) => { /** * MetaMask context provider to handle MetaMask and snap status. - * * @param props - React Props. * @param props.children - React component to be wrapped by the Provider. * @returns JSX. */ export const MetaMaskProvider = ({ children }: { children: ReactNode }) => { + // eslint-disable-next-line no-restricted-globals if (typeof window === 'undefined') { return <>{children}; } @@ -94,17 +89,21 @@ export const MetaMaskProvider = ({ children }: { children: ReactNode }) => { }); } + // eslint-disable-next-line @typescript-eslint/no-floating-promises detectFlask(); if (state.isFlask) { + // eslint-disable-next-line @typescript-eslint/no-floating-promises detectSnapInstalled(); } + // eslint-disable-next-line no-restricted-globals }, [state.isFlask, window.ethereum]); useEffect(() => { let timeoutId: number; if (state.error) { + // eslint-disable-next-line no-restricted-globals timeoutId = window.setTimeout(() => { dispatch({ type: MetamaskActions.SetError, @@ -115,6 +114,7 @@ export const MetaMaskProvider = ({ children }: { children: ReactNode }) => { return () => { if (timeoutId) { + // eslint-disable-next-line no-restricted-globals window.clearTimeout(timeoutId); } }; diff --git a/packages/site/src/pages/index.tsx b/packages/site/src/pages/index.tsx index 47e054b..7ce3a1d 100644 --- a/packages/site/src/pages/index.tsx +++ b/packages/site/src/pages/index.tsx @@ -1,6 +1,6 @@ import { Client, SnapProvider } from '@xmtp/xmtp-js'; import { useCallback, useContext, useState } from 'react'; -import styled from 'styled-components'; +import { styled } from 'styled-components'; import { ConnectButton, @@ -107,9 +107,9 @@ const Index = () => { type: MetamaskActions.SetInstalled, payload: installedSnap, }); - } catch (e) { - console.error(e); - dispatch({ type: MetamaskActions.SetError, payload: e }); + } catch (error) { + console.error(error); + dispatch({ type: MetamaskActions.SetError, payload: error }); } }; @@ -153,6 +153,7 @@ const Index = () => { 'Get started by connecting to and installing the example snap.', button: ( @@ -169,6 +170,7 @@ const Index = () => { 'While connected to a local running snap this button will always be displayed in order to update the snap if a change is made.', button: ( @@ -181,7 +183,10 @@ const Index = () => { content={{ title: 'Connect XMTP', description: 'Manage the storage of the snap', - button: , + button: ( + // eslint-disable-next-line @typescript-eslint/no-misused-promises + + ), }} /> diff --git a/packages/site/src/utils/button.ts b/packages/site/src/utils/button.ts index 165b76c..8613d5f 100644 --- a/packages/site/src/utils/button.ts +++ b/packages/site/src/utils/button.ts @@ -1,5 +1,5 @@ -import type { Snap } from '../types'; import { isLocalSnap } from './snap'; +import type { Snap } from '../types'; export const shouldDisplayReconnectButton = (installedSnap?: Snap) => installedSnap && isLocalSnap(installedSnap?.id);