[UI] Update Column Usage Guide (#857)

Author: jiahuei

services/app/src/lib/components/tables/(sub)/guides/llm.md

@@ -1,6 +1,6 @@
-### Basic Concept
+##### Basic Concept
 
-The **LLM Column** in a **Generative Table** lets you synthesize outputs using a Large Language Model (LLM). You define a prompt (and optionally Retrieval Augmented Generation (RAG) settings), and the LLM generates the value for the column / cell.
+The **LLM Column** in a Generative Table lets you synthesize outputs using a Large Language Model (LLM). You define a prompt (and optionally Retrieval Augmented Generation (RAG) settings), and the LLM generates the value for the column / cell.
 
 The LLM Column will:
 
@@ -17,7 +17,7 @@ You control how the LLM behaves through:
 
 ---
 
-### Referencing Upstream Columns in Prompts
+##### Referencing Upstream Columns in Prompts
 
 The **Prompt** can reference values from upstream columns (columns to the left) using the syntax:
 
@@ -33,26 +33,15 @@ For a row where the `Input` column contains value `Good morning`, the actual pro
 
 > Translate "Good morning" into Italian:
 
-Tips
+To insert a reference, click on the corresponding columns above the Prompt input area. Alternatively, you can manually insert `${Column Name}` into the Prompt.
 
-- To insert a reference, click on the corresponding columns above the Prompt input area
-- Alternatively, you can manually insert `${Column Name}` into the Prompt
-- You can reference multiple columns in the same prompt, as long as the names match your column names exactly (case-sensitive).
-- Repeated references will be not be de-duplicated. For example:
-
-  > <span class="column-variable input-col">Input</span>
-  >
-  > Translate "<span class="column-variable input-col">Input</span>" into Italian:
+You can reference multiple columns in the same prompt, as long as the names match your column names exactly (case-sensitive).
 
-  will result in
-
-  > Good morning
-  >
-  > Translate "Good morning" into Italian:
+See more prompting tips below.
 
 ---
 
-### Retrieval Augmented Generation (RAG)
+##### Retrieval Augmented Generation (RAG)
 
 You can optionally use RAG to ground the LLM’s output in external knowledge stored in a Knowledge Table.
 
@@ -78,10 +67,55 @@ When RAG is enabled, the LLM Column will:
    - After reranking, the top‑`k` references are selected and injected into the prompt sent to the LLM.
 
 5. Optionally generate inline citations
-   - You can enable inline citations in **pandoc style**:
-     ```text
-     [@ref0; @ref1; @ref2]
-     ```
+   - You can enable inline citations in **pandoc style**: `[@ref0; @ref1; @ref2]`
    - When enabled, the generated text can include these citation markers to indicate which references support which statements.
 
 The final prompts sent to the LLM is your System Prompt and Prompt, plus any injected references (and, if configured, citation context), all guided by the settings you choose (k, citations, reranking).
+
+---
+
+##### Multi‑turn Chat
+
+When Multi‑turn Chat is enabled, each generation can use data from previous rows as conversation history, rather than only the current row. By default, rows are ordered from latest to oldest, and the LLM sees all rows from the current one downward as its context.
+
+For example:
+
+1. Create a table with an input column `Query` and a multi‑turn LLM column `Output`.
+2. Add a row where `Query` is `What is 2+2?`. The LLM will respond with `4`.
+3. Add another row where `Query` is `Add 3`. Because multi‑turn chat is enabled, the LLM will understand this as continuing the previous exchange and return `7` as the result.
+
+---
+
+##### Prompting Tips
+
+<!-- prettier-ignore-start -->
+
+- When referencing other columns, it is recommended to separate them using XML tags or Markdown headings. For example:
+
+  > &lt;user-query>
+  > <span class="column-variable input-col">Input</span>
+  > &lt;/user-query>
+  >
+  > Translate user query into Italian.
+
+  <br>
+
+  > \# User Query
+  > <span class="column-variable input-col">Input</span>
+  >
+  > \# Instruction
+  > Translate user query into Italian.
+
+- Repeated references will be not be de-duplicated. For example:
+
+  > <span class="column-variable input-col">Input</span>
+  >
+  > Translate "<span class="column-variable input-col">Input</span>" into Italian:
+
+  will result in
+
+  > Good morning
+  >
+  > Translate "Good morning" into Italian:
+
+<!-- prettier-ignore-end -->

services/app/src/lib/components/tables/(sub)/guides/python.md

@@ -1,6 +1,6 @@
-### Basic Concept
+##### Basic Concept
 
-The **Python Column** in a **Generative Table** lets you generate or transform cell values using custom Python code, so you can build image, audio, and general-purpose transformations directly in your table.
+The **Python Column** in a Generative Table lets you generate or transform cell values using custom Python code, so you can build image, audio, and general-purpose transformations directly in your table.
 
 All upstream columns (columns to the left) are passed to your code as a dictionary named `row` in the global context.
 
@@ -31,7 +31,7 @@ Consider using `try/except` blocks and writing fallback value when needed.
 
 ---
 
-### Preinstalled Libraries
+##### Preinstalled Libraries
 
 The following libraries are available:
 
@@ -57,7 +57,7 @@ The following libraries are available:
 
 ---
 
-### Working with Images
+##### Working with Images
 
 When an upstream column contains an image, its value in `row` is **raw binary data** (`bytes`).
 
@@ -66,7 +66,7 @@ To output an image, make sure:
 - The Python Column has data type `image`.
 - The output image is one of: `.jpeg`, `.jpg`, `.png`, `.gif`, `.webp`.
 
-#### Usage Pattern
+Usage pattern:
 
 1. Read image bytes from `row`.
 2. Perform your image operations (for example, using a library such as Pillow / `PIL`).
@@ -96,7 +96,7 @@ with Image.open(io.BytesIO(image_bytes)) as img:
 
 ---
 
-### Working with Audios
+##### Working with Audios
 
 When an upstream column contains audio, its value in `row` is also **raw binary data** (`bytes`).
 
@@ -105,7 +105,7 @@ To output an audio, make sure:
 - The Python Column has data type `audio`.
 - The output audio is one of: `.mp3`, `.wav`.
 
-#### Usage Pattern
+Usage pattern:
 
 1. Read audio bytes from `row`.
 2. Perform your audio processing (for example, using a library such as `soundfile`).
@@ -134,7 +134,7 @@ row["Python Column Name"] = output_buffer.getvalue()
 
 ---
 
-### Making Web Requests
+##### Making Web Requests
 
 You can use `httpx` to make web requests. By using the appropriate column data type, you can fetch images and audios and save them in the table.