# Live Agent Label Switch — Implementation Steps

**Target file:** `agency_pulse/resources/views/vendor/support-bubble/includes/script.blade.php`

---

## Step 1 — Add label state variable

After the existing variable declarations at the top of `bootstrapSupportBubble` (after line 11, before the `ALLOWED_DOMAINS` block), insert one variable:

```js
let assistantLabel = 'AI Assistant';
```

This is the single source of truth for the label. All future label reads go through this variable.

---

## Step 2 — Refactor `appendMessage` to use the state variable

**Current code (line 156):**
```js
msgDiv.innerHTML = `<span class="text-xs font-bold uppercase text-gray-500">${role === 'user' ? 'You' : 'AI Assistant'}</span><div class="mt-1">${text.replace(/\n/g, '<br>')}</div>`;
```

**Replace with:**
```js
msgDiv.innerHTML = `<span class="text-xs font-bold uppercase text-gray-500">${role === 'user' ? 'You' : assistantLabel}</span><div class="mt-1">${text.replace(/\n/g, '<br>')}</div>`;
```

Only the string literal `'AI Assistant'` changes to `assistantLabel`. No other logic in `appendMessage` changes.

---

## Step 3 — Set `assistantLabel` inside `initializeLiveChat`

**Location:** `initializeLiveChat` function body, lines 161–267. Add the assignment immediately after the existing `form.dataset.*` assignments (after line 169, before the `querySelectorAll` that hides form fields).

```js
// Switch label for all subsequent agent messages
assistantLabel = 'LIVE AGENT';
```

Because `assistantLabel` is declared in the enclosing `bootstrapSupportBubble` scope, this assignment is visible to `appendMessage` instantly — no argument passing needed.

**Effect on timing:** `initializeLiveChat` is called at line 410, *after* `appendMessage('assistant', data.reply)` at line 391. So the final AI reply that triggers live-chat escalation will still render as "AI Assistant". Only messages arriving via polling (or subsequent user-triggered messages) will show "LIVE AGENT". This satisfies the plan's recommended UX rule: historical AI messages keep their label.

---

## Step 4 — No changes needed to the polling path

`pollMessages` already calls `appendMessage('assistant', msg.content)` at line 196. After step 3, `assistantLabel` will be `'LIVE AGENT'` by the time any polled agent message is appended. No further edits are required here.

---

## Step 5 — Handle page reload with an active live session

The history fetch (lines 99–132) currently does not detect a live chat in progress. For reopened-session correctness, check `data.is_live_chat` inside the history `.then` block, after the existing `data.escalated` branch:

```js
if (data.is_live_chat) {
    assistantLabel = 'LIVE AGENT';
    initializeLiveChat({
        chatId: data.chat_id,
        sessionToken: data.session_token,
        agentName: data.agent_name,
        form: form,
        chatLog: chatLog,
    });
}
```

**Add this block after line 131 (the closing brace of the `data.escalated` branch), before the closing `}` of the `.then` callback.**

The backend must already return `is_live_chat`, `chat_id`, and `session_token` in the history response for this to work. Verify that the history endpoint (`fetch_history=1`) includes these fields; if not, that is a backend task outside the scope of this frontend change.

---

## Step 6 — Verify `ai_from_docs` mode needs no special handling

`appendMessage` is the single render path for both widget and docs-chat modes. Because `assistantLabel` is set at the `bootstrapSupportBubble` scope level, both code paths inherit it transparently. No Blade `@if(session('ai_from_docs'))` guards are needed for this change.

---

## Complete diff summary

| Location | Change |
|---|---|
| After line 11 (variable block) | Add `let assistantLabel = 'AI Assistant';` |
| Line 156 (`appendMessage`) | `'AI Assistant'` → `assistantLabel` |
| After line 169 (`initializeLiveChat`) | Add `assistantLabel = 'LIVE AGENT';` |
| After line 131 (history fetch `.then`) | Add `if (data.is_live_chat)` reinit block (Step 5) |

Total lines changed/added: ~6.

---

## QA Checklist (from plan)

1. New non-live conversation — all assistant messages show "AI Assistant".
2. Trigger `data.is_live_chat === true` — the last AI reply still shows "AI Assistant"; next polled agent message shows "LIVE AGENT".
3. Further polled messages continue to show "LIVE AGENT".
4. User messages continue to show "You".
5. Reload/reopen during active live chat — label shows "LIVE AGENT" for newly-arriving messages (requires Step 5 + backend support).
6. Docs chat mode — same label transition applies without additional changes.
7. No JS errors in console during any of the above flows.

---

## Rollback

Revert `assistantLabel` initialization to a static string and inline it back into `appendMessage`. All three edits are co-located in one file, so a full revert is a `git checkout` of `script.blade.php`.