Contact Administrator via "Зворотній зв'язок" page

[mehalyna]

As a user,
I want to be able to contact the administrator through a "Зворотній зв'язок" page accessed from the footer link,
So that I can easily send messages directly without navigating away from the Home page.

Acceptance Criteria:

1. Accessing the Page:

   • Given I am on the Home page,
     When I click on the "Зворотній зв'язок" link located in the footer,
     Then I should be redirected to the "Зворотній зв'язок" page.
     • And the page should have a clear title labeled "Зворотній зв'язок" or similar.

2. Page Content:

   • Given "Зворотній зв'язок" page is open,
     When I view the page,
     Then I should see the following input fields:
     • One input field for entering my email address.
     • One text area for typing my message.
     • One dropdown list to select the category or type of the message with the following options:
       • "Технічне питання"
       • "Рекомендації"
       • "Питання"
       • "Інше"
     • And both fields should have appropriate placeholders (e.g., "Ваша пошта" and "Ваше повідомлення").
     • And the message field should be preloaded with a template text (e.g., "Привіт, хочу повідомити...") that can be edited.

3. Validation Rules:

   • Email Field:

     • The email field should be required.
     • The input must follow a valid email format (e.g., user@example.com).
     • If the email is invalid or empty, an inline error message should display (e.g., "Будь ласка, вкажіть правильну адресу електронної скриньки").
     • The email should be validated on input (live validation) and again on form submission.

   • Message Field:

     • The message field should be required.
     • The input must contain at least 10 characters to ensure a meaningful message.
     • If the message is empty or below the minimum character limit, an inline error message should display (e.g., "Повідомлення не може бути порожнім" or "Повідомлення не може бути коротшим за 10 символів").
     • The message should be validated on input (live validation) and again on form submission.

   • Dropdown List:

     • The dropdown list should be required.
     • The user must select one of the available options ("Технічне питання", "Рекомендації", "Питання", "Інше").
     • If no category is selected, an inline error message should display (e.g., "Будь ласка, оберіть тип повідомлення").

4. Submitting the Message:

   • Given I have filled in the input fields with valid data and selected a category,
     When I click the "Надіслати" button,
     Then my message should be sent to the administrator with the selected category included.
     • And the copy of the message should be sent to me via email.
     • And [optional] I should see a loading indicator while the message is being processed.
     • And I should receive a confirmation message within the modal window (e.g., "Ваше повідомлення надіслано успішно!").
     • And the button "Продовжити" should be placed and enabled.
     • And the button "На Головну" should be placed and enabled.
     • And after I shall click the button "На Головну" I should be redirected to the Home page.
     • Or after I shall click the button "Продовжити" the modal window should be closed .
     • And I should be returned to "Зворотній зв'язок" page.

5. Validation and Error Handling:

   • Given I have not entered a valid email address, left the message field empty, or not selected a category,
     When I try to submit the form,
     Then I should see an error message indicating the required fields (e.g., "Будь ласка, вкажіть правильну електронну пошту", "Повідомлення не може бути порожнім", or "Будь ласка, оберіть тип повідомлення").
     • And the "Надіслати" button should remain disabled until all fields are correctly filled out according to the validation rules.

6. "Відмінити" Button:

   • Given the page "Зворотній зв'язок" is open,
     When I click the "Відмінити" button located within the page,
     Then any data I have entered should be cleared.
     • And I should be returned to the Home page or the current view without changes.

Epic #5