From 3c43502560c361b74fdbd16bff63b616decdd9b7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pawe=C5=82=20Gadomski?= <xpfk.098@gmail.com>
Date: Thu, 5 Mar 2026 11:45:51 +0100
Subject: [PATCH] Mention TrackMetadata in Metadata docs

---
 .../version-0.25.0/how-to/client/metadata.mdx | 68 +++++++++++++++++++
 1 file changed, 68 insertions(+)

diff --git a/versioned_docs/version-0.25.0/how-to/client/metadata.mdx b/versioned_docs/version-0.25.0/how-to/client/metadata.mdx
index a80ae16..94dcb49 100644
--- a/versioned_docs/version-0.25.0/how-to/client/metadata.mdx
+++ b/versioned_docs/version-0.25.0/how-to/client/metadata.mdx
@@ -209,3 +209,71 @@ export function ListAllNames() {
 
   </TabItem>
 </Tabs>
+
+## Track metadata
+
+Each track published by a peer also carries a `TrackMetadata` object. Unlike peer metadata, track metadata is set internally by the SDK and cannot be modified directly by the user.
+
+It contains the following fields:
+
+- **`type`** — the kind of media the track carries: `camera`, `microphone`, `screenShareVideo`, `screenShareAudio`, `customVideo`, or `customAudio`
+- **`paused`** — whether the track is currently muted/disabled
+- **`displayName`** — the peer's display name, used in recordings
+
+You can read track metadata via the `metadata` property on a track, for example to check whether a peer's camera is enabled:
+
+<Tabs groupId="platform">
+  <TabItem value="web" label="React (Web)">
+
+```tsx
+import React from "react";
+import { usePeers } from "@fishjam-cloud/react-client";
+
+export function CameraStatus() {
+  const { remotePeers } = usePeers();
+
+  return (
+    <div>
+      {remotePeers.map((peer) => {
+        const isCameraEnabled = !peer.cameraTrack?.metadata?.paused;
+        return (
+          <span key={peer.id}>
+            {peer.cameraTrack?.metadata?.displayName ?? "Unknown"}: camera is{" "}
+            {isCameraEnabled ? "on" : "off"}
+          </span>
+        );
+      })}
+    </div>
+  );
+}
+```
+
+  </TabItem>
+  <TabItem value="mobile" label="React Native (Mobile)">
+
+```tsx
+import React from "react";
+import { Text, View } from "react-native";
+import { usePeers } from "@fishjam-cloud/react-native-client";
+
+export function CameraStatus() {
+  const { remotePeers } = usePeers();
+
+  return (
+    <View>
+      {remotePeers.map((peer) => {
+        const isCameraEnabled = !peer.cameraTrack?.metadata?.paused;
+        return (
+          <Text key={peer.id}>
+            {peer.cameraTrack?.metadata?.displayName ?? "Unknown"}: camera is{" "}
+            {isCameraEnabled ? "on" : "off"}
+          </Text>
+        );
+      })}
+    </View>
+  );
+}
+```
+
+  </TabItem>
+</Tabs>