How to use the recompact.compose function in recompact

/>
    )}
  
);

Pager.propTypes = {
  controlsProps: PropTypes.shape(PagerControls.propTypes),
  currentIndex: PropTypes.number,
  dimensions: dimensionsPropType,
  onScroll: PropTypes.func,
  onScrollEndDrag: PropTypes.func,
  pages: PropTypes.arrayOf(pagerPagePropType),
  scrollEnabled: PropTypes.bool,
};

export default compose(
  withState('currentIndex', 'setCurrentIndex', 0),
  mapProps(({ dimensions, pages, ...props }) => ({
    ...props,
    dimensions,
    pages: pages.map(page => ({
      ...page,
      dimensions,
    })),
  })),
  withProps(({ pages }) => ({
    scrollEnabled: pages.length > 1,
  })),
  withHandlers({
    onScroll: ({ currentIndex, dimensions, setCurrentIndex }) => ({ nativeEvent }) => {
      const currentOffsetX = get(nativeEvent, 'contentOffset.x', 0);

);
};

SettingsModal.propTypes = {
  currentSettingsPage: PropTypes.oneOf(Object.values(SettingsPages)),
  navigation: PropTypes.object,
  onCloseModal: PropTypes.func,
  onPressBack: PropTypes.func,
  onPressImportSeedPhrase: PropTypes.func,
  onPressSection: PropTypes.func,
};

export default compose(
  withProps(({ navigation }) => ({
    currentSettingsPage: get(
      navigation,
      'state.params.section',
      SettingsPages.default
    ),
  })),
  withHandlers({
    onCloseModal: ({ navigation }) => () => navigation.goBack(),
    onPressBack: ({ navigation }) => () =>
      navigation.setParams({ section: SettingsPages.default }),
    onPressImportSeedPhrase: ({ navigation }) => () => {
      navigation.goBack();
      InteractionManager.runAfterInteractions(() => {
        navigation.navigate('ImportSeedPhraseSheet');
        StatusBar.setBarStyle('light-content');

);

TokenExpandedState.propTypes = {
  change: PropTypes.string,
  changeDirection: PropTypes.bool,
  isOpen: PropTypes.bool,
  onPressSend: PropTypes.func,
  onPressSwap: PropTypes.func,
  price: PropTypes.string,
  selectedAsset: PropTypes.object,
  subtitle: PropTypes.string,
  title: PropTypes.string,
};

export default compose(
  withAccountData,
  withAccountSettings,
  withState('isOpen', 'setIsOpen', false),
  withProps(({ asset: { address, ...asset }, assets }) => {
    let selectedAsset = ethereumUtils.getAsset(assets, address);
    if (!selectedAsset) {
      selectedAsset = asset;
    }
    return {
      change: get(selectedAsset, 'native.change', '-'),
      changeDirection: get(selectedAsset, 'price.relative_change_24h', 0) > 0,
      selectedAsset,
    };
  }),
  withHandlers({
    onOpen: ({ setIsOpen }) => () => {

icon="send"
        label="Send to..."
        onPress={onPressSend}
      />
    
  
);

TokenExpandedState.propTypes = {
  onPressSend: PropTypes.func,
  price: PropTypes.string,
  subtitle: PropTypes.string,
  title: PropTypes.string,
};

export default compose(
  withAccountData,
  withAccountSettings,
  withProps(({
    asset: {
      address,
      name,
      symbol,
      ...asset
    },
    assets,
    nativeCurrencySymbol,
  }) => {
    const selectedAsset = ethereumUtils.getAsset(assets, address);
    return {
      price: get(selectedAsset, 'native.price.display', null),
      subtitle: get(selectedAsset, 'balance.display', symbol),

TokenFamilyWrap.getHeight = getHeight;

const familyIdSelector = state => state.familyId;
const openFamilyTabsSelector = state => state.openFamilyTabs;

const isFamilyOpenSelector = (familyId, openFamilyTabs) => ({
  isFamilyOpen: openFamilyTabs && openFamilyTabs[familyId],
});

const withFamilyOpenStateProps = createSelector(
  [familyIdSelector, openFamilyTabsSelector],
  isFamilyOpenSelector,
);

export default compose(
  withSafeTimeout,
  withFabSendAction,
  withOpenFamilyTabs,
  withProps(withFamilyOpenStateProps),
  withState('areChildrenVisible', 'setAreChildrenVisible', false),
  withHandlers({
    onHideChildren: ({ areChildrenVisible, setAreChildrenVisible }) => () => {
      if (areChildrenVisible) {
        setAreChildrenVisible(false);
      }
    },
    onPressFamilyHeader: ({ familyId, isFamilyOpen, setOpenFamilyTabs }) => () => (
      setOpenFamilyTabs({
        index: familyId,
        state: !isFamilyOpen,
      })

export default Component =>
  compose(
    connect(mapStateToProps),
    withProps(sendableUniqueTokens)
  )(Component);

export default Component =>
  compose(
    connect(mapStateToProps, {
      walletConnectClearTimestamp,
      walletConnectDisconnectAllByDappName,
      walletConnectUpdateTimestamp,
    }),
    withProps(walletConnectSelector)
  )(Component);

export default Component => compose(
  connect(mapStateToProps),
  withProps(transactionsCountSelector),
)(Component);

export default Component => compose(
  connect(mapStateToProps),
  withProps(sortAssets),
)(Component);

export default Component =>
  compose(
    connect(
      mapStateToProps,
      {
        settingsChangeLanguage,
        settingsChangeNativeCurrency,
      }
    ),
    withProps(withLanguageSelector),
    withProps(withNativeCurrencySelector)
  )(Component);