Merge pull request #558 from galahq/flow-upgrade

Upgrade flow and supress all the new errors

.flowconfig

@@ -23,4 +23,4 @@ suppress_comment= \\(.\\|\n\\)*\\$FlowFixMe
 suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(2[0-8]\\|1[0-9]\\|[0-9]\\).[0-9]\\)? *\\).*\n
 
 [version]
-0.83.0
+0.87.0

app/javascript/Case.jsx

@@ -174,6 +174,7 @@ class Case extends React.Component<{
   }
 }
 
+// $FlowFixMe
 export default connect(
   mapStateToProps,
   {

app/javascript/card/CardContents.jsx

@@ -10,7 +10,6 @@ import { injectIntl } from 'react-intl'
 
 import { Editor, EditorState } from 'draft-js'
 import { Route } from 'react-router-dom'
-import { Draggable } from 'react-beautiful-dnd'
 
 import { commentThreadsOpen } from 'shared/routes'
 import { getStyleMap } from 'draft/config'
@@ -272,7 +271,7 @@ const Card = styled.div`
 
   & .c-edgenote-entity {
     ${p =>
-    p.editable &&
+      p.editable &&
       css`
         pointer-events: none;
       `};

app/javascript/card/CitationTooltip.jsx

@@ -166,6 +166,7 @@ class CitationTooltip extends React.Component<*> {
   }
 }
 
+// $FlowFixMe
 export default connect(
   mapStateToProps,
   mapDispatchToProps

app/javascript/card/index.jsx

@@ -22,6 +22,7 @@ import { commentThreadsOpen, commentsOpen } from 'shared/routes'
 import withGetEdgenote from './withGetEdgenote'
 import { applySmartTypography } from 'shared/draftHelpers'
 
+import type { DragHandleProps } from 'react-beautiful-dnd'
 import type { ContextRouter } from 'react-router-dom'
 import type { DraftHandleValue } from 'draft-js/lib/DraftHandleValue'
 
@@ -33,6 +34,7 @@ import type { State, Citation } from 'redux/state'
  */
 type OwnProps = {|
   ...ContextRouter,
+  dragHandleProps: DragHandleProps,
   id: string,
   nonNarrative: boolean,
   title?: React.Node,
@@ -199,6 +201,7 @@ function mergeProps (
   }
 }
 
+// $FlowFixMe
 export default withRouter(
   connect(
     // $FlowFixMe

app/javascript/catalog/CatalogToolbar.jsx

@@ -52,6 +52,7 @@ const CatalogToolbar = ({ author, history, instructor }: Props) => (
   </ContentItemSelectionContextConsumer>
 )
 
+// $FlowFixMe
 export default withRouter(CatalogToolbar)
 
 class SearchField extends React.Component<

app/javascript/catalog/GalaxyBanner/index.jsx

@@ -21,6 +21,7 @@ const GalaxyBanner = () => (
 )
 export default GalaxyBanner
 
+// $FlowFixMe
 const Container = styled.aside.attrs({ className: 'pt-card pt-elevation-3' })`
   align-items: center;
   background-color: #02284b;

app/javascript/catalog/home/ValueProposition.jsx

@@ -43,6 +43,7 @@ const ValueProposition = () => (
 )
 export default ValueProposition
 
+// $FlowFixMe
 const Container = styled.aside.attrs({ className: 'pt-dark' })`
   color: white;
   display: grid;

app/javascript/catalog/home/helpers.js

@@ -6,7 +6,9 @@ import type { Tag } from 'redux/state'
 
 const sortGroup = (t: Tag) => t.displayName[0]
 
+// $FlowFixMe
 export const groupKeywords = R.pipe(
+  // $FlowFixMe
   R.sortWith([R.ascend(R.prop('displayName'))]),
   R.filter(tag => !tag.category),
   R.groupWith((a, b) => sortGroup(a) === sortGroup(b))

app/javascript/catalog/search_results/LibraryInfo.jsx

@@ -29,7 +29,12 @@ function LibraryInfo ({ history, slug }: Props) {
     }
   }
 
-  React.useEffect(fetchLibraryInfo, [slug])
+  React.useEffect(
+    () => {
+      fetchLibraryInfo()
+    },
+    [slug]
+  )
 
   if (library == null) return null
 
@@ -52,6 +57,7 @@ function LibraryInfo ({ history, slug }: Props) {
     </DocumentTitle>
   )
 }
+// $FlowFixMe
 export default withRouter(LibraryInfo)
 
 const RightFloatLogoContainer = styled.div`

app/javascript/catalog/search_results/index.jsx

@@ -57,7 +57,7 @@ function SearchResults ({
             <FormattedMessage id="search.results" />
           </SectionTitle>
 
-          {loading.cases || resultsLoading ? null : cases.length === 0 ? (
+          {loading.cases || resultsLoading ? null : caseSlugs.length === 0 ? (
             <NoSearchResults />
           ) : (
             <CaseList cases={results} readerIsEditor={readerIsEditor} />

app/javascript/catalog/search_results/useSearchResults.js

@@ -26,7 +26,12 @@ export default function useSearchResults (
     setCaseSlugs(results)
   }
 
-  React.useEffect(fetchResults, [location.pathname, location.search])
+  React.useEffect(
+    () => {
+      fetchResults()
+    },
+    [location.pathname, location.search]
+  )
 
   return [caseSlugs, loading]
 }

app/javascript/catalog/shared.jsx

@@ -47,6 +47,7 @@ export const CaseRow = styled.div`
   transition-property: background, border;
 `
 
+// $FlowFixMe
 export const CaseLinkRow = styled(CaseRow.withComponent('a'))`
   &:hover {
     background-color: #415e77;
@@ -80,6 +81,7 @@ export const Element = ({
   )
 }
 
+// $FlowFixMe
 export const ElementImage = styled.div.attrs({ role: 'presentation' })`
   width: 36px;
   height: 36px;

app/javascript/comments/CommentThreadEntity.jsx

@@ -46,6 +46,7 @@ const CommentThreadEntity = ({ onClick, children }) => {
   )
 }
 
+// $FlowFixMe
 export default withRouter(
   connect(mapStateToProps, null, mergeProps)(CommentThreadEntity)
 )

app/javascript/comments/CommentThreadsTag.jsx

@@ -45,4 +45,5 @@ const CommentThreadsTag = ({ match, count, cardId, acceptSelection }) => (
   </Link>
 )
 
+// $FlowFixMe
 export default connect(mapStateToProps, { acceptSelection })(CommentThreadsTag)

app/javascript/comments/NewCommentButton.jsx

@@ -92,6 +92,7 @@ const NewCommentButton = ({
   </Container>
 )
 
+// $FlowFixMe
 export default connect(mapStateToProps, { acceptSelection })(NewCommentButton)
 
 const UniquenessWarning = () => (

app/javascript/conversation/CommentThreadItem.jsx

@@ -159,6 +159,7 @@ const CommentThreadItem = ({
     </ConversationMetadata>
   </CommentThreadLink>
 )
+// $FlowFixMe
 export default withRouter(
   injectIntl(connect(mapStateToProps, mapDispatchToProps)(CommentThreadItem))
 )

app/javascript/conversation/NoSelectedCommentThread.jsx

@@ -31,6 +31,7 @@ const NoSelectedCommentThread = ({ name, description }) => (
     )}
   </Container>
 )
+// $FlowFixMe
 export default connect(mapStateToProps, () => ({}))(NoSelectedCommentThread)
 
 const Container = styled.div.attrs({ className: 'pt-running-text' })`

app/javascript/conversation/RecentCommentThreads.jsx

@@ -55,6 +55,7 @@ const RecentCommentThreads = ({
     </ScrollView>
   </Container>
 )
+// $FlowFixMe
 export default connect(mapStateToProps, () => ({}))(RecentCommentThreads)
 
 const Container = styled.div`

app/javascript/conversation/ResponseForm.jsx

@@ -48,6 +48,7 @@ class ResponseForm extends React.Component<
     const { editorState } = this.state
     if (reader == null) return null
     return (
+      // $FlowFixMe
       <Container ref={(el: HTMLDivElement) => (this.container = el)}>
         <Identicon width={32} reader={reader} />
         <Input>
@@ -105,6 +106,7 @@ const Container = styled.div`
   }
 `
 
+// $FlowFixMe
 export const EmptyResponseFormContainer = styled(Container)`
   border-top: none;
   padding: 1px;

app/javascript/conversation/SelectedCommentThread.jsx

@@ -207,6 +207,7 @@ class SelectedCommentThread extends React.Component<
     )
   }
 }
+// $FlowFixMe
 export default connect(
   mapStateToProps,
   mapDispatchToProps

app/javascript/conversation/shared.jsx

@@ -7,6 +7,7 @@ import styled, { css } from 'styled-components'
 import { FormattedDate } from 'react-intl'
 import Markdown from 'utility/Markdown'
 
+// $FlowFixMe
 export const CommentThreadBreadcrumbs = styled.ul.attrs({
   className: 'pt-breadcrumbs',
 })`

app/javascript/deployment/contentItemSelectionContext.jsx

@@ -12,7 +12,9 @@ import { submitForm } from 'shared/lti'
 import { Orchard, CSRF } from 'shared/orchard'
 
 const defaultContext = { selecting: false, onSelect: (caseSlug: string) => {} }
-const { Provider: BaseProvider, Consumer } = React.createContext(defaultContext)
+const { Provider: BaseProvider, Consumer } = React.createContext<
+  typeof defaultContext
+>(defaultContext)
 
 type ContentItemSelectionParams = {
   lti_uid: string,

app/javascript/draft/CitationEntity.jsx

@@ -80,6 +80,7 @@ class CitationSpan extends React.Component<Props> {
   }
 }
 
+// $FlowFixMe
 const CitationEntity = connect(
   mapStateToProps,
   mapDispatchToProps

app/javascript/draft/EdgenoteEntity.jsx

@@ -85,4 +85,5 @@ const EdgenoteEntity = connect(mapStateToProps, mapDispatchToProps, mergeProps)(
   EdgenoteSpan
 )
 
+// $FlowFixMe
 export default withRouter(EdgenoteEntity)

app/javascript/edgenotes/Edgenote.jsx

@@ -180,6 +180,7 @@ class BaseEdgenoteFigure extends React.Component<Props> {
               )}
 
               {embedded || (
+                // $FlowFixMe
                 <Statistics
                   inline
                   key={`edgenotes/${slug}`}
@@ -196,6 +197,7 @@ class BaseEdgenoteFigure extends React.Component<Props> {
               >
                 {this.renderQuotationSection() || this.renderImageSection()}
 
+                {/* $FlowFixMe */}
                 <Expansion contents={contents} expansion={expansion} />
 
                 <Caption
@@ -330,12 +332,14 @@ class BaseEdgenoteFigure extends React.Component<Props> {
 
 export const EdgenoteFigure = BaseEdgenoteFigure
 
+// $FlowFixMe
 export default connect(
   mapStateToProps,
   mapDispatchToProps,
   mergeProps
 )(withExpansion(EdgenoteFigure))
 
+// $FlowFixMe
 const Container = styled.figure.attrs({ className: 'edge pt-dark' })`
   position: relative;
   margin: 0 0 1em;
@@ -372,6 +376,7 @@ const Body = styled.div`
 
 const LinkBody = Body.withComponent('a')
 
+// $FlowFixMe
 const DownloadButton = styled.button.attrs({
   className: 'pt-button',
 })`

app/javascript/edgenotes/EdgenoteLibrary.jsx

@@ -120,6 +120,7 @@ class EdgenoteLibrary extends React.Component<Props> {
     )
   }
 }
+// $FlowFixMe
 export default connect(mapStateToProps, { createEdgenote, deleteEdgenote })(
   injectIntl(EdgenoteLibrary)
 )

app/javascript/edgenotes/editor/EditorDialog.jsx

@@ -133,4 +133,5 @@ const EditorDialog = ({
   )
 }
 
+// $FlowFixMe
 export default withExpansion(EditorDialog)

app/javascript/edgenotes/editor/styled.jsx

@@ -16,6 +16,7 @@ export const Overlay = styled.div`
   z-index: 1;
 `
 
+// $FlowFixMe
 export const EditButton = styled(Button).attrs({
   intent: Intent.SUCCESS,
   icon: 'edit',
@@ -28,6 +29,7 @@ export const EditButton = styled(Button).attrs({
   box-shadow: 0 0 10px white;
 `
 
+// $FlowFixMe
 export const Dialog = styled(BaseDialog)`
   width: 772px;
 
@@ -38,6 +40,7 @@ export const Dialog = styled(BaseDialog)`
     `};
 `
 
+// $FlowFixMe
 export const Body = styled.div.attrs({ className: 'pt-dialog-body' })`
   align-items: flex-start;
   display: flex;

app/javascript/edgenotes/index.jsx

@@ -45,6 +45,7 @@ const EdgenotesCard = ({ edgenoteSlugs, oldStyle }) => {
   )
 }
 
+// $FlowFixMe
 export default connect(mapStateToProps, () => ({}))(EdgenotesCard)
 
 export function getEdgenoteSlugs (editorState: EditorState): string[] {

app/javascript/elements/CaseElement.jsx

@@ -156,6 +156,7 @@ class CaseElement extends React.Component<{
   }
 }
 
+// $FlowFixMe
 export default connect(
   mapStateToProps,
   { deleteElement }

app/javascript/overview/Billboard.jsx

@@ -173,11 +173,13 @@ const Billboard = ({
   </Container>
 )
 
+// $FlowFixMe
 export default connect(
   mapStateToProps,
   { updateCase }
 )(Billboard)
 
+// $FlowFixMe
 export const Container = styled.section.attrs({ className: 'Billboard' })`
   position: relative;
 `

app/javascript/overview/BillboardTitle.jsx

@@ -175,11 +175,13 @@ export const UnconnectedBillboardTitle = ({
   )
 }
 
+// $FlowFixMe
 export default connect(
   mapStateToProps,
   { updateCase, displayErrorToast }
 )(UnconnectedBillboardTitle)
 
+// $FlowFixMe
 export const CoverImageContainer = styled.div.attrs({
   className: 'BillboardTitle pt-dark',
 })`

app/javascript/overview/CaseOverview.jsx

@@ -54,4 +54,5 @@ const CaseOverview = ({ editing, location, reader, signInForm }: Props) => {
   )
 }
 
+// $FlowFixMe
 export default connect(mapStateToProps)(CaseOverview)

app/javascript/overview/CommunityChooser.jsx

@@ -130,6 +130,7 @@ export const UnconnectedCommunityChooser = injectIntl(
   }
 )
 
+// $FlowFixMe
 export default connect(mapStateToProps, { updateActiveCommunity })(
   UnconnectedCommunityChooser
 )