Migrations and Seeders Added, Auth Templates and Backend UI Added

Author: yubarajshrestha

.gitignore

@@ -2,4 +2,10 @@ venv
 virtualenv
 .env
 storage/public/*
-.vscode
+.vscode
+.idea
+.DS_Store
+redis.conf
+redis-data
+*.log
+.pytest_cache

app/__init__.py

@@ -27,7 +27,8 @@ def factory(config=DevelopmentConfig) -> Flask:
         'CACHE_TYPE': 'RedisCache',
         'CACHE_REDIS_HOST': config.REDIS_HOST,
     }
-    cache.init_app(app, config=cache_config)
+    # Enable to use Redis as cache backend
+    # cache.init_app(app, config=cache_config)
 
     # initialize mail
     mail.init_app(app)
@@ -57,7 +58,7 @@ def factory(config=DevelopmentConfig) -> Flask:
 
 
 def register_login_manager(app):
-    login_manager.login_view = 'auth.login_page'
+    login_manager.login_view = 'auth.login'
     login_manager.init_app(app)
     login_manager.session_protection = 'strong'
     login_manager.login_message = 'Please login to access this page.'
@@ -91,7 +92,7 @@ def register_logging(app) -> None:
     app.logger.removeHandler(default_handler)
 
     # Create a file handler object
-    file_handler = RotatingFileHandler('flaskapp.log', maxBytes=16384, backupCount=20)
+    file_handler = RotatingFileHandler('storage/logs/flaskapp.log', maxBytes=16384, backupCount=20)
 
     # Set the logging level of the file handler object so that it logs INFO and up
     file_handler.setLevel(logging.INFO)
@@ -110,39 +111,44 @@ def register_error_handlers(app) -> None:
     # 400 - Bad Request
     @app.errorhandler(400)
     def bad_request(e):
-        return render_template('errors/400.html', context={
+        data = {
             "title": 400,
             "message": "Bad Request"
-        }), 400
+        }
+        return render_template('errors/400.html', **data), 400
 
     # 403 - Forbidden
     @app.errorhandler(403)
     def forbidden(e):
-        return render_template('errors/403.html', context={
+        data = {
             "title": 403,
             "message": "Forbidden"
-        }), 403
+        }
+        return render_template('errors/403.html', **data), 403
 
     # 404 - Page Not Found
     @app.errorhandler(404)
     def page_not_found(e):
-        return render_template('errors/404.html', context={
+        data = {
             "title": 404,
             "message": "Page not found"
-        }), 404
+        }
+        return render_template('errors/404.html', **data), 404
 
     # 405 - Method Not Allowed
     @app.errorhandler(405)
     def method_not_allowed(e):
-        return render_template('errors/405.html', context={
+        data = {
             "title": 405,
             "message": "Method Not Allowed"
-        }), 405
+        }
+        return render_template('errors/405.html', **data), 405
 
     # 500 - Internal Server Error
     @app.errorhandler(500)
     def server_error(e):
-        return render_template('errors/500.html', context={
+        data = {
             "title": 500,
             "message": "Internal Server Error"
-        }), 500
+        }
+        return render_template('errors/500.html', **data), 500

app/controllers/AuthController.py

@@ -1,13 +1,16 @@
 from app.models.User import User
 from app.forms import ForgotPasswordForm, LoginForm
 from flask import render_template, redirect, request
-from flask_login import login_user, logout_user, login_required, current_user
+from flask_login import login_user, logout_user, login_required
 
 
 class AuthController():
 
     @staticmethod
     def login():
+        """
+        Login page
+        """
         form = LoginForm()
         if request.method == 'GET':
             return render_template('pages/auth/login.html', title='Login', form=form)
@@ -24,7 +27,7 @@ def login():
                     login_user(user)
                     return redirect('/home')
 
-            return render_template('pages/auth/login.html', title='Login', form=form, message="User not found!")
+            return render_template('pages/auth/login.html', title='Login', form=form, message="Invalid credentials!")
 
     def register():
         """
@@ -56,8 +59,21 @@ def logout():
 
     @login_required
     def profile():
-        return render_template('pages/auth/profile.html', title='Profile', user=current_user)
+        data = {
+            'title': 'Profile',
+        }
+        return render_template('pages/auth/profile.html', **data)
 
     @login_required
     def home():
-        return render_template('pages/auth/home.html', title='Home', user=current_user)
+        data = {
+            'title': 'Home',
+        }
+        return render_template('pages/auth/home.html', **data)
+
+    @login_required
+    def settings():
+        data = {
+            'title': 'Settings',
+        }
+        return render_template('pages/auth/settings.html', **data)

app/controllers/WelcomeController.py

@@ -6,15 +6,24 @@ class WelcomeController():
 
     @staticmethod
     def index():
-        return render_template("pages/index.html")
+        data = {
+            'title': 'Home Page',
+        }
+        return render_template("pages/index.html", **data)
 
     @staticmethod
     def about():
-        return render_template("pages/about.html")
+        data = {
+            'title': 'About Page',
+        }
+        return render_template("pages/about.html", **data)
 
     @staticmethod
     def contact():
-        return render_template("pages/contact.html")
+        data = {
+            'title': 'Contact Page',
+        }
+        return render_template("pages/contact.html", **data)
 
     @staticmethod
     def file_upload():

app/models/User.py

@@ -1,21 +1,21 @@
 from app import db
 from flask_login import UserMixin
+from werkzeug.security import check_password_hash
 
 
 class User(db.Model, UserMixin):
 
-    __fillable__ = ['name', 'email']
+    __fillable__ = ['name', 'email', 'password', 'email_verified_at']
 
     def check_password(self, password):
-        return True
+        return check_password_hash(self.password, password)
 
     def send_password_reset_email(self):
         from app.jobs.MailJob import send_mail_job
         message_data = {
             'subject': 'Reset Password',
             'body': 'This email was sent asynchronously using Celery.',
             'recipients': self.email,
-
         }
         send_mail_job.apply_async(args=[message_data])
 

app/views/layouts/base.html

@@ -13,6 +13,7 @@
 <body>
     {% block content %}
     {% endblock %}
+    <script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.x.x/dist/alpine.min.js" defer></script>
 </body>
 
 </html>

app/views/layouts/dashboard.html

@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>{{ title }}</title>
+    <link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet">
+
+</head>
+
+<body>
+    <div class="min-h-screen flex flex-col flex-auto flex-shrink-0 antialiased relative bg-gray-50 text-gray-800">
+        {% include 'partials/navbar.html' %}
+        {% include 'partials/sidebar.html' %}
+        <main class="flex flex-col w-full min-h-screen flex-1 overflow-hidden pl-64">
+            <div class="content min-h-full">
+                {% block content %}
+                {% endblock %}
+            </div>
+        </main>
+    </div>
+    <script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.x.x/dist/alpine.min.js" defer></script>
+</body>
+
+</html>

app/views/macros/form_input_validation.html

@@ -0,0 +1,16 @@
+{% macro with_errors(field) %}
+<div class="form_field">
+    {% if field.errors %}
+    {% set label_class = 'text-red-600 font-semibold text-sm text-gray-600 pb-1 block' %}
+    {% set input_class = 'ring-2 ring-red-600 text-red focus:outline-none focus:ring-2 focus:ring-red-600
+    focus:border-transparent text-red-600' +
+    kwargs.pop('class',
+    '') %}
+    {{ field.label(class=label_class, **kwargs) }}
+    {{ field(class=input_class, **kwargs) }}
+    {% else %}
+    {{ field.label(class="font-semibold text-sm text-gray-600 pb-1 block") }}
+    {{ field(**kwargs) }}
+    {% endif %}
+</div>
+{% endmacro %}

app/views/pages/auth/home.html

@@ -1,11 +1,12 @@
-{% extends "layouts/base.html" %}
+{% extends "layouts/dashboard.html" %}
 
 {% block content %}
 
-<div class="min-h-screen bg-gray-100 flex flex-col justify-center sm:py-12">
+<div class="min-h-screen flex flex-col justify-center sm:py-12">
     <div class="p-10 xs:p-0 mx-auto md:w-full md:max-w-md">
-        <h1 class="font-bold text-center text-2xl">Welcome, {{ user.name }}!</h1>
-        <a href="/logout" class="font-bold block text-xs text-center underline cursor-pointer">Logout</a>
+        <h1 class="font-bold text-center text-2xl">Welcome, {{ current_user.name }}!</h1>
+        <span class="font-bold block text-xs text-center underline cursor-pointer">A basic template that you
+            can customize as per your need.</span>
     </div>
 </div>
 

app/views/pages/auth/login.html

@@ -1,5 +1,5 @@
 {% extends "layouts/base.html" %}
-
+{% import "macros/form_input_validation.html" as form_input %}
 {% block content %}
 
 <div class="min-h-screen bg-gray-100 flex flex-col justify-center sm:py-12">
@@ -10,12 +10,18 @@ <h1 class="font-bold text-center text-2xl mb-5">Your Logo</h1>
                 <form class="w-full" method="POST" action="/login">
                     {{ form.csrf_token }}
 
-                    {{ form.email.label(class_="font-semibold text-sm text-gray-600 pb-1 block") }}
-                    {{ form.email(class_="border rounded-lg px-3 py-2 mt-1 mb-5 text-sm w-full", autofocus="") }}
+                    {{ form_input.with_errors(form.email, class="border rounded px-3 py-2 mt-1 mb-5 text-sm w-full",
+                    autofocus="") }}
 
-                    {{ form.password.label(class_="font-semibold text-sm text-gray-600 pb-1 block") }}
-                    {{ form.password(class_="border rounded-lg px-3 py-2 mt-1 mb-5 text-sm w-full", autofocus="") }}
+                    {{ form_input.with_errors(form.password, class="border rounded px-3 py-2 mt-1 mb-5 text-sm w-full",
+                    autofocus="") }}
 
+                    {% if message %}
+                    <div class="text-red-600 text-xs mb-3 text-center">
+                        <strong class="font-bold">Whoops!</strong>
+                        <span class="block sm:inline">{{ message }}</span>
+                    </div>
+                    {% endif %}
                     <button type="submit"
                         class="transition duration-200 bg-blue-500 hover:bg-blue-600 focus:bg-blue-700 focus:shadow-sm focus:ring-4 focus:ring-blue-500 focus:ring-opacity-50 text-white w-full py-2.5 rounded-lg text-sm shadow-sm hover:shadow-md font-semibold text-center inline-block">
                         <span class="inline-block mr-2">Login</span>