Next 13: Usage of usePathname in client component results in SSR route instead of SSG

[sdorra]

Verify canary release

• I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 21.6.0: Mon Aug 22 20:19:52 PDT 2022; root:xnu-8020.140.49~2/RELEASE_ARM64_T6000
Binaries:
  Node: 16.18.0
  npm: 8.19.2
  Yarn: 1.22.19
  pnpm: 7.14.2
Relevant packages:
  next: 13.0.1
  eslint-config-next: 13.0.1
  react: 18.2.0
  react-dom: 18.2.0

What browser are you using? (if relevant)

No response

How are you deploying your application? (if relevant)

No response

Describe the Bug

Usage of a client component which uses the usePathname hook results in SSR pages on build.

Client Component:

"use client";

import clsx from "clsx";
import Link from "next/link";
import { usePathname } from "next/navigation";
import { FC, PropsWithChildren } from "react";

type Props = PropsWithChildren & {
  href: string;
  exact?: boolean;
  className?: string;
};

const NavLink: FC<Props> = ({ href, className, children, exact = true }) => {
  const path = usePathname();
  const isActive = exact ? href === path : path.startsWith(href);
  return (
    <Link
      className={clsx(className, {
        "text-stone-100 underline decoration-2 underline-offset-2 decoration-pink-600": isActive,
      })}
      href={href}
    >
      {children}
    </Link>
  );
};

export default NavLink;

If this component is used, the routes are rendered as SSR:

Route (app)                                Size     First Load JS
┌ λ /                                      0 B                0 B
├ λ /about                                 141 B          64.5 kB
├ λ /characters                            141 B          64.5 kB

If i replace the usage of the hook e.g.:

-  const path = usePathname();
+  const path = "";

The build renders the routes as SSG:

Route (app)                                Size     First Load JS
┌ ○ /                                      0 B                0 B
├ ○ /about                                 141 B          64.5 kB
├ ○ /characters                            141 B          64.5 kB

Expected Behavior

Should render the routes as SSG.

Link to reproduction

https://github.com/sdorra/rick-and-morty

To Reproduce

Run pnpm install and pnpm build, this should result in SSR routes. Removing the usage usePathname in the NavLink component, should result in SSG routes (after another pnpm build).

[sdorra]

Seems to be fixed with version 13.0.2 (#42440).

[github-actions]

This closed issue has been automatically locked because it had no new activity for a month. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.