docs(state): add guidance on signals as props (#6574)

Co-authored-by: Giorgio Boa <35845425+gioboa@users.noreply.github.com>

packages/docs/src/routes/docs/(qwik)/components/state/index.mdx

@@ -34,6 +34,7 @@ contributors:
   - aivarsliepa
   - Balastrong
   - Jemsco
+  - shairez
 updated_at: '2023-10-04T21:48:45Z'
 created_at: '2023-03-20T23:45:13Z'
 ---
@@ -73,6 +74,25 @@ export default component$(() => {
 
 This example above shows how `useSignal()` can be used in a counter component to keep track of the count. Modifying the `count.value` property will cause the component to be updated automatically. For instance, when the property is changed in the button click handler as in the example above.
 
+> **NOTE** If you just need to read the signal's value, don't pass the entire signal as a prop, instead pass only its value:
+
+⛔ **Avoid:**
+
+```tsx
+const isClosedSig = useSignal(false);
+
+return <Child isClosed={isClosedSig} />;
+```
+
+✅ **Instead do:**
+
+```tsx
+const isClosedSig = useSignal(false);
+
+return <Child isClosed={isClosedSig.value} />;
+```
+
+
 ## `useStore()`
 
 Works very similarly to `useSignal()`, but it takes an object as its initial value and the reactivity extends to nested objects and arrays by default. One can think of a store as a multiple-value signal or an object made of several signals.