# What Is Thinking Mode in ACE-Step UI? A Chain-of-Thought Configuration Guide

> Learn what Thinking Mode in ACE-Step UI is. Enable chain-of-thought reasoning for LLMs with this client-side toggle for advanced lyric generation.

- Repository: [fspecii/ace-step-ui](https://github.com/fspecii/ace-step-ui)
- Tags: deep-dive
- Published: 2026-04-29

---

**Thinking Mode is a client-side toggle that enables chain-of-thought (CoT) reasoning for the lyric-generation LLM by sending a `thinking: true` flag to the backend, which activates metadata extraction, caption rewriting, and extended generation limits.**

ACE-Step UI provides an interface for controlling the ACE-Step music generation pipeline, where **Thinking Mode** determines whether the lyric model performs additional reasoning steps during prompt processing. When activated, this mode triggers CoT-specific features in the generation service and adjusts temporal constraints to accommodate the increased computational workload.

## How Thinking Mode Activates Chain-of-Thought Processing

When enabled, Thinking Mode instructs the backend to initialize three specific CoT capabilities:

- **`useCotMetas`** – Enables metadata extraction and structural analysis of the input
- **`useCotCaption`** – Activates intelligent caption rewriting and context enhancement  
- **`useCotLanguage`** – Engages language-aware reasoning for lyric generation

The system also extends the maximum allowed duration from `maxDurationWithoutLm` to `maxDurationWithLm`, reflecting the additional processing time required for chain-of-thought reasoning.

## The Data Flow: From UI Toggle to Gradio Arguments

The `thinking` boolean travels through a specific propagation path across the React frontend and Node.js backend before influencing the underlying Gradio generation wrapper.

### Step 1: State Management in CreatePanel.tsx

The toggle initializes with a default value of `false` to ensure GPU compatibility. In [`src/main/components/CreatePanel.tsx`](https://github.com/fspecii/ace-step-ui/blob/main/src/main/components/CreatePanel.tsx), the state declaration appears at line 170:

```tsx
const [thinking, setThinking] = useState(false);

```

The actual toggle UI implementation (lines 2070-2076) handles click events and visual states:

```tsx
<button
  onClick={() => !loraLoaded && setThinking(!thinking)}
  className={`
    w-10 h-5 rounded-full flex items-center transition-colors
    ${thinking ? 'bg-pink-600' : 'bg-zinc-300 dark:bg-black/40'}
    ${loraLoaded ? 'opacity-50 cursor-not-allowed' : 'cursor-pointer'}
  `}
>
  <div
    className={`
      w-4 h-4 rounded-full bg-white transform transition-transform
      ${thinking ? 'translate-x-5' : 'translate-x-0'}
    `}
  />
</button>

```

An effect at lines 364-369 enforces mutual exclusivity with LoRA models by forcing `thinking` to `false` whenever a LoRA model loads:

```tsx
useEffect(() => {
  if (loraLoaded) {
    setThinking(false);
  }
}, [loraLoaded]);

```

### Step 2: Type Safety and App Integration

The TypeScript interface in [`src/main/types.ts`](https://github.com/fspecii/ace-step-ui/blob/main/src/main/types.ts) (line 80) provides static typing for the flag:

```typescript
thinking: boolean;

```

When constructing the generation request in [`src/main/App.tsx`](https://github.com/fspecii/ace-step-ui/blob/main/src/main/App.tsx) (line 817), the property joins the parameters payload:

```tsx
await generateApi.create({
  // …other params…
  thinking: params.thinking,
});

```

### Step 3: Server-Side Processing in acestep.ts

The server-side service at [`src/main/server/src/services/acestep.ts`](https://github.com/fspecii/ace-step-ui/blob/main/src/main/server/src/services/acestep.ts) extracts the flag at lines 137-138:

```typescript
const isThinking = params.thinking ?? false;
const isEnhance = params.enhance ?? false;

```

CoT activation occurs at line 150, where either "Enhance" or "Thinking" mode can trigger the features:

```typescript
const useCot = isEnhance || isThinking;

```

Finally, the service constructs the argument list for the Gradio wrapper (lines 183-191), passing `isThinking` as argument 29 and conditionally appending CoT flags as arguments 34-36:

```typescript
return [
  // …previous arguments…
  isThinking,               // argument 29 – “Think”
  // CoT-related arguments added only when `useCot` is true
  useCot ? (params.useCotMetas ?? true) : false,   // arg 34
  useCot ? (params.useCotCaption ?? true) : false, // arg 35
  useCot ? (params.useCotLanguage ?? true) : false // arg 36
];

```

## Dynamic Duration Adjustment

Thinking Mode affects UI constraints by switching between duration limits. In [`CreatePanel.tsx`](https://github.com/fspecii/ace-step-ui/blob/main/CreatePanel.tsx) (lines 610-614), the active maximum duration recalculates based on the thinking state:

```tsx
const activeMaxDuration = thinking ? maxDurationWithLm : maxDurationWithoutLm;
useEffect(() => {
  if (duration > activeMaxDuration) setDuration(activeMaxDuration);
}, [duration, activeMaxDuration]);

```

This ensures the UI prevents users from requesting generation durations that exceed the backend's capacity when CoT processing is active.

## Summary

- **Thinking Mode** enables chain-of-thought processing for the lyric-generation LLM via the `thinking: true` flag
- The flag originates in [`CreatePanel.tsx`](https://github.com/fspecii/ace-step-ui/blob/main/CreatePanel.tsx) (line 170), flows through [`App.tsx`](https://github.com/fspecii/ace-step-ui/blob/main/App.tsx) (line 817), and processes in [`acestep.ts`](https://github.com/fspecii/ace-step-ui/blob/main/acestep.ts) (line 137)
- CoT features (`useCotMetas`, `useCotCaption`, `useCotLanguage`) activate when either Thinking Mode or Enhance Mode is enabled
- **LoRA incompatibility**: The system automatically disables Thinking Mode when loading LoRA models (lines 364-369)
- Duration limits switch from `maxDurationWithoutLm` to `maxDurationWithLm` when thinking is active

## Frequently Asked Questions

### What happens when I enable Thinking Mode in ACE-Step UI?

The UI passes `thinking: true` to the `/api/generate` endpoint, which the backend service interprets as `isThinking` (line 137 in [`acestep.ts`](https://github.com/fspecii/ace-step-ui/blob/main/acestep.ts)). This boolean activates chain-of-thought features and extends the maximum generation duration to accommodate the additional reasoning overhead.

### Why is Thinking Mode disabled when using LoRA models?

The ACE-Step architecture treats LoRA weights and chain-of-thought processing as mutually exclusive features. An effect hook at lines 364-369 in [`CreatePanel.tsx`](https://github.com/fspecii/ace-step-ui/blob/main/CreatePanel.tsx) forces `thinking` to `false` whenever `loraLoaded` becomes true, and the toggle UI renders with `opacity-50` and `cursor-not-allowed` styling to indicate the restriction.

### Does Thinking Mode affect generation speed?

Yes. When enabled, Thinking Mode switches the duration limit from `maxDurationWithoutLm` to `maxDurationWithLm`, indicating that lyric generations require additional processing time. The tooltip in [`CreatePanel.tsx`](https://github.com/fspecii/ace-step-ui/blob/main/CreatePanel.tsx) explicitly notes that reasoning mode is "slightly slower" than standard generation.

### Which CoT features are activated by Thinking Mode?

The backend activates three specific features when `useCot` evaluates to true (line 150): `useCotMetas` for metadata extraction, `useCotCaption` for caption rewriting, and `useCotLanguage` for language-aware reasoning. These correspond to arguments 34, 35, and 36 in the Gradio wrapper call.