import { Menu } from '@pubsweet/ui'
import { withCountries } from 'pubsweet-component-faraday-ui'

const Wrapped = ({ countries, countryLabel }) => (
  <div>
    <Menu options={countries} placeholder="Select a country" />

    <span>Selected country: {countryLabel('RO')}</span>
  </div>
)

export default withCountries(Wrapped)

import { withFetching } from 'pubsweet-component-faraday-ui'

const Wrapped = ({ isFetching, fetchingError, setFetching, toggleFetching }) => (
  <div>
    {isFetching && <span>I am fetching</span>}
    <span>{`The error: ${fetchingError}`</span>
    <button onClick={() => setFetching(true)}>Set fetching true</button>
    <button onClick={() => setFetching(false)}>Set fetching false</button>
    <button onClick={toggleFetching}>Toggle fetching</button>
  </div>
)

export default withFetching(Wrapped)

import { FileItem, withFileDownload } from 'pubsweet-component-faraday-ui'

const file = {
  id: 'myfile',
  name: 'myfile.pdf',
  size: 100231,
}

const Wrapped = ({ downloadFile }) => (
  <div>
    <FileItem item={file} onDownload={downloadfile} />
  </div>
)

export default withFileDownload(Wrapped)

import { withProps } from 'recompose'
import { FileItem, withFilePreview Wrapped} from 'pubsweet-component-faraday-ui'

const file = {
  id: 'myfile',
  name: 'myfile.pdf',
  size: 100231,
}

const Wrapped = ({ previewFile }) => (
  <div>
    <FileItem item={file} onPreview={previewFile} />
  </div>
)

export default withFilePreview(Wrapped)

import { withPagination } from 'pubsweet-component-faraday-ui'

const Wrapped = ({ page, nextPage, prevPage, paginatedItems, changeItemsPerPage }) => (
  <div>
    <span>Page {page}</span>
    <button onClick={prevPage}>Prev page</button>
    <button onClick={nextPage}>Next page</button>
    <input type="text" onChange={changeItemsPerPage} />
    <div>
    {
      paginatedItems.map(p => <span>{p}<span>)
    }
    </div>
  </div>
)

export default withPagination(Wrapped)

import { Menu } from '@pubsweet/ui'
import { withRoles } from 'pubsweet-component-faraday-ui'

const Wrapped = ({ roles }) => <Menu options={roles} />

export default withRoles(Wrapped)

import { compose, withHandler, withProps } from 'recompose'
import { FileSection, withFileSectionDrop } from 'pubsweet-component-faraday-ui'

const Wrapped = compose(
  withProps({
    files: [...],
    listId: 'CoverLetter',
    maxFiles: 3,
    allowedFileExtensions: ['pdf'],
  }),
  withHandlers({
    changeList: () => (fromListId, toListId, fileId) => {
      // do the actual change here
    }
  }),
  withFileSectionDrop,
)(FileSection)

export default Wrapped

import { compose, withHandler, withProps } from 'recompose'
import { FileSection, withNativeFileDrop } from 'pubsweet-component-faraday-ui'

const Wrapped = compose(
  withProps({
    files: [...],
    listId: 'CoverLetter',
    maxFiles: 3,
    allowedFileExtensions: ['pdf'],
  }),
  withHandlers({
    onFileDrop: () => file => {
      // do something with the dropped file
    }
  }),
  withNativeFileDrop,
)(FileSection)

export default Wrapped

const customErrorLogger = parsedError =>
  console.error(`This is very handled: ${parsedError}`)

// point free notation
anAsyncOperation().catch(handleError(customErrorLogger))

// can be used besides other function calls

anAsyncOperation().catch(err => {
  setFetching(false)
  handleError(customErrorLogger)(err)
})