From 171bcf9c1810340a0fb1ceb611ab233c71aea9ab Mon Sep 17 00:00:00 2001
From: asmyshlyaev177 <asmyshlyaev177+github@gmail.com>
Date: Mon, 9 Dec 2024 18:25:04 +0400
Subject: [PATCH] docs: accent on `useHistory` param for next.js

---
 README.md                                         |  2 +-
 package-lock.json                                 | 15 +++++++++++++++
 .../src/app/(demo)/CodeBlocksNext.tsx             |  3 ++-
 packages/example-nextjs14/src/app/Status.tsx      |  2 +-
 4 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/README.md b/README.md
index c486984..9b0c7ea 100644
--- a/README.md
+++ b/README.md
@@ -171,7 +171,7 @@ import { userState } from './userState';
 
 function MyComponent() {
   // can pass `replace` arg, it's control will `setUrl` will use `rounter.push` or `router.replace`, default replace=true
-  // can pass `searchParams` from server components
+  // can pass `searchParams` from server components, pass `useHistory: false` if you need to fetch smt in the server component
   const { urlState, setUrl, setState, reset } = useUrlState(userState);
 
   return (
diff --git a/package-lock.json b/package-lock.json
index 767a0df..a64aad2 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -32035,6 +32035,21 @@
       "name": "state-in-url",
       "version": "1.0.0",
       "license": "ISC"
+    },
+    "packages/example-nextjs15/node_modules/@next/swc-win32-ia32-msvc": {
+      "version": "14.2.16",
+      "resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-14.2.16.tgz",
+      "integrity": "sha512-jhPl3nN0oKEshJBNDAo0etGMzv0j3q3VYorTSFqH1o3rwv1MQRdor27u1zhkgsHPNeY1jxcgyx1ZsCkDD1IHgg==",
+      "cpu": [
+        "ia32"
+      ],
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
     }
   }
 }
diff --git a/packages/example-nextjs14/src/app/(demo)/CodeBlocksNext.tsx b/packages/example-nextjs14/src/app/(demo)/CodeBlocksNext.tsx
index ecddc70..173259a 100644
--- a/packages/example-nextjs14/src/app/(demo)/CodeBlocksNext.tsx
+++ b/packages/example-nextjs14/src/app/(demo)/CodeBlocksNext.tsx
@@ -24,7 +24,8 @@ import { form } from './form';
 
 export const ComponentA = () => {
   // see docs for all possible params https://github.com/asmyshlyaev177/state-in-url/tree/master/packages/urlstate/next/useUrlState
-  const { urlState, setState, setUrl } = useUrlState(form);// [!code highlight:1]
+  // useHistory: false to update sp on server component
+  const { urlState, setState, setUrl } = useUrlState(form, { useHistory: true }); // [!code highlight:1]
 
   return <>
     <input
diff --git a/packages/example-nextjs14/src/app/Status.tsx b/packages/example-nextjs14/src/app/Status.tsx
index 6fc5919..0da8d3b 100644
--- a/packages/example-nextjs14/src/app/Status.tsx
+++ b/packages/example-nextjs14/src/app/Status.tsx
@@ -78,7 +78,7 @@ function renderObject(obj: object | Array<SimpleVal> | SimpleVal, level = 0, par
 
   if (type === 'object') {
     return (
-      <span className='relative'>
+      <span className='relative' key={`${JSON.stringify(obj)}`}>
         <span>{'{'}</span>
         {Object.entries(obj as Object).map(([key, val])=> (
           <div style={{ marginLeft: (level + 2) * mult }} key={key} className=''>