[ENHANCEMENT] HubCallback should be exported

[ghost]

Before opening, please confirm:

• I have searched for duplicate or closed issues and discussions.
• I have read the guide for submitting bug reports.
• I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.

JavaScript Framework

React Native

Amplify APIs

Authentication

Amplify Categories

auth

Environment information

# Put output below this line
  System:
    OS: macOS 11.5
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
    Memory: 164.05 MB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 14.17.3 - ~/.nvm/versions/node/v14.17.3/bin/node
    Yarn: 1.22.10 - ~/.nvm/versions/node/v14.17.3/bin/yarn
    npm: 6.14.13 - ~/.nvm/versions/node/v14.17.3/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  Browsers:
    Chrome: 92.0.4515.107
    Safari: 14.1.2
  npmPackages:
    @aws-amplify/pushnotification: ^4.2.0 => 4.2.0 
    @babel/core: ^7.12.9 => 7.14.6 
    @babel/runtime: ^7.12.5 => 7.14.6 
    @react-native-async-storage/async-storage: ^1.15.5 => 1.15.5 
    @react-native-community/eslint-config: ^2.0.0 => 2.0.0 
    @react-native-community/masked-view: ^0.1.11 => 0.1.11 
    @react-native-community/netinfo: ^6.0.0 => 6.0.0 
    @react-navigation/bottom-tabs: ^5.11.11 => 5.11.11 
    @react-navigation/material-top-tabs: ^5.3.15 => 5.3.15 
    @react-navigation/native: ^5.9.4 => 5.9.4 
    @react-navigation/stack: ^5.14.5 => 5.14.5 
    @reduxjs/toolkit: ^1.6.1 => 1.6.1 
    @reduxjs/toolkit-query:  1.0.0 
    @reduxjs/toolkit-query-react:  1.0.0 
    @types/jest: ^26.0.23 => 26.0.24 
    @types/react-native: ^0.64.5 => 0.64.12 
    @types/react-test-renderer: ^16.9.2 => 16.9.5 
    HelloWorld:  0.0.1 
    amazon-cognito-identity-js: ^5.0.5 => 5.0.5 
    aws-amplify: ^4.2.0 => 4.2.0 
    axios: ^0.21.1 => 0.21.1 
    babel-jest: ^26.6.3 => 26.6.3 
    eslint: ^7.14.0 => 7.31.0 
    hermes-inspector-msggen:  1.0.0 
    jest: ^26.6.3 => 26.6.3 
    metro-react-native-babel-preset: ^0.64.0 => 0.64.0 
    react: 17.0.1 => 17.0.1 
    react-native: 0.64.1 => 0.64.1 
    react-native-gesture-handler: ^1.10.3 => 1.10.3 
    react-native-inappbrowser-reborn: ^3.6.3 => 3.6.3 
    react-native-keyboard-aware-scroll-view: ^0.9.4 => 0.9.4 
    react-native-maps: 0.28.0 => 0.28.0 
    react-native-reanimated: ^2.2.0 => 2.2.0 
    react-native-safe-area-context: ^3.2.0 => 3.2.0 
    react-native-screens: ^3.4.0 => 3.4.0 
    react-native-tab-view: ^2.16.0 => 2.16.0 
    react-redux: ^7.2.4 => 7.2.4 
    react-test-renderer: 17.0.1 => 17.0.1 
    typescript: ^3.8.3 => 3.9.10 
  npmGlobalPackages:
    @aws-amplify/cli: 5.1.2
    npm: 6.14.13
    ts-node: 10.1.0
    typescript: 4.3.5
    yarn: 1.22.10

Describe the bug

This is rather an enhancement request than a bug report.

Removing a listener from Hub requires to pass the listener function, and hence the function has to be declared in the outer scope. Therefore, it would be great if HubCallback type is provided (i.e., exported).

So we can use it like the below:

import { Auth, Hub } from 'aws-amplify'
function Component() {
  React.useEffect(( ) => {
      const authListener: HubCallback = ({ channel, payload, source, patternInfo }) => {
      }
      Hub.listen('auth', authListener)
     return () => Hub.remove('auth', authListener)
  }, [ ])
}

Furthermore, I don't see any listeners attached when I log Hub.listeners.

Expected behavior

To be able to denote the listener function.

Reproduction steps

Create new react native project with typescript template.
Configure auth category with social oauth.
Add Hub listener, and remove it.

Code Snippet

// Put your code below this line.

Log output

// Put your logs below this line

aws-exports.js

No response

Manual configuration

No response

Additional configuration

No response

Mobile Device

No response

Mobile Operating System

No response

Mobile Browser

No response

Mobile Browser Version

No response

Additional information and screenshots

No response

[jimblanc]

We have published an RFC on our plan for improving TypeScript support in Amplify JS & would love to get your feedback & suggestions!

RFC: Amplify JS TypeScript Improvements

[therealkh]

@jimblanc HubCallback still can't be imported from aws-amplify, have to use @aws-amplify

"aws-amplify": "^5.2.4"

[cwomack]

With the release of the latest major version of Amplify (aws-amplify@>6), this issue should now be resolved! Please refer to our release announcement, migration guide, and documentation for more information.