style: lint with new rules

AutarkLabs · Jan 30, 2020 · 667058a · 667058a
1 parent caad21a
commit 667058a
Show file tree

Hide file tree

Showing 35 changed files with 253 additions and 204 deletions.
diff --git a/app/api-react.js b/app/api-react.js
@@ -11,80 +11,82 @@ const initialState = process.env.NODE_ENV !== 'production' && {
   isSyncing: false,
   votes: [
     {
-      id: '0',
+      app: '0xbaB65A7D8a8F67D38cD26af113b95279fA3E7616',
       description: 'Mint 1 ETH for 0xE7F5Fd82F861343Fbe794E4796dC3Ff8999B0Ee4',
-      yea: '1000000000000000000',
+      id: '0',
       nay: '0',
       status: VOTING_STATUS_PENDING_ENACTMENT,
-      app: '0xbaB65A7D8a8F67D38cD26af113b95279fA3E7616',
+      yea: '1000000000000000000',
     },
     {
-      id: '1',
+      app: '0x978f4De6B4833e956a366A441B277deB7A7C0d4c',
       description: 'Mint 19 ETH for 0xE7F5Fd82F861343Fbe794E4796dC3Ff8999B0Ee4',
-      yea: '3000000000000000000',
+      id: '1',
       nay: '1000000000000000000',
       status: VOTING_STATUS_ONGOING,
-      app: '0x978f4De6B4833e956a366A441B277deB7A7C0d4c',
+      yea: '3000000000000000000',
     },
   ],
   widgets: [
     {
-      id: 0,
-      type: TYPE_MARKDOWN,
       data: '# Title for Markdown test 🐈',
+      id: 0,
       layout: { primary: true },
+      type: TYPE_MARKDOWN,
     },
     {
-      id: 1,
-      type: TYPE_VOTES,
       data: {
       },
+      id: 1,
       layout: { primary: false },
+      type: TYPE_VOTES,
     },
     {
-      id: 2,
-      type: TYPE_MARKDOWN,
       data: '# hello, `WORLD`! 🌐👽',
+      id: 2,
       layout: { primary: true },
+      type: TYPE_MARKDOWN,
     },
     {
-      id: 3,
-      type: TYPE_VOTES,
       data: {
       },
+      id: 3,
       layout: { primary: true },
+      type: TYPE_VOTES,
     },
     {
-      id: 4,
-      type: TYPE_MARKDOWN,
       data: 'Unicorns exist 🦄',
+      id: 4,
       layout: { primary: true },
+      type: TYPE_MARKDOWN,
     },
-  ]
+  ],
 }
 
 const functions =
   process.env.NODE_ENV !== 'production' &&
   ((appState, setAppState) => ({
-    addWidget: (_id ,cId) => ({
+    addWidget: (_id, cId) => ({
       toPromise: async () =>{
         const widgetObj = (await ipfs.dag.get(cId)).value
         setAppState({
           ...appState,
-          widgets: [ ...appState.widgets, { ...widgetObj }],
-        })}
+          widgets: [ ...appState.widgets, { ...widgetObj } ],
+        })},
     })
     ,
     setSyncing: syncing =>
       setAppState({
         ...appState,
         isSyncing: syncing,
-      })
+      }),
   }))
 
