I'm getting the following error: "Cannot read properties of null (reading 'locale')".
Am I doing it wrong?
My component depends on the params.locale value, and therefore I need to use it. But the story file is not working and I get the error you see above.
My story file looks like this:
import { useParams, usePathname } from 'next/navigation';
import NavigationLink from './NavigationLink';
import { mockNavigationLinkProps } from './NavigationLink.mocks';
const meta: Meta<typeof NavigationLink> = {
title: 'Components/NavigationLink',
component: NavigationLink,
tags: ['autodocs'],
parameters: {
layout: 'fullscreen',
nextjs: {
appDirectory: true,
navigation: {
pathname: '/sv/',
query: {
locale: 'sv',
},
},
},
},
decorators: [
(Story) => {
const pathname = usePathname();
const params = useParams();
return (
<div>
<h1>Current Locale: {params.locale}</h1>
<Story />
</div>
);
},
],
};
export default meta;
type Story = StoryObj<typeof NavigationLink>;
export const Base: Story = {
args: {
...mockNavigationLinkProps.base,
},
};