From 43222f5fe007352e1c6a5232263437b1b977559f Mon Sep 17 00:00:00 2001
From: Doug Martin <dmartin@concord.org>
Date: Sat, 6 Apr 2024 07:03:15 -0400
Subject: [PATCH] feat: Show (space) as placeholder when delimiter is a space
 [PT-187369359]

---
 src/components/app.tsx | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/components/app.tsx b/src/components/app.tsx
index d4b38eb..f64653b 100644
--- a/src/components/app.tsx
+++ b/src/components/app.tsx
@@ -301,6 +301,9 @@ export const App = () => {
     const onPlayClick = generationMode === "playing"
       ? handlePause
       : (generationMode === "paused" ? handleResume : handlePlay);
+    const delimiterIsSpace = delimiter === " ";
+    const delimiterValue = delimiterIsSpace ? "" : delimiter;
+    const delimiterPlaceholder = delimiterIsSpace ? "(space)" : "(none)";
 
     return (
       <div className="generate">
@@ -328,8 +331,8 @@ export const App = () => {
               <label>Delimiter:</label>
               <input className="bordered" type="text"
                 onChange={handleChangeDelimiter}
-                value={delimiter}
-                placeholder="(none)"
+                value={delimiterValue}
+                placeholder={delimiterPlaceholder}
                 maxLength={3}
                 disabled={disabled}
               />