Skip to main content

Search & Replace

The search and replace feature in Scriptix helps you quickly find and correct errors throughout your transcript. This guide covers all search capabilities, replace options, and advanced techniques.

Opening the Search Panel

Access Methods

  • Click the Search button (magnifying glass icon) in the toolbar
  • Panel appears on the left side of the editor

Search Panel Location

Position: Left sidebar of the transcript editor

Visibility: Toggle on/off using toolbar button or Ctrl/Cmd + F

Tip: The search panel is compact and designed to not obstruct the transcript text.

Search Panel Components

The search panel contains these elements in order:

┌─────────────────────┐
│ [Search Input] × │ ← Search box with clear button
│ │
│ Matches: 5 │ ← Match counter badge
│ │
│ [Replace Input] │ ← Replacement text
│ │
│ [Replace This] │ ← Replace current match
│ [Replace All] │ ← Replace all matches
│ │
│ [Aa] [W] [<] [>] │ ← Options + Navigation
└─────────────────────┘

Search Input Field

What it does:

  • Enter text or pattern to search for
  • Live search with 250ms debounce
  • Results update automatically as you type
  • Auto-focused when panel opens

How to use:

  1. Click in the search input field (or use Ctrl/Cmd + F)
  2. Type your search term
  3. Matches highlight in the transcript after 250ms
  4. Results counter updates

Clear Button (×):

  • Appears when search has text
  • Clears search query, replacement, and results
  • Returns focus to search input

Match Counter

Display: Badge showing "Matches: X" (e.g., "Matches: 5")

Location: Below search input, right-aligned

What it shows:

  • Total number of matches in the document
  • Updates as you type (debounced 250ms)
  • Shows "Matches: 0" if no results
  • Gray text when no matches, darker when matches found

Live Update: The counter uses aria-live="polite" for screen reader announcements.

Replace Input Field

Location: Below the match counter

Placeholder: "Replace with"

What it does:

  • Enter the replacement text
  • What will replace matched instances
  • Can be empty (to delete matches)
  • Only enabled when search has text

Replace Buttons

Layout: Two buttons in a grid, side by side

Replace This:

  • Label: "Replace This"
  • Replaces only the current match (the one with border highlight)
  • Disabled when no query or no results
  • Advances to next match after replacing

Replace All:

  • Label: "Replace All"
  • Replaces all matches simultaneously
  • Disabled when no query or no results
  • No confirmation dialog—replaces immediately

Search Options

Layout: Two checkboxes on left, navigation buttons on right

Case Sensitive (Aa):

  • Mini checkbox with "Aa" label
  • Tooltip: "Case sensitive"
  • Toggles case-sensitive matching

Whole Word (W):

  • Mini checkbox with "W" label
  • Tooltip: "Whole word"
  • Toggles whole-word matching

Previous (<):

  • ChevronLeft icon
  • Tooltip: "Previous occurrence"
  • Jumps to previous match
  • Wraps to last match from first
  • Disabled when no results

Next (>):

  • ChevronRight icon
  • Tooltip: "Next occurrence"
  • Jumps to next match
  • Wraps to first match from last
  • Disabled when no results

Note: There is no current position indicator (e.g., "2 of 5"). Navigation wraps around circularly.

Search Options

Toggle: Checkbox labeled "Aa"

When Disabled (Default):

  • Matches regardless of capitalization
  • "API" finds "api", "Api", "API", "aPi"
  • More permissive, more results
  • Uses regex flag: gi (global, case-insensitive)

When Enabled:

  • Matches must have exact capitalization
  • "API" finds only "API"
  • "api" does not match "API"
  • More precise, fewer results
  • Uses regex flag: g (global, case-sensitive)

Use Cases for Case Sensitive:

  • Distinguishing acronyms (API vs api)
  • Proper names with specific capitalization
  • Code snippets or technical terms
  • When case matters semantically

Whole Word Match

Toggle: Checkbox labeled "W"

When Disabled (Default):

  • Matches partial words
  • Searching "test" finds "test", "testing", "contest", "attest"
  • More results
  • Regex pattern: searchTerm (no word boundaries)

