Added TextBox

farjs · Dec 4, 2019 · 7150f49 · 7150f49
1 parent 81d1a0a
commit 7150f49
Show file tree

Hide file tree

Showing 5 changed files with 95 additions and 18 deletions.
diff --git a/ui/src/main/scala/farclone/ui/TextBox.scala b/ui/src/main/scala/farclone/ui/TextBox.scala
@@ -0,0 +1,29 @@
+package farclone.ui
+
+import scommons.react._
+import scommons.react.blessed._
+
+case class TextBoxProps(pos: (Int, Int),
+                        width: Int,
+                        value: String,
+                        style: BlessedStyle,
+                        onChange: String => Unit)
+
+object TextBox extends FunctionComponent[TextBoxProps] {
+
+  protected def render(compProps: Props): ReactElement = {
+    val props = compProps.wrapped
+    val (left, top) = props.pos
+
+    <.input(
+      ^.rbMouse := true,
+      ^.rbKeyable := true,
+      ^.rbWidth := props.width,
+      ^.rbHeight := 1,
+      ^.rbLeft := left,
+      ^.rbTop := top,
+      ^.rbStyle := props.style,
+      ^.content := props.value
+    )()
+  }
+}
diff --git a/ui/src/main/scala/farclone/ui/filelist/popups/MakeFolderPopup.scala b/ui/src/main/scala/farclone/ui/filelist/popups/MakeFolderPopup.scala
@@ -70,14 +70,14 @@ object MakeFolderPopup extends FunctionComponent[MakeFolderPopupProps] {
           text = "Create the folder",
           style = style
         ))(),
-        <.input(
-          ^.rbMouse := true,
-          ^.rbWidth := width - 10,
-          ^.rbHeight := 1,
-          ^.rbLeft := 5,
-          ^.rbTop := 3,
-          ^.rbStyle := style.focus
-        )(),
+        <(TextBox())(^.wrapped := TextBoxProps(
+          pos = (5, 3),
+          width = width - 10,
+          value = "initial folder name",
+          style = style.focus.getOrElse(null),
+          onChange = { _ =>
+          }
+        ))(),
         <(HorizontalLine())(^.wrapped := HorizontalLineProps(
           pos = (3, 4),
           length = width - 6,

diff --git a/ui/src/main/scala/scommons/react/blessed/package.scala b/ui/src/main/scala/scommons/react/blessed/package.scala
@@ -76,6 +76,7 @@ package object blessed {
     lazy val rbMouse = BlessedBooleanAttributeSpec("mouse")
     lazy val rbTags = BlessedBooleanAttributeSpec("tags")
     lazy val rbClickable = BlessedBooleanAttributeSpec("clickable")
+    lazy val rbKeyable = BlessedBooleanAttributeSpec("keyable")
     lazy val rbAutoFocus = BlessedBooleanAttributeSpec("autoFocus")
     lazy val rbScrollable = BlessedBooleanAttributeSpec("scrollable")
     lazy val rbAlwaysScroll = BlessedBooleanAttributeSpec("alwaysScroll")

diff --git a/ui/src/test/scala/farclone/ui/TextBoxSpec.scala b/ui/src/test/scala/farclone/ui/TextBoxSpec.scala
@@ -0,0 +1,50 @@
+package farclone.ui
+
+import scommons.react.blessed._
+import scommons.react.test.TestSpec
+import scommons.react.test.raw.ShallowInstance
+import scommons.react.test.util.ShallowRendererUtils
+
+class TextBoxSpec extends TestSpec with ShallowRendererUtils {
+
+  it should "render component" in {
+    //given
+    val props = getTextBoxProps()
+
+    //when
+    val result = shallowRender(<(TextBox())(^.wrapped := props)())
+
+    //then
+    assertTextBox(result, props)
+  }
+
+  private def getTextBoxProps(value: String = "initial name",
+                              onChange: String => Unit = _ => ()
+                             ): TextBoxProps = TextBoxProps(
+    pos = (1, 2),
+    width = 10,
+    value = value,
+    style = new BlessedStyle {
+      override val bg = "cyan"
+      override val fg = "black"
+    },
+    onChange = onChange
+  )
+
+  private def assertTextBox(result: ShallowInstance, props: TextBoxProps): Unit = {
+    val (left, top) = props.pos
+
+    assertNativeComponent(result,
+      <.input(
+        ^.rbMouse := true,
+        ^.rbKeyable := true,
+        ^.rbWidth := props.width,
+        ^.rbHeight := 1,
+        ^.rbLeft := left,
+        ^.rbTop := top,
+        ^.rbStyle := props.style,
+        ^.content := props.value
+      )()
+    )
+  }
+}
diff --git a/ui/src/test/scala/farclone/ui/filelist/popups/MakeFolderPopupSpec.scala b/ui/src/test/scala/farclone/ui/filelist/popups/MakeFolderPopupSpec.scala
@@ -117,16 +117,13 @@ class MakeFolderPopupSpec extends TestSpec with ShallowRendererUtils {
           focused shouldBe false
           padding shouldBe 1
       }
-      assertNativeComponent(input,
-        <.input(
-          ^.rbMouse := true,
-          ^.rbWidth := width - 10,
-          ^.rbHeight := 1,
-          ^.rbLeft := 5,
-          ^.rbTop := 3,
-          ^.rbStyle := style.focus
-        )()
-      )
+      assertComponent(input, TextBox) {
+        case TextBoxProps(pos, resWidth, resValue, resStyle, _) =>
+          pos shouldBe 5 -> 3
+          resWidth shouldBe (width - 10)
+          resValue shouldBe "initial folder name"
+          resStyle shouldBe style.focus
+      }
       assertComponent(sep1, HorizontalLine) {
         case HorizontalLineProps(pos, resLength, lineCh, resStyle, startCh, endCh) =>
           pos shouldBe 3 -> 4