-const { AragonApi, useAragonApi, useNetwork, usePath } = buildStubbedApiReact({
-  initialState,
+
+// TODO: Add and export usePath
+const { AragonApi, useAragonApi, useNetwork } = buildStubbedApiReact({
   functions,
+  initialState,
 })
 
-export { AragonApi, useAragonApi, useNetwork, usePath }
+export { AragonApi, useAragonApi, useNetwork }
diff --git a/app/assets/toolbar/index.js b/app/assets/toolbar/index.js
@@ -10,18 +10,19 @@ import quote from './quote.svg'
 import size from './size.svg'
 
 // TODO: Convert to one simple component that accepts different icons
-const iconPropTypes = { height: PropTypes.string, width: PropTypes.string, }
+const iconPropTypes = { height: PropTypes.string, width: PropTypes.string }
+const iconDefaultProps = { height: 'auto', width: 'auto' }
 
-export const Bold = ({ height = 'auto', width = 'auto' }) => (
+export const Bold = ({ height, width }) => (
   <img src={bold} alt="Bold" title="Bold" height={height} width={width} />
 )
-export const Code = ({ height = 'auto', width = 'auto' }) => (
+export const Code = ({ height, width }) => (
   <img src={code} alt="Code" title="Code" height={height} width={width} />
 )
-export const Italic = ({ height = 'auto', width = 'auto' }) => (
+export const Italic = ({ height, width }) => (
   <img src={italic} alt="Italic" title="Italic" height={height} width={width} />
 )
-export const Link = ({ height = 'auto', width = 'auto' }) => (
+export const Link = ({ height, width }) => (
   <img
     src={link}
     alt="Insert link"
@@ -30,7 +31,7 @@ export const Link = ({ height = 'auto', width = 'auto' }) => (
     width={width}
   />
 )
-export const List = ({ height = 'auto', width = 'auto' }) => (
+export const List = ({ height, width }) => (
   <img
     src={list}
     alt="Unordered list"
@@ -39,10 +40,10 @@ export const List = ({ height = 'auto', width = 'auto' }) => (
     width={width}
   />
 )
-export const Quote = ({ height = 'auto', width = 'auto' }) => (
+export const Quote = ({ height, width }) => (
   <img src={quote} alt="Quote" title="Quote" height={height} width={width} />
 )
-export const TextSize = ({ height = 'auto', width = 'auto' }) => (
+export const TextSize = ({ height, width }) => (
   <img
     src={size}
     alt="Cycle headers"
@@ -59,3 +60,11 @@ Link.propTypes = iconPropTypes
 List.propTypes = iconPropTypes
 Quote.propTypes = iconPropTypes
 TextSize.propTypes = iconPropTypes
+
+Bold.defaultProps = iconDefaultProps
+Code.defaultProps = iconDefaultProps
+Italic.defaultProps = iconDefaultProps
+Link.defaultProps = iconDefaultProps
+List.defaultProps = iconDefaultProps
+Quote.defaultProps = iconDefaultProps
+TextSize.defaultProps = iconDefaultProps
diff --git a/app/components/App.js b/app/components/App.js
@@ -15,7 +15,7 @@ import { ipfs } from '../utils/ipfs'
 import { IdentityProvider } from '../utils/identity-manager'
 
 const App = ({ api, widgets, isSyncing }) => {
-  const { editMode, setEditMode, editedWidgets, } = useEditMode()
+  const { editMode, setEditMode, editedWidgets } = useEditMode()
   const [ panelVisible, setPanelVisible ] = useState(false)
 
   const handleEditLayout = () => {
@@ -33,7 +33,7 @@ const App = ({ api, widgets, isSyncing }) => {
       await ipfs.dag.put(nextWidgets, { pin: true })
     ).toBaseEncodedString()
     api.updateContent(cId).toPromise()
-  }, [widgets])
+  }, [ api, widgets ])
 
   const handleEditModeCancel = () => {
     setEditMode(false)
@@ -45,7 +45,7 @@ const App = ({ api, widgets, isSyncing }) => {
     ).toBaseEncodedString()
     api.updateContent(cId).toPromise()
     setEditMode(false)
-  }, [editedWidgets])
+  }, [ api, editedWidgets, setEditMode ])
 
   return (
     <>
@@ -67,43 +67,44 @@ const App = ({ api, widgets, isSyncing }) => {
           <Header
             primary="About"
             secondary={editMode
-              ? <EditModeButtons onCancel={handleEditModeCancel} onSubmit={handleEditModeSubmit}/>
+              ? <EditModeButtons onCancel={handleEditModeCancel} onSubmit={handleEditModeSubmit} />
               : <ActionsButton
                 onClickEditLayout={handleEditLayout}
                 onClickNewWidget={handleNewWidget}
               />
             }
           />
-          <Layout widgets={widgets}/>
+          <Layout widgets={widgets} />
         </>
       )}
       <SidePanel
         opened={panelVisible}
         onClose={() => setPanelVisible(false)}
         title={'New widget'}
       >
-        <Panel onSubmit={handlePanelSubmit}/>
+        <Panel onSubmit={handlePanelSubmit} />
       </SidePanel>
     </>
   )
 }
 
 App.propTypes = {
-  api: PropTypes.object,
-  widgets: PropTypes.arrayOf(types.widget),
+  api: PropTypes.func.isRequired,
+  // appStateReady: PropTypes.bool,
   isSyncing: PropTypes.bool,
+  widgets: PropTypes.arrayOf(types.widget),
 }
 
 App.defaultProps = {
   // TODO: implement appStateReady
-  appStateReady: false,
+  // appStateReady: false,
   isSyncing: true,
-  widgets: []
+  widgets: [],
 }
 
 // Passing api-react by props allows to type-check with propTypes
 const AboutApp = () => {
-  const { api, appState, guiStyle = {} } = useAragonApi()
+  const { api = {}, appState, guiStyle = {} } = useAragonApi()
   const { appearance } = guiStyle
 
   return (

diff --git a/app/components/Content/EmptyState.js b/app/components/Content/EmptyState.js
@@ -83,7 +83,11 @@ const EmptyState = React.memo(({ isSyncing, onActionClick }) => {
 
 EmptyState.propTypes = {
   isSyncing: PropTypes.bool,
-  onActionClick: PropTypes.func.isRequired
+  onActionClick: PropTypes.func.isRequired,
+}
+
+EmptyState.defaultProps = {
+  isSyncing: true,
 }
 
 EmptyState.displayName = 'EmptyState'

diff --git a/app/components/Content/Layout.js b/app/components/Content/Layout.js
@@ -57,6 +57,10 @@ EmptyMessage.propTypes = {
   primary: PropTypes.bool,
 }
 
+EmptyMessage.defaultProps = {
+  primary: false,
+}
+
 const Layout = ({ widgets }) => {
   //  TODO: A layout preview should come from store (when parsed in vote radspec)
   const { editMode, setEditedWidgets } = useEditMode()
@@ -68,7 +72,7 @@ const Layout = ({ widgets }) => {
   useEffect(() => {
     setPrimaryWidgets(originalPrimaryWidgets)
     setSecondaryWidgets(originalSecondaryWidgets)
-  }, [editMode])
+  }, [ editMode, originalPrimaryWidgets, originalSecondaryWidgets ])
 
   const setPrimary = p => {
     const nextWidgets = p.map((e, i) => ({ ...e, index: i, layout: { primary: true } }))
@@ -82,8 +86,8 @@ const Layout = ({ widgets }) => {
 
   useEffect(()=> {
     setEditedWidgets([...new Set([ ...primaryWidgets, ...secondaryWidgets ])])
-  }, [ primaryWidgets, secondaryWidgets ])
-  
+  }, [ primaryWidgets, secondaryWidgets, setEditedWidgets ])
+
 
   if (!editMode) {
     return (
@@ -119,13 +123,13 @@ const Layout = ({ widgets }) => {
           display: grid;
           grid-template-rows: 1fr;
         `}>
-        {primaryWidgets.length === 0 && 
+        {primaryWidgets.length === 0 &&
           <div css={`
             display: flex;
             grid-column: 1/1;
             grid-row: 1/1;
           `}>
-            <EmptyMessage primary/>
+            <EmptyMessage primary />
           </div>}
         <ReactSortable
           css={`
@@ -134,7 +138,7 @@ const Layout = ({ widgets }) => {
           `}
           group="widgets"
           list={primaryWidgets}
-          primary={true}
+          primary
           setList={setPrimary}
         >
           {primaryWidgets.map(WidgetMapper)}
@@ -170,7 +174,7 @@ const Layout = ({ widgets }) => {
 }
 
 Layout.propTypes = {
-  widgets: PropTypes.arrayOf(types.widget),
+  widgets: PropTypes.arrayOf(types.widget).isRequired,
 }
 
 export default Layout