Getting params = {"slug":["index"]} when visiting homepage through Link but on hard refresh getting params={}

[coderaja8]

Hi, I am using app router for a project.

In localhost I am always getting params={} but in production I am getting params = {"slug":["index"]} when visiting homepage through Link but on hard refresh getting params={}

After visiting homepage through Link

After refreshing homepage

I am facing this issue after I added Supabase authentication. I am not sure about the specific that cause this issue.
Also I noticed, edge function is generated after i added Supabase authentication. Can this cause this issue by any chance?

Please help me understand if this is expected or a bug.

Thank you.

app/[[...slug]]/layout.js

export default function Layout({ children, params }) {
	const currentCategory = params.slug ? params.slug[0] : "explore";

	console.log(params);
	return (
		<section>
			<CategoriesBar currentCategory={currentCategory} />
			{JSON.stringify(params)}
			{children}
		</section>
	);
}

package.json:

{
	"private": true,
	"scripts": {
		"dev": "next",
		"build": "next build",
		"start": "next start",
		"studio:dev": "npm --prefix studio run start",
		"studio:deploy": "npx vercel env pull && npm --prefix studio run deploy"
	},
	"dependencies": {
		"@portabletext/react": "^2.0.1",
		"@radix-ui/react-dialog": "^1.0.5",
		"@radix-ui/react-label": "^2.0.2",
		"@radix-ui/react-scroll-area": "^1.0.5",
		"@radix-ui/react-separator": "^1.0.3",
		"@radix-ui/react-slot": "^1.0.2",
		"@radix-ui/react-toast": "^1.1.5",
		"@radix-ui/react-toggle": "^1.0.3",
		"@radix-ui/react-toggle-group": "^1.0.4",
		"@radix-ui/react-tooltip": "^1.0.7",
		"@sanity/image-url": "^1.0.2",
		"@sanity/webhook": "^2.0.0",
		"@supabase/ssr": "^0.1.0",
		"@supabase/supabase-js": "^2.39.7",
		"algoliasearch": "^4.22.1",
		"class-variance-authority": "^0.7.0",
		"classnames": "^2.3.1",
		"clsx": "^2.1.0",
		"date-fns": "^2.29.3",
		"eslint-config-next": "^14.1.0",
		"jotai": "^2.7.0",
		"lucide-react": "^0.312.0",
		"next": "^14.1.0",
		"next-sanity": "^8.0.0",
		"react": "^18.2.0",
		"react-dom": "^18.2.0",
		"sanity-algolia": "^1.1.0",
		"tailwind-merge": "^2.2.0",
		"tailwindcss-animate": "^1.0.7",
		"use-debounce": "^10.0.0"
	},
	"devDependencies": {
		"@tailwindcss/typography": "^0.5.10",
		"autoprefixer": "^10.4.13",
		"postcss": "^8.4.21",
		"tailwindcss": "^3.2.4"
	}
}

next.config:

/** @type {import('next').NextConfig} */
module.exports = {
  transpilePackages: ['lucide-react'],
  images: {
    remotePatterns: [
      { hostname: 'cdn.sanity.io' },
      { hostname: 'source.unsplash.com' },
    ],
  },
}