From d1310a67bfa6ca5e87f80e3658385eac889113cf Mon Sep 17 00:00:00 2001
From: Cayo Puigdefabregas <cayo@ribaguifi.com>
Date: Wed, 6 Apr 2022 13:50:08 +0200
Subject: [PATCH] add profile form

---
 ereuse_devicehub/forms.py                     |  36 ++++++-
 .../ereuse_devicehub/user_profile.html        | 101 ++----------------
 ereuse_devicehub/views.py                     |   4 +-
 3 files changed, 47 insertions(+), 94 deletions(-)

diff --git a/ereuse_devicehub/forms.py b/ereuse_devicehub/forms.py
index d88c9cf1..dca1044c 100644
--- a/ereuse_devicehub/forms.py
+++ b/ereuse_devicehub/forms.py
@@ -1,9 +1,19 @@
 from flask_wtf import FlaskForm
 from werkzeug.security import generate_password_hash
-from wtforms import BooleanField, EmailField, PasswordField, validators
+from wtforms import (
+    BooleanField,
+    EmailField,
+    PasswordField,
+    SelectField,
+    StringField,
+    validators,
+)
 
+from ereuse_devicehub.enums import Country
 from ereuse_devicehub.resources.user.models import User
 
+COUNTRY = [(x.name, x.value) for x in Country]
+
 
 class LoginForm(FlaskForm):
     email = EmailField('Email Address', [validators.Length(min=6, max=35)])
@@ -59,3 +69,27 @@ class LoginForm(FlaskForm):
             self.form_errors.append(self.error_messages['inactive'])
 
         return user.is_active
+
+
+class ProfileForm(FlaskForm):
+    name = StringField(
+        'First name',
+        [validators.Length(min=2, max=35)],
+        render_kw={'class': "form-control"},
+    )
+    last_name = StringField(
+        'Last name',
+        [validators.Length(min=2, max=35)],
+        render_kw={'class': "form-control"},
+    )
+    email = StringField(
+        'Email Address',
+        [validators.Length(min=6, max=35)],
+        render_kw={'class': "form-control"},
+    )
+    telephone = StringField(
+        'Phone', [validators.Length(min=6, max=35)], render_kw={'class': "form-control"}
+    )
+    country = SelectField(
+        'Country', choices=COUNTRY, default="es", render_kw={'class': "form-select"}
+    )
diff --git a/ereuse_devicehub/templates/ereuse_devicehub/user_profile.html b/ereuse_devicehub/templates/ereuse_devicehub/user_profile.html
index 326f3991..4b6468ba 100644
--- a/ereuse_devicehub/templates/ereuse_devicehub/user_profile.html
+++ b/ereuse_devicehub/templates/ereuse_devicehub/user_profile.html
@@ -126,102 +126,19 @@
             <div class="tab-pane fade profile-edit pt-3" id="profile-edit">
 
               <!-- Profile Edit Form -->
-              <form>
+              <form action="{{ url_for('core.user-profile') }}" method="post">
+              {% for  f in profile_form %}
+                {% if f == profile_form.csrf_token %}
+                  {{ f }}
+                {% else %}
                 <div class="row mb-3">
-                  <label for="profileImage" class="col-md-4 col-lg-3 col-form-label">Profile Image</label>
+                  <label for="company" class="col-md-4 col-lg-3 col-form-label">{{ f.label }}</label>
                   <div class="col-md-8 col-lg-9">
-                    <img src="{{ url_for('static', filename='img/profile-img.jpg') }}" alt="Profile">
-                    <div class="pt-2">
-                      <a href="#" class="btn btn-primary btn-sm" title="Upload new profile image"><i class="bi bi-upload"></i></a>
-                      <a href="#" class="btn btn-danger btn-sm" title="Remove my profile image"><i class="bi bi-trash"></i></a>
-                    </div>
+                    {{ f }}
                   </div>
                 </div>
