From c250fc593befde3b691437895ce87394969a6c36 Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Sun, 15 Dec 2024 17:29:17 +0900
Subject: [PATCH] chore: improve test-dep-cjs (#665)

---
 .../react-server/examples/basic/deps/cjs/client.js     | 10 +++++++++-
 .../react-server/examples/basic/deps/context/client.js |  2 +-
 .../react-server/examples/basic/deps/context/server.js |  4 ++--
 .../examples/basic/deps/context/server2.js             |  4 ++--
 4 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/packages/react-server/examples/basic/deps/cjs/client.js b/packages/react-server/examples/basic/deps/cjs/client.js
index e885dba61..e728a88b4 100644
--- a/packages/react-server/examples/basic/deps/cjs/client.js
+++ b/packages/react-server/examples/basic/deps/cjs/client.js
@@ -4,5 +4,13 @@ import React from "react";
 import dep from "./client-dep.cjs";
 
 export function TestClient() {
-  return React.createElement("span", null, dep.test);
+  return React.createElement("span", null, useHydrated() ? dep.test : "[...]");
+}
+
+function useHydrated() {
+  return React.useSyncExternalStore(
+    React.useCallback(() => () => {}, []),
+    () => true,
+    () => false,
+  );
 }
diff --git a/packages/react-server/examples/basic/deps/context/client.js b/packages/react-server/examples/basic/deps/context/client.js
index d76e25098..65eb0e303 100644
--- a/packages/react-server/examples/basic/deps/context/client.js
+++ b/packages/react-server/examples/basic/deps/context/client.js
@@ -4,7 +4,7 @@ import React from "react";
 
 const MyContext = React.createContext("not-ok");
 
-export function MyContextProvider(props) {
+export function TestClientProvider(props) {
   return React.createElement(
     MyContext.Provider,
     { value: "ok" },
diff --git a/packages/react-server/examples/basic/deps/context/server.js b/packages/react-server/examples/basic/deps/context/server.js
index 528f5fd74..66e4b80a8 100644
--- a/packages/react-server/examples/basic/deps/context/server.js
+++ b/packages/react-server/examples/basic/deps/context/server.js
@@ -1,6 +1,6 @@
 import React from "react";
-import { MyContextProvider } from "./client.js";
+import { TestClientProvider } from "./client.js";
 
 export function TestServer(props) {
-  return React.createElement(MyContextProvider, null, props.children);
+  return React.createElement(TestClientProvider, null, props.children);
 }
diff --git a/packages/react-server/examples/basic/deps/context/server2.js b/packages/react-server/examples/basic/deps/context/server2.js
index 5deffdffd..e16e3bbfe 100644
--- a/packages/react-server/examples/basic/deps/context/server2.js
+++ b/packages/react-server/examples/basic/deps/context/server2.js
@@ -1,10 +1,10 @@
 // difference from `server.js` is that
 // this uses self exports reference `@hiogawa/test-dep-context/client`
 // instead of relative reference `./client.js`
-import { MyContextProvider } from "@hiogawa/test-dep-context/client";
+import { TestClientProvider } from "@hiogawa/test-dep-context/client";
 import React from "react";
 
 // consume own provider in server entr
 export function TestServer(props) {
-  return React.createElement(MyContextProvider, null, props.children);
+  return React.createElement(TestClientProvider, null, props.children);
 }