When Enabled:

  • Matches only complete words
  • Searching "test" finds only "test"
  • Does not match "testing", "contest", "attest"
  • More precise, fewer results
  • Regex pattern: \\b${searchTerm}\\b (word boundaries)

Use Cases for Whole Word:

  • Avoiding partial matches in longer words
  • Finding specific standalone terms
  • Replacing words without affecting compounds
  • Example: Replace "run" without changing "running"

Combining Options

Both options can be used together:

Case Sensitive + Whole Word:

  • Most restrictive
  • Exact word with exact capitalization
  • Example: "API" finds only "API", not "api" or "APIs"

Technical Implementation:

  • Regex pattern: \\b${searchTerm}\\b with flag g (case sensitive)
  • Or: \\b${searchTerm}\\b with flag gi (case insensitive)

How Search Works

Search Algorithm

Implementation Details:

  • Uses JavaScript RegExp for pattern matching
  • Searches through all utterances → paragraphs → text nodes
  • Tracks precise character offsets for each match
  • Returns array of SearchHit objects with position info

Debouncing:

  • Search is debounced by 250ms using lodash debounce
  • Prevents excessive re-computation while typing
  • Improves performance on large documents

Match Highlighting

Visual Highlighting:

  • Matches highlighted with yellow background (#ffeeba)
  • Current match has additional border (1px solid #afafaf, 3px border-radius)
  • Highlighting implemented in paragraph-leaf.tsx:64-72

How Current Match is Determined:

  • Search maintains activeHitIndex state
  • Current match determined by comparing timestamps and offsets
  • setCurrentMatch() updates the active match
  • focusMatch() scrolls to and highlights the active match

Auto-Scrolling

Behavior:

  • Transcript automatically scrolls to show current match
  • Uses focusMatch() function from TranscriptContext
  • Scrolls utterance into view using Virtuoso's scrolling
  • Smooth scroll behavior

Replace Functionality

Replace This

Button: "Replace This"

Behavior:

  1. Replaces only the current match (the one with border highlight)
  2. Updates Slate editor directly for instant UI feedback
  3. Rebuilds document structure immutably
  4. Recomputes all matches using the updated document
  5. Advances to next match automatically
  6. If no more matches, clears search state

Use Cases:

  • Selective replacement (only some instances)
  • Reviewing each match before replacing
  • When context matters

Workflow:

  1. Search for term
  2. Navigate to first match (automatic)
  3. Verify context
  4. Click "Replace This" if appropriate
  5. Next match is automatically selected
  6. Repeat for each match

Example:

Search: "Sara"
Replace: "Sarah"

Match 1: "Sara Johnson" → Replace This → "Sarah Johnson"
Navigate automatically to Match 2
Match 2: "Sara Lee" (the brand) → Skip (click Next)
Match 3: "Sara Smith" → Replace This → "Sarah Smith"

Replace All

Button: "Replace All"

Behavior:

  1. Replaces all matches simultaneously with one click
  2. Updates Slate editors for all utterances
  3. Rebuilds entire document structure
  4. Fast bulk operation
  5. No confirmation dialog - replaces immediately
  6. Use Undo to revert

Use Cases:

  • Consistent replacements across document
  • Fixing systematic errors
  • Renaming consistent terms
  • When all instances should change identically

Important:

  • No confirmation prompt - action is immediate
  • Always ready to use Undo (Ctrl/Cmd + Z) if needed
  • Disabled when replacement field is undefined (not just empty)

Example:

Search: "compeny"
Replace: "company"
Replace All → All 15 instances corrected instantly

Delete via Replace

Deleting Matched Text:

  1. Enter search term
  2. Leave replace field empty (empty string, not undefined)
  3. Click "Replace This" or "Replace All"
  4. Matched text is deleted

Use Cases:

  • Removing filler words ("um", "uh")
  • Deleting unwanted punctuation
  • Cleaning up transcript artifacts

Example:

Search: " um "
Replace: (empty - delete the field content)
Replace All → All "um" filler words removed

Important - Spacing:

  • Include spaces in search: " um " (with spaces)
  • This prevents joining words: "sum" → "s"
  • Empty replacement removes matched text including spaces

Search & Replace Workflows

Workflow 1: Systematic Error Correction

Scenario: Transcription consistently misspells a word

Steps:

  1. Open search (Ctrl/Cmd + F)
  2. Search for misspelled word
  3. Check match counter badge (e.g., "Matches: 12")
  4. Enter correct spelling in replace field
  5. Click "Replace All"
  6. Verify correction (matches should be 0)
  7. Use Undo if any issues

Example:

Search: "recieve"
Replace: "receive"
Matches: 12
Click Replace All → All 12 corrected
New search shows: Matches: 0

Workflow 2: Selective Replacement

Scenario: Word is correct in some contexts, wrong in others

Steps:

  1. Open search
  2. Search for the term
  3. First match is automatically selected
  4. For each match:
    • Read context in transcript
    • If wrong: Click "Replace This" → auto-advances to next
    • If correct: Click Next (>) → skip to next match
  5. Continue until Matches: 0
  6. Close search panel

Example:

Search: "lead"
Match 1: "lead the team" → Correct → Click Next (>)
Match 2: "lead paint" → Correct → Click Next (>)
Match 3: "she lead the meeting" → Wrong → Replace This → "she led the meeting"
Auto-advances to next match (or Matches: 0 if done)

Workflow 3: Batch Cleanup

Scenario: Remove multiple types of filler words or artifacts

Steps:

  1. Search for first filler word (e.g., "um")
  2. Leave replacement empty
  3. Replace All
  4. Clear search (×)
  5. Search for next filler word (e.g., "uh")
  6. Replace All
  7. Repeat for all unwanted terms
  8. Review transcript after bulk changes

Example:

Round 1: Search "um" → Replace: (empty) → Replace All → 23 removed
Round 2: Search "uh" → Replace: (empty) → Replace All → 15 removed
Round 3: Search "like," → Replace: (empty) → Replace All → 8 removed
Total cleanup: 46 filler words removed

Workflow 4: Standardization

Scenario: Ensure consistent terminology across transcript

Steps:

  1. Identify variations (e.g., "API", "api", "A.P.I.")
  2. Choose standard form (e.g., "API")
  3. Search for each variation sequentially
  4. Replace All to standard form
  5. Verify with final search for standard form

Example:

Round 1: Search "api" (case sensitive) → Replace "API" → Replace All → 8 changed
Round 2: Search "A.P.I." → Replace "API" → Replace All → 3 changed
Verification: Search "API" → Matches: 45 (34 original + 8 + 3)

Advanced Search Techniques

Finding Homophones

Common Misspellings:

  • their/there/they're
  • your/you're
  • its/it's
  • to/too/two

Workflow:

  1. Search for each variant (whole word enabled)
  2. Navigate through matches
  3. Verify context for each
  4. Replace selectively (not all instances will be wrong)

Example:

Search: "there" (whole word)
Match 1: "there are three" → Correct → Next
Match 2: "there going to" → Wrong → Replace This → "they're going to"
Match 3: "over there" → Correct → Next

Finding Related Terms:

  • Search for variations sequentially
  • Build understanding of usage
  • Standardize or correct each

Example - Finding Product Names:

Search 1: "DataSync" → Matches: 12
Search 2: "Data Sync" → Matches: 8 → Replace All → "DataSync"
Search 3: "data sync" → Matches: 5 → Replace All → "DataSync"
Final: Search "DataSync" → Matches: 25 (12 + 8 + 5)

Context Verification

Use Search to Find Context:

Scenario: Need to verify how a term is used throughout

Workflow:

  1. Search for the term
  2. Navigate through all matches (Next button)
  3. Read surrounding sentences in transcript
  4. Ensure consistent usage
  5. Correct outliers using Replace This

Quality Assurance Searches

Final Checks:

Common QA Searches:

Search: "[inaudible]" → Count unclear sections → Matches: 4
Search: "um" → Decide if filler words should remain → Matches: 23
Search: "Speaker " → Verify all speakers named → Matches: 0 (good!)
Search: " " (double space) → Find formatting issues → Matches: 7

Search Best Practices

Before Replacing

1. Review Sample Matches

  • Click through first few matches using Next (>)
  • Verify search is finding what you intend
  • Check for edge cases

2. Consider Context

  • Will replacement make sense in all contexts?
  • Are there exceptions?
  • Use "Replace This" for selective replacement

3. Check Match Count

  • Review "Matches: X" badge
  • Does it seem right for the document?
  • Too many or too few may indicate incorrect search

4. Test with Undo

  • Try Replace All
  • Use Undo (Ctrl/Cmd + Z) to verify it worked correctly
  • Redo if satisfied

After Replacing

1. Verify Replacements

  • Do a new search for the replacement term
  • Check match count increased as expected
  • Navigate through a few examples to verify correctness

2. Check for Issues

  • Search for original term (should have Matches: 0 or fewer)
  • Look for unintended side effects
  • Verify spacing and punctuation

3. Save Your Work

  • Click Save button after bulk replacements
  • Ensure changes are persisted
  • Don't rely solely on localStorage backup

Troubleshooting Search & Replace

No Matches Found

Issue: Search returns "Matches: 0" but term exists

Possible Causes:

  • Typo in search term
  • Case sensitive enabled (term has different case)
  • Whole word enabled (only matching partials exist)
  • Term actually doesn't exist in document

Solutions:

  1. Verify search term spelling
  2. Disable case sensitive (Aa checkbox)
  3. Disable whole word (W checkbox)
  4. Try partial search (fewer characters)
  5. Check if you're searching the right document

Too Many Matches

Issue: Search finds hundreds or thousands of matches

Possible Causes:

  • Search term too broad (e.g., single letter like "a")
  • Common word like "the" or "and"
  • Not using whole word option

Solutions:

  1. Make search more specific (add more characters)
  2. Enable "Whole word" (W checkbox)
  3. Add more context to search term
  4. Use selective replacement instead of Replace All

Replace Affects Wrong Text

Issue: Replacement changes unintended words

Possible Causes:

  • Not using "Whole word" option
  • Search term matches more than intended
  • Didn't review before Replace All

Solutions:

  1. Use Undo (Ctrl/Cmd + Z) to revert immediately
  2. Enable "Whole word" (W checkbox)
  3. Make search term more specific
  4. Use "Replace This" for selective replacement
  5. Review matches before replacing

Search Panel Won't Open

Issue: Ctrl/Cmd + F or Search button doesn't work

Possible Causes:

  • Browser captured the shortcut
  • Focus not in editor
  • JavaScript error in page

Solutions:

  1. Click in transcript first
  2. Try Search button instead of shortcut
  3. Refresh the page (F5)
  4. Check browser console for errors (F12)
  5. Try different browser

Replace Buttons Disabled

Issue: Replace This and Replace All buttons are grayed out

Possible Causes:

  • No search query entered
  • No matches found
  • Replacement is undefined (though empty is OK)

Solutions:

  1. Enter a search term first
  2. Verify search finds matches (Matches: X > 0)
  3. Ensure you've typed in the replacement field (even if empty)

Frequently Asked Questions

Can I search with regular expressions?

No, currently Scriptix search uses escaped literal text matching. Special regex characters are escaped. Use case sensitive and whole word options for precision.

Can I search for multiple terms at once?

No, search for one term at a time. Perform multiple sequential searches for different terms.

Does search work across speaker labels?

Search only works on transcript text content, not speaker labels (separate field in data structure).

Can I replace newlines or paragraph breaks?

No, search & replace works on text content only, not structural elements like paragraphs or utterances.

Does Replace All ask for confirmation?

No, Replace All replaces immediately without confirmation. Always be ready to use Undo (Ctrl/Cmd + Z).

Can I undo Replace All?

Yes, use Undo (Ctrl/Cmd + Z) immediately after Replace All to revert all changes. Undo stack maintains recent changes.

How many matches can search handle?

Search handles thousands of matches efficiently. The algorithm scans all text nodes but is optimized for performance.

What's the difference between "Matches: 0" and empty badge?

If search is empty, badge shows "Matches: 0" in gray. If search has text with no matches, same display. Always check that your search term is correct.

Does navigation wrap around?

Yes, Next wraps from last match to first match. Previous wraps from first to last. Circular navigation.

Next Steps

Enhance your editing efficiency:


Start searching! Press Ctrl/Cmd + F to open the search panel and find your first error!