-
-                <div class="row mb-3">
-                  <label for="fullName" class="col-md-4 col-lg-3 col-form-label">Full Name</label>
-                  <div class="col-md-8 col-lg-9">
-                    <input name="fullName" type="text" class="form-control" id="fullName" value="Kevin Anderson">
-                  </div>
-                </div>
-
-                <div class="row mb-3">
-                  <label for="about" class="col-md-4 col-lg-3 col-form-label">About</label>
-                  <div class="col-md-8 col-lg-9">
-                    <textarea name="about" class="form-control" id="about" style="height: 100px">Sunt est soluta temporibus accusantium neque nam maiores cumque temporibus. Tempora libero non est unde veniam est qui dolor. Ut sunt iure rerum quae quisquam autem eveniet perspiciatis odit. Fuga sequi sed ea saepe at unde.</textarea>
-                  </div>
-                </div>
-
-                <div class="row mb-3">
-                  <label for="company" class="col-md-4 col-lg-3 col-form-label">Company</label>
-                  <div class="col-md-8 col-lg-9">
-                    <input name="company" type="text" class="form-control" id="company" value="Lueilwitz, Wisoky and Leuschke">
-                  </div>
-                </div>
-
-                <div class="row mb-3">
-                  <label for="Job" class="col-md-4 col-lg-3 col-form-label">Job</label>
-                  <div class="col-md-8 col-lg-9">
-                    <input name="job" type="text" class="form-control" id="Job" value="Web Designer">
-                  </div>
-                </div>
-
-                <div class="row mb-3">
-                  <label for="Country" class="col-md-4 col-lg-3 col-form-label">Country</label>
-                  <div class="col-md-8 col-lg-9">
-                    <input name="country" type="text" class="form-control" id="Country" value="USA">
-                  </div>
-                </div>
-
-                <div class="row mb-3">
-                  <label for="Address" class="col-md-4 col-lg-3 col-form-label">Address</label>
-                  <div class="col-md-8 col-lg-9">
-                    <input name="address" type="text" class="form-control" id="Address" value="A108 Adam Street, New York, NY 535022">
-                  </div>
-                </div>
-
-                <div class="row mb-3">
-                  <label for="Phone" class="col-md-4 col-lg-3 col-form-label">Phone</label>
-                  <div class="col-md-8 col-lg-9">
-                    <input name="phone" type="text" class="form-control" id="Phone" value="(436) 486-3538 x29071">
-                  </div>
-                </div>
-
-                <div class="row mb-3">
-                  <label for="Email" class="col-md-4 col-lg-3 col-form-label">Email</label>
-                  <div class="col-md-8 col-lg-9">
-                    <input name="email" type="email" class="form-control" id="Email" value="k.anderson@example.com">
-                  </div>
-                </div>
-
-                <div class="row mb-3">
-                  <label for="Twitter" class="col-md-4 col-lg-3 col-form-label">Twitter Profile</label>
-                  <div class="col-md-8 col-lg-9">
-                    <input name="twitter" type="text" class="form-control" id="Twitter" value="https://twitter.com/#">
-                  </div>
-                </div>
-
-                <div class="row mb-3">
-                  <label for="Facebook" class="col-md-4 col-lg-3 col-form-label">Facebook Profile</label>
-                  <div class="col-md-8 col-lg-9">
-                    <input name="facebook" type="text" class="form-control" id="Facebook" value="https://facebook.com/#">
-                  </div>
-                </div>
-
-                <div class="row mb-3">
-                  <label for="Instagram" class="col-md-4 col-lg-3 col-form-label">Instagram Profile</label>
-                  <div class="col-md-8 col-lg-9">
-                    <input name="instagram" type="text" class="form-control" id="Instagram" value="https://instagram.com/#">
-                  </div>
-                </div>
-
-                <div class="row mb-3">
-                  <label for="Linkedin" class="col-md-4 col-lg-3 col-form-label">Linkedin Profile</label>
-                  <div class="col-md-8 col-lg-9">
-                    <input name="linkedin" type="text" class="form-control" id="Linkedin" value="https://linkedin.com/#">
-                  </div>
-                </div>
-
+                {% endif %}
+              {% endfor %}
                 <div class="text-center">
                   <button type="submit" class="btn btn-primary">Save Changes</button>
                 </div>
diff --git a/ereuse_devicehub/views.py b/ereuse_devicehub/views.py
index 1a2112a2..f6ed21f4 100644
--- a/ereuse_devicehub/views.py
+++ b/ereuse_devicehub/views.py
@@ -4,7 +4,7 @@ from flask.views import View
 from flask_login import current_user, login_required, login_user, logout_user
 
 from ereuse_devicehub import __version__
-from ereuse_devicehub.forms import LoginForm
+from ereuse_devicehub.forms import LoginForm, ProfileForm
 from ereuse_devicehub.resources.user.models import User
 from ereuse_devicehub.utils import is_safe_url
 
@@ -50,11 +50,13 @@ class UserProfileView(View):
     template_name = 'ereuse_devicehub/user_profile.html'
 
     def dispatch_request(self):
+        form = ProfileForm()
         sessions = {s.created.strftime('%H:%M %d-%m-%Y') for s in current_user.sessions}
         context = {
             'current_user': current_user,
             'sessions': sessions,
             'version': __version__,
+            'profile_form': form,
         }
         return flask.render_template(self.template_name, **context)