How to use the react-i18next.withNamespaces function in react-i18next

)
  }
}

export default componentWithAnalytics(
  connect(
    mapStateToProps,
    {
      fetchExchangeRate,
      showError,
      hideAlert,
    }
  )(withNamespaces(Namespaces.exchangeFlow9)(ExchangeBuyScreen))
)

const styles = StyleSheet.create({
  headerTextContainer: { flex: 1, alignSelf: 'center', alignItems: 'center' },
  line: {
    borderBottomColor: colors.darkLightest,
    borderBottomWidth: 1,
    marginBottom: 16,
  },
  exchangeBodyText: { fontSize: 15, lineHeight: 20, fontWeight: '600' },
  currencyInputText: { fontSize: 24, lineHeight: 39, height: 54 }, // setting height manually b.c. of bug causing text to jump
  container: {
    flex: 1,
    flexDirection: 'column',
    justifyContent: 'space-between',
  },

}

    let section = heroSections.find(({ title }) => title == att);
    section.data.push(hero);
  });

  // to-do: delegate sections to backend
  // sort hero names
  heroSections.forEach(section => section.data.sort((a, b) => 
    (a.name <= b.name) ? -1 : 1
  ));

  return heroSections;
}

@withNamespaces("Screen_Heroes")
@connect(state => ({ 
  heroes: state.wiki.wikiData.heroes,
}))
export default class HeroesScreen extends React.PureComponent {
  static navigationOptions = () => ({
    title: i18next.t("Constants:SCREEN_LABELS.HEROES"),
    ...headerStyle,
  });
  constructor(props) {
    super(props);
    
    this.state = { 
      heroSections: [],
      heroSearch: '',
    }
  }

import { withNamespaces } from 'react-i18next'
import I18n from 'i18next'
import React, { PureComponent } from 'react'

import { Avatar, Header, Menu, Screen, Loader } from '@berty/component'
import { choosePicture } from '@berty/common/helpers/react-native-image-picker'
import { colors } from '@berty/common/constants'
import * as enums from '@berty/common/enums.gen'
import { withGoBack } from '@berty/component/BackActionProvider'
import { withStoreContext } from '@berty/store/context'
import { Store } from '@berty/container'

@withNamespaces()
@withGoBack
@withStoreContext
export class SettingsScreen extends PureComponent {
  constructor(props) {
    super(props)
    const conversation = props.navigation.getParam('conversation')
    const title = conversation.title // utils.getTitle(conversation)

    this.state = {
      edit: false,
      topic: conversation.topic,
      title,
      conversation,
    }
  }

{theme => (
      <button style="{{" size="massive" color="{theme.primarySemantic}">
    )}
  
);

export default withNamespaces('common')(ButtonLogin);
</button>

import React, { Component } from 'react'
import { clipboard } from 'electron'
import { withNamespaces } from 'react-i18next'
import { Card, TextArea, Button, Intent } from '@blueprintjs/core'
import * as Sentry from '@sentry/electron'

@withNamespaces()
export class PluginWrap extends Component {
  state = {
    hasError: false,
    error: null,
    info: null,
    eventId: '',
  }

  static defaultProps = {
    withContainer: true,
  }

  root = React.createRef()

  shouldComponentUpdate = (nextProps, nextState) => {
    return this.props.plugin.timestamp !== nextProps.plugin.timestamp || nextState.hasError === true

}
  })

  return errors
}

const fields = [
  'alias',
  'symbol',
  'decimals',
  'reissue',
  'description[].key',
  'description[].value',
  'quorum'
]
export default withNamespaces('translations') (
  reduxForm({
    form: 'newAssetForm',
    fields,
    validate,
    destroyOnUnmount: false,
    initialValues: {
      decimals: 8,
      reissue: 'false',
      quorum: 1,
    }
  })(NewAssetInfo)
)

margin-left: 1em;
  }

  .bp3-breadcrumb {
    font-size: 12px;
  }
`

const EllipsisIcon = styled.span`
  color: white;
  background: ${props => props.theme.DARK_GRAY1};
  border-radius: 3px;
  padding: 0 4px;
`

@withNamespaces(['setting'])
@connect((state, props) => ({
  value: getStoreConfig(state, props.configName, props.defaultValue),
  configName: props.configName,
  label: props.label,
}))
export class FolderPickerConfig extends Component {
  static propTypes = {
    label: PropTypes.string,
    configName: PropTypes.string,
    value: PropTypes.string,
    isFolder: PropTypes.bool,
    placeholder: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
    exclude: PropTypes.arrayOf(PropTypes.string),
    defaultValue: PropTypes.string,
    extraControl: PropTypes.node,
  }

{item.account && t('form.account')}
            
              {item.accountId && 
                {item.account}
              }
              {!item.accountId && item.account}
            
          
        )}
      
    )
  }
}

export default withNamespaces('translations') (Summary)

height: true,
    },
    onResized: ({ width }) => config.set('poi.tabarea.mainpanelwidth', width),
  }
}

let lockedTab = false

const dispatchTabChangeEvent = (tabInfo, autoSwitch = false) =>
  dispatch({
    type: '@@TabSwitch',
    tabInfo,
    autoSwitch,
  })

@withNamespaces(['setting', 'others'])
@connect(state => ({
  plugins: state.plugins,
  doubleTabbed: getStoreConfig(state, 'poi.tabarea.double', false),
  verticalDoubleTabbed: getStoreConfig(state, 'poi.tabarea.vertical', false),
  useGridMenu: getStoreConfig(state, 'poi.tabarea.grid', true),
  activeMainTab: get(state.ui, 'activeMainTab', 'main-view'),
  activePluginName: get(state.ui, 'activePluginName', get(state.plugins, '0.id', '')),
  mainPanelWidth: getStoreConfig(state, 'poi.tabarea.mainpanelwidth', { px: 0, percent: 50 }),
  mainPanelHeight: getStoreConfig(state, 'poi.tabarea.mainpanelheight', { px: 0, percent: 50 }),
  editable: getStoreConfig(state, 'poi.layout.editable', false),
  windowmode: getStoreConfig(state, 'poi.plugin.windowmode', emptyObj),
  async: getStoreConfig(state, 'poi.misc.async', true),
}))
export class ControlledTabArea extends PureComponent {
  static propTypes = {
    plugins: PropTypes.array.isRequired,

}

import {connect} from 'react-redux'
import actions from 'actions'
import {withNamespaces} from 'react-i18next'

const mapStateToProps = (state, ownProps) => ({
  item: state.key.items[ownProps.params.id],
})

const mapDispatchToProps = ( dispatch ) => ({
  fetchItem: () => dispatch(actions.key.fetchItems()),
  submitReset: (params) => dispatch(actions.key.submitResetForm(params))
})

export default  withNamespaces('translations') (connect(
  mapStateToProps,
  mapDispatchToProps
)(reduxForm({
  form: 'ResetPassword',
  fields: ['oldPassword', 'newPassword', 'repeatPassword' ],
  validate
})(ResetPassword)))