How to use the ringcentral-widgets/lib/withPhone function in ringcentral-widgets

atRender: getAtRender({
      glipGroups,
      glipPersons,
      onViewPersonProfile,
      onViewGroup,
    }),
    viewProfile(personId) {
      if (personId) {
        onViewPersonProfile(personId);
      }
    },
    dateTimeFormatter,
  };
}

const GlipChatPage = withPhone(
  connect(
    mapToProps,
    mapToFunctions,
  )(GlipChatPanel),
);

export default GlipChatPage;

glipGroups.updateFilter({ pageNumber });
    },
    updateContactSearchFilter(searchFilter) {
      contacts.updateFilter({ searchFilter });
    },
    async createTeam({ teamName, selectedContacts }) {
      const groupId = await glipGroups.createTeam(
        teamName,
        selectedContacts.map((sc) => sc.email),
      );
      onSelectGroup(groupId);
    },
  };
}

const GlipGroupsPage = withPhone(
  connect(
    mapToProps,
    mapToFunctions,
  )(GlipGroupsPanel),
);

export default GlipGroupsPage;

}
function mapToFunctions(_, {
  phone: {
    routerInteraction,
  }
}) {
  return {
    goTo: (path) => {
      if (path) {
        routerInteraction.push(path);
      }
    },
  };
}

const MainView = withPhone(connect(
  mapToProps,
  mapToFunctions
)(TabNavigationView));

export default MainView;

callLogSection.handleLogSection(call);
            } else {
              callLogger.logCall({
                call,
              });
            }
          }}
          currentLocale={locale.currentLocale}
          logTitle={callLogger.logButtonTitle}
        />
      );
    },
  };
}

const CallsListPage = withPhone(connect(mapToProps, mapToFunctions)(CallsListPanel));

export default CallsListPage;

routerInteraction,
  }
}) {
  return {
    onSelectMenu: (menu) => {
      if (menu && menu.path) {
        routerInteraction.push(menu.path);
      }
    },
    onClickAvatar: () => {
      routerInteraction.push('/glip/persons/me');
    }
  };
}

const MainView = withPhone(connect(
  mapToProps,
  mapToFunctions
)(SideBarView));

export default MainView;

glipGroups.updateFilter({ searchFilter });
    },
    onNextPage: (pageNumber) => {
      glipGroups.updateFilter({ pageNumber });
    },
    updateContactSearchFilter: (searchFilter) => {
      contacts.updateFilter({ searchFilter });
    },
    createTeam: async ({ teamName, selectedContacts }) => {
      const groupId = await glipGroups.createTeam(teamName, selectedContacts.map(sc => sc.email));
      routerInteraction.push(`/glip/groups/${groupId}`);
    }
  };
}

const GlipGroupsPage = withPhone(connect(
  mapToProps,
  mapToFunctions
)(GlipGroupsPanel));

export default GlipGroupsPage;

thirdPartyService,
    settingsPageUI,
  } = phone;
  return {
    ...settingsPageUI.getUIFunctions({ phone, ...props }),
    onAutoLogChange(autoLog) { callLogger.setAutoLog(autoLog); },
    onAutoLogSMSChange(autoLog) { conversationLogger.setAutoLog(autoLog); },
    onThirdPartyAuthorize: () => thirdPartyService.authorizeService(),
    onFeedbackSettingsLinkClick() {
      thirdPartyService.onShowFeedback();
    },
    onSettingToggle: setting => thirdPartyService.onSettingToggle(setting),
  };
}

const SettingsPage = withPhone(connect(
  mapToProps,
  mapToFunctions,
)(NewSettingsPanel));

export default SettingsPage;

phone: {
    routerInteraction,
    glipGroups,
  }
}) {
  return {
    startChat: async (personId) => {
      const group = await glipGroups.startChat(personId);
      if (group) {
        routerInteraction.push(`/glip/groups/${group.id}`);
      }
    },
  };
}

const GlipPersonProfilePage = withPhone(connect(
  mapToProps,
  mapToFunctions
)(GlipPersonProfile));

export default GlipPersonProfilePage;

}
      };
      return (
        <a href="{`#${id}`}">@{name}</a>
      );
    },
    viewProfile: (personId) =&gt; {
      if (personId) {
        routerInteraction.push(`/glip/persons/${personId}`);
      }
    },
    dateTimeFormatter,
  };
}

const GlipChatPage = withPhone(connect(
  mapToProps,
  mapToFunctions
)(GlipChatPanel));

export default GlipChatPage;

rateLimiter,
    brand,
    routerInteraction,
    regionSettingsUrl,
    callingSettingsUrl,
  }),
}) {
  return {
    getRenderer,
    dismiss: (id) => {
      alert.dismiss(id);
    },
  };
}

const AlertContainer = withPhone(connect(
  mapToProps,
  mapToFunctions
)(AlertDisplay));

AlertContainer.propTypes = {
  getRenderer: PropTypes.func,
};
AlertContainer.defaultProps = {
  getRenderer: undefined,
};

export default AlertContainer;