Use NextAuth.js in your Storybook stories.
Respository created to learn more about Storybook Addons
Update .storybook/main.js
and append to your list of addons:
// .storybook/main.js
module.exports = {
addons: ['storybook-addon-next-auth']
}
After restarting your storybook, an additional icon will appear in the toolbar. It allows you to select the current session state:
You may now control and test your component state of useSession()
by the toolbar items:
If you need to change your stories code while using session values, you may access those by the useSession
hook.
import { useSession } from 'next-auth/react';
export const MyStory = (props) => {
// get access to current session data
const session = useSession();
...
Author: Emilio Schaedler Heinzmann
Special thanks for Tom Freudenberg, the creator of next-auth-mock, where I've based my work for this library.