Next.js: Add useLinkStatus mock to next/link export mock

code/frameworks/nextjs/src/export-mocks/link/index.tsx

@@ -64,3 +64,7 @@ MockLink.displayName = 'NextLink';
 
 export default MockLink;
 export { MockLink as Link };
+
+export const useLinkStatus = fn((): { pending: boolean } => ({ pending: false })).mockName(
+  'next/link::useLinkStatus'
+);

code/frameworks/nextjs/template/stories/Link.stories.tsx

@@ -1,8 +1,10 @@
 import React from 'react';
 
 import type { Meta, StoryObj } from '@storybook/nextjs';
+import { useLinkStatus as mockUseLinkStatus } from '@storybook/nextjs/link.mock';
 
-import Link from 'next/link';
+import Link, { useLinkStatus } from 'next/link';
+import { expect, within } from 'storybook/test';
 
 import style from './Link.stories.module.css';
 
@@ -77,3 +79,33 @@ export const InAppDir: Story = {
     },
   },
 };
+
+function LinkStatusComponent() {
+  const { pending } = useLinkStatus();
+  return <div>{pending ? 'Pending' : 'Idle'}</div>;
+}
+
+export const DefaultLinkStatus: Story = {
+  render: () => <LinkStatusComponent />,
+  parameters: {
+    nextjs: { appDirectory: true },
+  },
+  play: async ({ canvasElement }) => {
+    const canvas = within(canvasElement);
+    await expect(canvas.getByText('Idle')).toBeInTheDocument();
+  },
+};
+
+export const PendingLinkStatus: Story = {
+  render: () => <LinkStatusComponent />,
+  parameters: {
+    nextjs: { appDirectory: true },
+  },
+  beforeEach() {
+    mockUseLinkStatus.mockReturnValue({ pending: true });
+  },
+  play: async ({ canvasElement }) => {
+    const canvas = within(canvasElement);
+    await expect(canvas.getByText('Pending')).toBeInTheDocument();
+  },
+};