From 205bb52ce687faa8668416a077b4e280a5822aa7 Mon Sep 17 00:00:00 2001
From: Bilel Kihal <61744974+Bilelkihal@users.noreply.github.com>
Date: Fri, 4 Aug 2023 13:23:09 +0000
Subject: [PATCH] Add email, password, url components to lookbook

---
 app/components/input/email_component.rb         |  7 +++++++
 .../email_component/email_component.html.haml   |  1 +
 app/components/input/password_component.rb      |  7 +++++++
 .../password_component.html.haml                |  1 +
 app/components/input/url_component.rb           |  7 +++++++
 .../input/url_component/url_component.html.haml |  1 +
 .../previews/input/email_component_preview.rb   | 17 +++++++++++++++++
 .../input/password_component_preview.rb         | 17 +++++++++++++++++
 .../previews/input/url_component_preview.rb     | 17 +++++++++++++++++
 9 files changed, 75 insertions(+)
 create mode 100644 app/components/input/email_component.rb
 create mode 100644 app/components/input/email_component/email_component.html.haml
 create mode 100644 app/components/input/password_component.rb
 create mode 100644 app/components/input/password_component/password_component.html.haml
 create mode 100644 app/components/input/url_component.rb
 create mode 100644 app/components/input/url_component/url_component.html.haml
 create mode 100644 test/components/previews/input/email_component_preview.rb
 create mode 100644 test/components/previews/input/password_component_preview.rb
 create mode 100644 test/components/previews/input/url_component_preview.rb

diff --git a/app/components/input/email_component.rb b/app/components/input/email_component.rb
new file mode 100644
index 000000000..ca4c4e65c
--- /dev/null
+++ b/app/components/input/email_component.rb
@@ -0,0 +1,7 @@
+# frozen_string_literal: true
+
+class Input::EmailComponent < InputFieldComponent
+  def initialize(label: '', name:, value: nil, placeholder: '', error_message: '', helper_text: '')
+    super(label: label, name: name, value: value,  placeholder: placeholder, error_message: error_message, helper_text: helper_text)
+  end
+end
diff --git a/app/components/input/email_component/email_component.html.haml b/app/components/input/email_component/email_component.html.haml
new file mode 100644
index 000000000..f2cc534c4
--- /dev/null
+++ b/app/components/input/email_component/email_component.html.haml
@@ -0,0 +1 @@
+= render InputFieldComponent.new(label: @label, name: @name, value: @value,  placeholder: @placeholder, error_message: @error_message, helper_text: @helper_text, type: "email")
\ No newline at end of file
diff --git a/app/components/input/password_component.rb b/app/components/input/password_component.rb
new file mode 100644
index 000000000..5407c4d99
--- /dev/null
+++ b/app/components/input/password_component.rb
@@ -0,0 +1,7 @@
+# frozen_string_literal: true
+
+class Input::PasswordComponent < InputFieldComponent
+  def initialize(label: '', name:, value: nil, placeholder: '', error_message: '', helper_text: '')
+    super(label: label, name: name, value: value,  placeholder: placeholder, error_message: error_message, helper_text: helper_text)
+  end
+end
diff --git a/app/components/input/password_component/password_component.html.haml b/app/components/input/password_component/password_component.html.haml
new file mode 100644
index 000000000..cbb66342b
--- /dev/null
+++ b/app/components/input/password_component/password_component.html.haml
@@ -0,0 +1 @@
+= render InputFieldComponent.new(label: @label, name: @name, value: @value,  placeholder: @placeholder, error_message: @error_message, helper_text: @helper_text, type: "password")
\ No newline at end of file
diff --git a/app/components/input/url_component.rb b/app/components/input/url_component.rb
new file mode 100644
index 000000000..b4b9100b7
--- /dev/null
+++ b/app/components/input/url_component.rb
@@ -0,0 +1,7 @@
+# frozen_string_literal: true
+
+class Input::UrlComponent < InputFieldComponent
+  def initialize(label: '', name:, value: nil, placeholder: '', error_message: '', helper_text: '')
+    super(label: label, name: name, value: value,  placeholder: placeholder, error_message: error_message, helper_text: helper_text)
+  end
+end
diff --git a/app/components/input/url_component/url_component.html.haml b/app/components/input/url_component/url_component.html.haml
new file mode 100644
index 000000000..721ab6d8f
--- /dev/null
+++ b/app/components/input/url_component/url_component.html.haml
@@ -0,0 +1 @@
+= render InputFieldComponent.new(label: @label, name: @name, value: @value,  placeholder: @placeholder, error_message: @error_message, helper_text: @helper_text, type: "url")
\ No newline at end of file
diff --git a/test/components/previews/input/email_component_preview.rb b/test/components/previews/input/email_component_preview.rb
new file mode 100644
index 000000000..a67a5e178
--- /dev/null
+++ b/test/components/previews/input/email_component_preview.rb
@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+class Input::EmailComponentPreview < ViewComponent::Preview
+  def default
+    # This is a url input field:
+    # - To use it without a label: don't give a value to the param label or leave it empty.
+    # - To put it in error state: define the param error_message with the error message you want to be displayed.
+    # - To give it a helper text (a text displayed under the input field): define the param helper_text with the helper text you want to be displayed.
+    # @param label text
+    # @param error_message text
+    # @param helper_text text
+
+    def default(label: "Label", placeholder: "", error_message: "", helper_text: "")
+      render Input::EmailComponent.new(label: label, name: "name", placeholder: placeholder, error_message: error_message, helper_text: helper_text)
+    end
+  end
+end
diff --git a/test/components/previews/input/password_component_preview.rb b/test/components/previews/input/password_component_preview.rb
new file mode 100644
index 000000000..86e1eda80
--- /dev/null
+++ b/test/components/previews/input/password_component_preview.rb
@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+class Input::PasswordComponentPreview < ViewComponent::Preview
+  def default
+    # This is a url input field:
+    # - To use it without a label: don't give a value to the param label or leave it empty.
+    # - To put it in error state: define the param error_message with the error message you want to be displayed.
+    # - To give it a helper text (a text displayed under the input field): define the param helper_text with the helper text you want to be displayed.
+    # @param label text
+    # @param error_message text
+    # @param helper_text text
+
+    def default(label: "Label", placeholder: "", error_message: "", helper_text: "")
+      render Input::PasswordComponent.new(label: label, name: "name", placeholder: placeholder, error_message: error_message, helper_text: helper_text)
+    end
+  end
+end
diff --git a/test/components/previews/input/url_component_preview.rb b/test/components/previews/input/url_component_preview.rb
new file mode 100644
index 000000000..53b4c8a10
--- /dev/null
+++ b/test/components/previews/input/url_component_preview.rb
@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+class Input::UrlComponentPreview < ViewComponent::Preview
+  def default
+    # This is a url input field:
+    # - To use it without a label: don't give a value to the param label or leave it empty.
+    # - To put it in error state: define the param error_message with the error message you want to be displayed.
+    # - To give it a helper text (a text displayed under the input field): define the param helper_text with the helper text you want to be displayed.
+    # @param label text
+    # @param error_message text
+    # @param helper_text text
+
+    def default(label: "Label", placeholder: "", error_message: "", helper_text: "")
+      render Input::UrlComponent.new(label: label, name: "name", placeholder: placeholder, error_message: error_message, helper_text: helper_text)
+    end
+  end
+end