@maazyousafzai/react-native-slacklogin NPM

React Native Slack login

Install

npm install react-native-slacklogin --save

How to get Client ID and Client Secret of slack?

You'll need credentials to use Sign in with Slack. To retrieve your Client ID and secret, you'll need to create a Slack App if you haven't already.

npm.io

in OAuth & Permissions section, add Redirect URLs

after that, you must complete steps in Basic Information

-Add features and functionality
-Install your app to your workspace
-Manage distribution

Usage:

import SlackLogin from 'react-native-slacklogin'
<View>
    <TouchableOpacity onPress={()=> this.slackLogin.show()}>
        <Text style={{color: 'white'}}>Login</Text>
    </TouchableOpacity>
    <SlackLogin
          ref={ref => this.slackLogin = ref}
          clientId='your client id'
          clientSecret='your client secret'
          redirectUrl='your redirect url'
          scopes={['chat:write:user', 'channels:read']}
          onLoginSuccess={(token) => this.setState({ token })}
          onLoginFailure={(data) => this.setState({ failure: data })}
        />
</View>

Props

Property	Type	Description
clientId	PropTypes.string	Slack App ClientId, issued when you created your app (required)
clientSecret	PropTypes.string	clientSecret App ClientId, issued when you created your app (required)
scopes	PropTypes.array	Permissions to request
redirectUrl	PropTypes.string	URL to redirect back to, get it in `OAuth & Permissions` tab
onLoginSuccess	PropTypes.func	Function will be call back on success
onLoginFailure	PropTypes.func	Function will be call back on error
onClose	PropTypes.func	Function will be call back on close modal
modalVisible	PropTypes.bool	true or false
renderClose	PropTypes.func	Render function for customize close button
containerStyle	PropTypes.object	Customize container style
wrapperStyle	PropTypes.object	Customize wrapper style
closeStyle	PropTypes.object	Customize close style

Logout

To logout use clear cookies by using https://github.com/joeferraro/react-native-cookies

import CookieManager from 'react-native-cookies';

  logout() {
    CookieManager.clearAll()
      .then((res) => {
        console.log('CookieManager.clearAll =>', res);
        this.setState({ token: '' })
      });
  }

Pull request

Pull requests are welcome!

slack login auth

react-native-webview

1.0.0

2 years ago