Merge pull request #660 from optimistiks/fix/usesignal-ssr

.changeset/hot-tables-complain.md

@@ -0,0 +1,5 @@
+---
+"@telegram-apps/sdk-react": minor
+---
+
+Prevent useSignal from erroring out during SSR by passing an optional getServerSnapshot function or the signal itself to useSyncExternalStore

packages/sdk-react/src/useSignal.ts

@@ -3,10 +3,19 @@ import { useSyncExternalStore } from 'react';
 /**
  * Returns the underlying signal value updating it each time the signal value changes.
  * @param signal - a signal.
+ * @param getServerSnapshot - an optional function returning the signal value snapshot. It is used only during SSR
+ * to provide an initial value of the signal. When not set, defaults to the signal itself.
  */
-export function useSignal<T>(signal: {
-  (): T;
-  sub(fn: VoidFunction): VoidFunction;
-}): T {
-  return useSyncExternalStore((onStoreChange) => signal.sub(onStoreChange), signal);
+export function useSignal<T>(
+  signal: {
+    (): T;
+    sub(fn: VoidFunction): VoidFunction;
+  },
+  getServerSnapshot?: () => T
+): T {
+  return useSyncExternalStore(
+    (onStoreChange) => signal.sub(onStoreChange),
+    signal,
+    getServerSnapshot || signal
+  );
 }