From 6dd2197d7e58fefdf1555a38feb87b4b1764e667 Mon Sep 17 00:00:00 2001 From: Tanushree Sharma Date: Thu, 19 Dec 2024 16:41:21 -0800 Subject: [PATCH 1/6] adding-csv-to-attachements --- .../tracing/upload_files_with_traces.mdx | 24 +++++++++++++------ 1 file changed, 17 insertions(+), 7 deletions(-) diff --git a/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx b/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx index c9892424..ca5c0610 100644 --- a/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx +++ b/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx @@ -23,7 +23,7 @@ The following features are available in the following SDK versions: - JS/TS SDK: >=0.2.5 ::: -LangSmith supports uploading binary files (such as images, audio, videos, and PDFs) with your traces. This is particularly useful when working with LLM pipelines using multimodal inputs or outputs. +LangSmith supports uploading binary files (such as images, audio, videos, PDFs and CSVs) with your traces. This is particularly useful when working with LLM pipelines using multimodal inputs or outputs. In both the Python and TypeScript SDKs, attachments can be added to your traces by specifying the MIME type and binary content of each file. This guide explains how to define and trace attachments using the `Attachment` type in Python and `Uint8Array` / `ArrayBuffer` in TypeScript. @@ -41,8 +41,9 @@ def trace_with_attachments( audio: Attachment, video: Attachment, pdf: Attachment, + csv: Attachment, ): - return f"Processed: {val}, {text}, {len(image.data)}, {len(audio.data)}, {len(video.data)}, {len(pdf.data)}"\n\n + return f"Processed: {val}, {text}, {len(image.data)}, {len(audio.data)}, {len(video.data)}, {len(pdf.data), {len(csv.data)}}"\n\n # Helper function to load files as bytes def load_file(file_path: str) -> bytes: with open(file_path, "rb") as f: @@ -52,10 +53,13 @@ image_data = load_file("my_image.png") audio_data = load_file("my_mp3.mp3") video_data = load_file("my_video.mp4") pdf_data = load_file("my_document.pdf") +csv_data = load_file("my_csv.csv") image_attachment = Attachment(mime_type="image/png", data=image_data) audio_attachment = Attachment(mime_type="audio/mpeg", data=audio_data) video_attachment = Attachment(mime_type="video/mp4", data=video_data) pdf_attachment = Attachment(mime_type="application/pdf", data=pdf_data) +csv_attachment = Attachment(mime_type="text/csv", data=csv_data) + # Define other parameters val = 42 text = "Hello, world!" @@ -67,6 +71,7 @@ result = trace_with_attachments( audio=audio_attachment, video=video_attachment, pdf=pdf_attachment, + csv=csv_attachment, )`, `In the Python SDK, you can use the \`Attachment\` type to add files to your traces. Each \`Attachment\` requires:\n @@ -83,9 +88,11 @@ Each \`Attachment\` requires:\n attachment: Uint8Array, attachment2: ArrayBuffer, attachment3: Uint8Array, - attachment4: ArrayBuffer + attachment4: ArrayBuffer, + attachment5: Uint8Array, + ) => - \`Processed: \${val}, \${text}, \${attachment.length}, \${attachment2.byteLength}, \${attachment3.length}, \${attachment4.byteLength}\`, + \`Processed: \${val}, \${text}, \${attachment.length}, \${attachment2.byteLength}, \${attachment3.length}, \${attachment4.byteLength}\, \${attachment5.byteLength}\`, { name: "traceWithAttachments", extractAttachments: ( @@ -94,13 +101,15 @@ Each \`Attachment\` requires:\n attachment: Uint8Array, attachment2: ArrayBuffer, attachment3: Uint8Array, - attachment4: ArrayBuffer + attachment4: ArrayBuffer, + attachment5: Uint8Array, ) => [ { "image inputs": ["image/png", attachment], "mp3 inputs": ["audio/mpeg", new Uint8Array(attachment2)], "video inputs": ["video/mp4", attachment3], "pdf inputs": ["application/pdf", new Uint8Array(attachment4)], + "csv inputs": ["text/csv", new Uint8Array(attachment5)] }, { val, text }, ], @@ -112,12 +121,13 @@ Each \`Attachment\` requires:\n const mp3ArrayBuffer = mp3Buffer.buffer; // Convert to ArrayBuffer\n const video = await fs.readFile("my_video.mp4"); // Uint8Array const pdfBuffer = await fs.readFile("my_document.pdf"); - const pdfArrayBuffer = pdfBuffer.buffer; // Convert to ArrayBuffer\n + const pdfArrayBuffer = pdfBuffer.buffer; // Convert to ArrayBuffer + const csv = await fs.readFile("test-vals.csv"); // Uint8Array\n // Define example parameters const val = 42; const text = "Hello, world!";\n // Call traceableWithAttachments with the files - const result = await traceableWithAttachments(val, text, image, mp3ArrayBuffer, video, pdfArrayBuffer);`, + const result = await traceableWithAttachments(val, text, image, mp3ArrayBuffer, video, pdfArrayBuffer, csv);`, `In the TypeScript SDK, you can add attachments to traces by using \`Uint8Array\` or \`ArrayBuffer\` as data types. Each attachment's MIME type is specified within \`extractAttachments\`:\n\n - \`Uint8Array\`: Useful for handling binary data directly. From c4f59c6b71be4d4db000a01a89213eb6dd68c2df Mon Sep 17 00:00:00 2001 From: Tanushree <87711021+tanushree-sharma@users.noreply.github.com> Date: Thu, 19 Dec 2024 16:43:39 -0800 Subject: [PATCH 2/6] Update docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx --- .../how_to_guides/tracing/upload_files_with_traces.mdx | 1 - 1 file changed, 1 deletion(-) diff --git a/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx b/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx index ca5c0610..15d4a2fc 100644 --- a/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx +++ b/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx @@ -90,7 +90,6 @@ Each \`Attachment\` requires:\n attachment3: Uint8Array, attachment4: ArrayBuffer, attachment5: Uint8Array, - ) => \`Processed: \${val}, \${text}, \${attachment.length}, \${attachment2.byteLength}, \${attachment3.length}, \${attachment4.byteLength}\, \${attachment5.byteLength}\`, { From f4707a632b845339212fd9b1532dfec037068881 Mon Sep 17 00:00:00 2001 From: Tanushree Sharma Date: Thu, 19 Dec 2024 16:44:53 -0800 Subject: [PATCH 3/6] linting --- .../tracing/upload_files_with_traces.mdx | 139 +++++++++--------- 1 file changed, 71 insertions(+), 68 deletions(-) diff --git a/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx b/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx index 15d4a2fc..a51b6be9 100644 --- a/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx +++ b/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx @@ -61,89 +61,92 @@ pdf_attachment = Attachment(mime_type="application/pdf", data=pdf_data) csv_attachment = Attachment(mime_type="text/csv", data=csv_data) # Define other parameters + val = 42 text = "Hello, world!" + # Call the function with traced attachments + result = trace_with_attachments( - val=val, - text=text, - image=image_attachment, - audio=audio_attachment, - video=video_attachment, - pdf=pdf_attachment, - csv=csv_attachment, +val=val, +text=text, +image=image_attachment, +audio=audio_attachment, +video=video_attachment, +pdf=pdf_attachment, +csv=csv_attachment, )`, `In the Python SDK, you can use the \`Attachment\` type to add files to your traces. Each \`Attachment\` requires:\n + - \`mime_type\` (str): The MIME type of the file (e.g., \`"image/png"\`). - \`data\` (bytes): The binary content of the file.\n - Simply decorate a function with \`@traceable\` and include your \`Attachment\` instances as arguments.` - ), - TypeScriptBlock( - `import { traceable } from "langsmith/traceable";\n - const traceableWithAttachments = traceable( - ( - val: number, - text: string, - attachment: Uint8Array, - attachment2: ArrayBuffer, - attachment3: Uint8Array, - attachment4: ArrayBuffer, - attachment5: Uint8Array, - ) => - \`Processed: \${val}, \${text}, \${attachment.length}, \${attachment2.byteLength}, \${attachment3.length}, \${attachment4.byteLength}\, \${attachment5.byteLength}\`, - { - name: "traceWithAttachments", - extractAttachments: ( - val: number, - text: string, - attachment: Uint8Array, - attachment2: ArrayBuffer, - attachment3: Uint8Array, - attachment4: ArrayBuffer, - attachment5: Uint8Array, - ) => [ - { - "image inputs": ["image/png", attachment], - "mp3 inputs": ["audio/mpeg", new Uint8Array(attachment2)], - "video inputs": ["video/mp4", attachment3], - "pdf inputs": ["application/pdf", new Uint8Array(attachment4)], - "csv inputs": ["text/csv", new Uint8Array(attachment5)] - }, - { val, text }, - ], - } - );\n - const fs = Deno // or Node.js fs module\n - const image = await fs.readFile("my_image.png"); // Uint8Array - const mp3Buffer = await fs.readFile("my_mp3.mp3"); - const mp3ArrayBuffer = mp3Buffer.buffer; // Convert to ArrayBuffer\n - const video = await fs.readFile("my_video.mp4"); // Uint8Array - const pdfBuffer = await fs.readFile("my_document.pdf"); - const pdfArrayBuffer = pdfBuffer.buffer; // Convert to ArrayBuffer - const csv = await fs.readFile("test-vals.csv"); // Uint8Array\n - // Define example parameters - const val = 42; - const text = "Hello, world!";\n - // Call traceableWithAttachments with the files - const result = await traceableWithAttachments(val, text, image, mp3ArrayBuffer, video, pdfArrayBuffer, csv);`, - `In the TypeScript SDK, you can add attachments to traces by using \`Uint8Array\` or \`ArrayBuffer\` as data types. + Simply decorate a function with \`@traceable\` and include your \`Attachment\` instances as arguments.` ), + TypeScriptBlock( + `import { traceable } from "langsmith/traceable";\n + const traceableWithAttachments = traceable( + ( + val: number, + text: string, + attachment: Uint8Array, + attachment2: ArrayBuffer, + attachment3: Uint8Array, + attachment4: ArrayBuffer, + attachment5: Uint8Array, + ) => + \`Processed: \${val}, \${text}, \${attachment.length}, \${attachment2.byteLength}, \${attachment3.length}, \${attachment4.byteLength}\, \${attachment5.byteLength}\`, + { + name: "traceWithAttachments", + extractAttachments: ( + val: number, + text: string, + attachment: Uint8Array, + attachment2: ArrayBuffer, + attachment3: Uint8Array, + attachment4: ArrayBuffer, + attachment5: Uint8Array, + ) => [ + { + "image inputs": ["image/png", attachment], + "mp3 inputs": ["audio/mpeg", new Uint8Array(attachment2)], + "video inputs": ["video/mp4", attachment3], + "pdf inputs": ["application/pdf", new Uint8Array(attachment4)], + "csv inputs": ["text/csv", new Uint8Array(attachment5)] + }, + { val, text }, + ], + } + );\n + const fs = Deno // or Node.js fs module\n + const image = await fs.readFile("my_image.png"); // Uint8Array + const mp3Buffer = await fs.readFile("my_mp3.mp3"); + const mp3ArrayBuffer = mp3Buffer.buffer; // Convert to ArrayBuffer\n + const video = await fs.readFile("my_video.mp4"); // Uint8Array + const pdfBuffer = await fs.readFile("my_document.pdf"); + const pdfArrayBuffer = pdfBuffer.buffer; // Convert to ArrayBuffer + const csv = await fs.readFile("test-vals.csv"); // Uint8Array\n + // Define example parameters + const val = 42; + const text = "Hello, world!";\n + // Call traceableWithAttachments with the files + const result = await traceableWithAttachments(val, text, image, mp3ArrayBuffer, video, pdfArrayBuffer, csv);`, + `In the TypeScript SDK, you can add attachments to traces by using \`Uint8Array\` or \`ArrayBuffer\` as data types. Each attachment's MIME type is specified within \`extractAttachments\`:\n\n - \`Uint8Array\`: Useful for handling binary data directly. - \`ArrayBuffer\`: Represents fixed-length binary data, which can be converted to \`Uint8Array\` as needed.\n Wrap your function with \`traceable\` and include your attachments within the \`extractAttachments\` option.\n -In the TypeScript SDK, the \`extractAttachments\` function is an optional parameter in the \`traceable\` configuration. When the traceable-wrapped function is invoked, it extracts binary data (e.g., images, audio files) from your inputs and logs them alongside other trace data, specifying their MIME types.\n -\`\`\` -type AttachmentData = Uint8Array | ArrayBuffer; -type Attachments = Record;\n -extractAttachments?: ( -...args: Parameters -) => [Attachments | undefined, KVMap]; -\`\`\`` - ), + In the TypeScript SDK, the \`extractAttachments\` function is an optional parameter in the \`traceable\` configuration. When the traceable-wrapped function is invoked, it extracts binary data (e.g., images, audio files) from your inputs and logs them alongside other trace data, specifying their MIME types.\n + \`\`\` + type AttachmentData = Uint8Array | ArrayBuffer; + type Attachments = Record;\n + extractAttachments?: ( + ...args: Parameters + ) => [Attachments | undefined, KVMap]; + \`\`\`` + ), ]} groupId="client-language" -/> + /> Here is how the above would look in the LangSmith UI. You can expand each attachment to view its contents. ![](./static/trace_with_attachments.png) From a029716af17e8510fff20892f72d926cf5c0b682 Mon Sep 17 00:00:00 2001 From: Tanushree <87711021+tanushree-sharma@users.noreply.github.com> Date: Mon, 23 Dec 2024 09:07:31 -0800 Subject: [PATCH 4/6] Update docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx --- .../how_to_guides/tracing/upload_files_with_traces.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx b/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx index a51b6be9..1c7610e2 100644 --- a/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx +++ b/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx @@ -23,7 +23,7 @@ The following features are available in the following SDK versions: - JS/TS SDK: >=0.2.5 ::: -LangSmith supports uploading binary files (such as images, audio, videos, PDFs and CSVs) with your traces. This is particularly useful when working with LLM pipelines using multimodal inputs or outputs. +LangSmith supports uploading binary files (such as images, audio, videos, PDFs, and CSVs) with your traces. This is particularly useful when working with LLM pipelines using multimodal inputs or outputs. In both the Python and TypeScript SDKs, attachments can be added to your traces by specifying the MIME type and binary content of each file. This guide explains how to define and trace attachments using the `Attachment` type in Python and `Uint8Array` / `ArrayBuffer` in TypeScript. From 4bb04d8d98543ac282c89dcdc8e48ed4bb9b253c Mon Sep 17 00:00:00 2001 From: Tanushree Sharma Date: Mon, 23 Dec 2024 09:10:27 -0800 Subject: [PATCH 5/6] linting --- .../how_to_guides/tracing/upload_files_with_traces.mdx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx b/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx index 1c7610e2..750d135b 100644 --- a/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx +++ b/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx @@ -81,9 +81,9 @@ Each \`Attachment\` requires:\n - \`mime_type\` (str): The MIME type of the file (e.g., \`"image/png"\`). - \`data\` (bytes): The binary content of the file.\n - Simply decorate a function with \`@traceable\` and include your \`Attachment\` instances as arguments.` ), - TypeScriptBlock( - `import { traceable } from "langsmith/traceable";\n + Simply decorate a function with \`@traceable\` and include your \`Attachment\` instances as arguments.` ), +TypeScriptBlock( +`import { traceable } from "langsmith/traceable";\n const traceableWithAttachments = traceable( ( val: number, @@ -130,7 +130,7 @@ Each \`Attachment\` requires:\n const text = "Hello, world!";\n // Call traceableWithAttachments with the files const result = await traceableWithAttachments(val, text, image, mp3ArrayBuffer, video, pdfArrayBuffer, csv);`, - `In the TypeScript SDK, you can add attachments to traces by using \`Uint8Array\` or \`ArrayBuffer\` as data types. + `In the TypeScript SDK, you can add attachments to traces by using \`Uint8Array\` or \`ArrayBuffer\` as data types. Each attachment's MIME type is specified within \`extractAttachments\`:\n\n - \`Uint8Array\`: Useful for handling binary data directly. - \`ArrayBuffer\`: Represents fixed-length binary data, which can be converted to \`Uint8Array\` as needed.\n From 13e6c8d51caa92f8e6f3b3ed2363d30e905a5ef0 Mon Sep 17 00:00:00 2001 From: Tanushree Sharma Date: Mon, 23 Dec 2024 09:14:54 -0800 Subject: [PATCH 6/6] fixing linting again --- .../how_to_guides/tracing/upload_files_with_traces.mdx | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx b/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx index 750d135b..47df26f7 100644 --- a/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx +++ b/docs/observability/how_to_guides/tracing/upload_files_with_traces.mdx @@ -81,9 +81,8 @@ Each \`Attachment\` requires:\n - \`mime_type\` (str): The MIME type of the file (e.g., \`"image/png"\`). - \`data\` (bytes): The binary content of the file.\n - Simply decorate a function with \`@traceable\` and include your \`Attachment\` instances as arguments.` ), -TypeScriptBlock( -`import { traceable } from "langsmith/traceable";\n + Simply decorate a function with \`@traceable\` and include your \`Attachment\` instances as arguments.`), +TypeScriptBlock(`import { traceable } from "langsmith/traceable";\n const traceableWithAttachments = traceable( ( val: number,