import { Streambird } from "@streambird/streambird-react";
import { ErrorData, SuccessData, WalletType } from '@streambird/streambird-js';
const App = () => {
const streambirdConfig = {
emailMagicLink: {
loginRedirectUrl: 'LOGIN_REDIRECT_URL_FROM_PORTAL_GOES_HERE',
registrationRedirectUrl: 'REGISTRATION_REDIRECT_URL_FROM_PORTAL_GOES_HERE',
loginExpiresIn: 5,
registrationExpireIn: 5,
requiresVerification: false,
autoVerify: true
},
componentStyle: {
width: 500,
showHeaderText: true,
headerText: 'Sign in or register',
headerTextColor: '',
bodyText: 'Please enter your email address',
bodyTextColor: '#333333',
buttonTextColor: '#FFFFFF',
buttonColor: '',
errMsgColor: '',
showContainerBorder: true,
containerXAlignment: 'center',
containerYAlignment: 'center',
bodyTextPosition: 'center',
headerTextPosition: 'center'
},
wallet: {
walletType: 'ETH',
network: 'https://goerli.infura.io/v3/INFURA_API_KEY'
}
}
const handleCallbacks = {
onSuccess: (data: SuccessData) => {
console.log(data)
},
onError: (data: ErrorData) => {
console.log(data)
}
}
return (
<div id="login">
<Streambird
publicToken={"YOUR_API_KEY_HERE"}
config={streambirdConfig}
callbacks={handleCallbacks}
/>
</div>
);
};
export default App;
{
eventType: 'EVENT_SUCCESS',
eventData: {
publicAddress: "xvPgUXBKTPUBrBdZWHajG17nWM59Zmx7s5NhXXXXXXX",
sessionJwt: "eyJhbGciOiJ...",
sessionToken: "TqXsQbXoTxKvjRAqVyLjrz8cRdQRM4enTUh9ixkoeClcgldtzs4LUxEB1XXXXXXX",
walletType: "SOL",
public_address: "xvPgUXBKTPUBrBdZWHajG17nWM59Zmx7s5NhXXXXXXX", // legacy field
session_token: "TqXsQbXoTxKvjRAqVyLjrz8cRdQRM4enTUh9ixkoeClcgldtzs4LUxEB1XXXXXXX", // legacy field
wallet_type: "SOL" // legacy field
}
}
import { Streambird } from "@streambird/streambird-react";
import { ErrorData, SuccessData, WalletType } from '@streambird/streambird-js';
const App = () => {
const streambirdConfig = {
emailMagicLink: {
loginRedirectUrl: 'LOGIN_REDIRECT_URL_FROM_PORTAL_GOES_HERE',
registrationRedirectUrl: 'REGISTRATION_REDIRECT_URL_FROM_PORTAL_GOES_HERE',
loginExpiresIn: 5,
registrationExpireIn: 5,
requiresVerification: false,
autoVerify: true
},
componentStyle: {
width: 500,
showHeaderText: true,
headerText: 'Sign in or register',
headerTextColor: '',
bodyText: 'Please enter your email address',
bodyTextColor: '#333333',
buttonTextColor: '#FFFFFF',
buttonColor: '',
errMsgColor: '',
showContainerBorder: true,
containerXAlignment: 'center',
containerYAlignment: 'center',
bodyTextPosition: 'center',
headerTextPosition: 'center'
},
wallet: {
walletType: 'ETH',
network: 'https://goerli.infura.io/v3/INFURA_API_KEY'
}
}
const handleCallbacks = {
onSuccess: (data: SuccessData) => {
console.log(data)
},
onError: (data: ErrorData) => {
console.log(data)
}
}
return (
<div id="login">
<Streambird
publicToken={"YOUR_API_KEY_HERE"}
config={streambirdConfig}
callbacks={handleCallbacks}
/>
</div>
);
};
export default App;
{
eventType: 'EVENT_SUCCESS',
eventData: {
publicAddress: "xvPgUXBKTPUBrBdZWHajG17nWM59Zmx7s5NhXXXXXXX",
sessionJwt: "eyJhbGciOiJ...",
sessionToken: "TqXsQbXoTxKvjRAqVyLjrz8cRdQRM4enTUh9ixkoeClcgldtzs4LUxEB1XXXXXXX",
walletType: "SOL",
public_address: "xvPgUXBKTPUBrBdZWHajG17nWM59Zmx7s5NhXXXXXXX", // legacy field
session_token: "TqXsQbXoTxKvjRAqVyLjrz8cRdQRM4enTUh9ixkoeClcgldtzs4LUxEB1XXXXXXX", // legacy field
wallet_type: "SOL" // legacy field
}
}
import { Streambird } from "@streambird/streambird-react";
import { ErrorData, SuccessData, WalletType } from '@streambird/streambird-js';
const App = () => {
const streambirdConfig = {
emailMagicLink: {
loginRedirectUrl: 'LOGIN_REDIRECT_URL_FROM_PORTAL_GOES_HERE',
registrationRedirectUrl: 'REGISTRATION_REDIRECT_URL_FROM_PORTAL_GOES_HERE',
loginExpiresIn: 5,
registrationExpireIn: 5,
requiresVerification: false,
autoVerify: true
},
componentStyle: {
width: 500,
showHeaderText: true,
headerText: 'Sign in or register',
headerTextColor: '',
bodyText: 'Please enter your email address',
bodyTextColor: '#333333',
buttonTextColor: '#FFFFFF',
buttonColor: '',
errMsgColor: '',
showContainerBorder: true,
containerXAlignment: 'center',
containerYAlignment: 'center',
bodyTextPosition: 'center',
headerTextPosition: 'center'
},
wallet: {
walletType: 'ETH',
network: 'https://goerli.infura.io/v3/INFURA_API_KEY'
}
}
const handleCallbacks = {
onSuccess: (data: SuccessData) => {
console.log(data)
},
onError: (data: ErrorData) => {
console.log(data)
}
}
return (
<div id="login">
<Streambird
publicToken={"YOUR_API_KEY_HERE"}
config={streambirdConfig}
callbacks={handleCallbacks}
/>
</div>
);
};
export default App;
{
eventType: 'EVENT_SUCCESS',
eventData: {
publicAddress: "xvPgUXBKTPUBrBdZWHajG17nWM59Zmx7s5NhXXXXXXX",
sessionJwt: "eyJhbGciOiJ...",
sessionToken: "TqXsQbXoTxKvjRAqVyLjrz8cRdQRM4enTUh9ixkoeClcgldtzs4LUxEB1XXXXXXX",
walletType: "SOL",
public_address: "xvPgUXBKTPUBrBdZWHajG17nWM59Zmx7s5NhXXXXXXX", // legacy field
session_token: "TqXsQbXoTxKvjRAqVyLjrz8cRdQRM4enTUh9ixkoeClcgldtzs4LUxEB1XXXXXXX", // legacy field
wallet_type: "SOL" // legacy field
}
}
Hide attributes
Show childen attributes
https://streambird.io/authenticate
, final url user sees in email will be https://streambird.io/authenticate?token=AUTOGENERATED_MAGIC_TOKEN
. We will redirect to your app in this url and your app should handle and parse the token parameter and allow the user log in.https://streambird.io/authenticate
, final url user sees in email will be https://streambird.io/authenticate?token=AUTOGENERATED_MAGIC_TOKEN
. We will redirect to your app in this url and your app should handle and parse the token parameter and register the user.Show children attributes
Sign in or register
#00FFCC
#000000
#33CC00
#3C4D20
#FF0033
left
, center
, right
top
, center
, bottom
left
, center
, right
left
, center
, right
Hide childen attributes
Show responses
onSuccess(data)
callback function, it will be EVENT_SUCCESS
.Show childen attributes
SOL
, ETH