Adding SignIn With Google

Dockerfile

@@ -15,7 +15,7 @@ COPY ./requirements.txt /var/www/app/requirements.txt
 RUN pip install -r /var/www/app/requirements.txt
 RUN pip install gunicorn
 COPY . /var/www/app
-ENV PORT 8080
+ENV PORT 8000
 EXPOSE $PORT
 # to be equal to the cores available.
 CMD exec gunicorn --bind :$PORT run:app  --workers 2 --threads 8 --timeout 3600

src/config/config.py

@@ -77,10 +77,23 @@ class Config:
         env_file_encoding = 'utf-8'
 
 
+class GoogleSettings(BaseSettings):
+    GOOGLE_ANALYTICS_ID: str = Field(..., env="GOOGLE_ANALYTICS_ID")
+    GOOGLE_ANALYTICS_DOMAIN: str = Field(..., env="GOOGLE_ANALYTICS_DOMAIN")
+    GOOGLE_CLIENT_ID: str = Field(..., env="GOOGLE_CLIENT_ID")
+    GOOGLE_CLIENT_SECRET: str = Field(..., env="GOOGLE_CLIENT_SECRET")
+
+    class Config:
+        case_sensitive = True
+        env_file = '.env.development'
+        env_file_encoding = 'utf-8'
+
+
 class Settings(BaseSettings):
     EMAIL_SETTINGS: EmailSettings = EmailSettings()
     CELERY_SETTINGS = CelerySettings()
     SECRET_KEY: str = Field(..., env="SECRET_TOKEN")
+
     DATABASE_SETTINGS: DatabaseSettings = DatabaseSettings()
     DEVELOPMENT_SERVER_NAME: str = Field(default="DESKTOP-T9V7F59")
     LOGGING: Logging = Logging()
@@ -89,6 +102,7 @@ class Settings(BaseSettings):
     SERVER_NAME: str = Field(default_factory=get_server_name)
     APPLICATION_ROOT: str = Field(default="/")
     PREFERRED_URL_SCHEME: str = Field(default="https://")
+    GOOGLE_SETTINGS: GoogleSettings = GoogleSettings()
     GITHUB_SETTINGS: GithubSettings = GithubSettings()
     SEARCH_CONSOLE_API_KEY: str = Field(..., env="SEARCH_CONSOLE_API_KEY")
     EOD_STOCK_API_KEY: str = Field(..., env="EOD_STOCK_API_KEY")

src/main.py

@@ -6,6 +6,7 @@
 from src.config import config_instance
 from src.exceptions import UnAuthenticatedError
 from src.logger import init_logger
+from src.routes.authentication.dance import google_dance
 from src.routes.blog.github import GithubBlog
 
 user_session = {}
@@ -62,6 +63,7 @@ def create_app(config=config_instance()) -> Flask:
         app.register_blueprint(plan_routes)
         app.register_blueprint(sitemap_bp)
         app.register_blueprint(github_blog_route)
+        app.register_blueprint(google_dance)
 
         # Handle API Errors, all errors are re raised as HTTPException
         from src.exceptions import (InvalidSignatureError, ServerInternalError, UnresponsiveServer)

src/routes/authentication/dance.py

@@ -0,0 +1,20 @@
+from flask import Flask, redirect, url_for
+from flask_dance.contrib.google import make_google_blueprint, google
+
+from src.config import config_instance
+
+app = Flask(__name__)
+app.secret_key = config_instance().SECRET_KEY
+
+google_dance = make_google_blueprint(client_id=config_instance().GOOGLE_SETTINGS.GOOGLE_CLIENT_ID,
+                                     client_secret=config_instance().GOOGLE_SETTINGS.GOOGLE_CLIENT_SECRET,
+                                     scope=["profile", "email"])
+
+
+@google_dance.route("/login/google")
+def login_google():
+    if not google.authorized:
+        return redirect(url_for("google.login"))
+    resp = google.get("/oauth2/v2/userinfo")
+    assert resp.ok, resp.text
+    return "You are {email} on Google".format(email=resp.json()["email"])

src/static/build/css/custom.min.css

@@ -6020,3 +6020,44 @@ ul.notifications {
 #slash {
     display: none;
 }
+
+.btn-google {
+    background-color: #00243F;
+    border: none;
+    color: floralwhite;
+    padding: 10px 20px;
+    text-align: center;
+    text-decoration: none;
+    display: inline-block;
+    font-size: 16px;
+    border-radius: 50px;
+}
+
+.btn-google:hover {
+    background-color: #357AE8;
+}
+
+.btn-google i {
+    margin-right: 10px;
+}
+
+.btn-email {
+    background-color: #88000F;
+    border: none;
+    color: floralwhite;
+    padding: 10px 20px;
+    text-align: center;
+    text-decoration: none;
+    display: inline-block;
+    font-size: 16px;
+    border-radius: 50px;
+}
+
+.btn-email:hover {
+    background-color: #8a4182;
+}
+
+.btn-email i {
+    margin-right: 10px;
+}
+

src/template/layouts/authlayout.html

@@ -53,8 +53,11 @@ <h1 class="title"> Login</h1>
                 <input type="password" id="password" class="form-control" placeholder="Enter Password" required="" />
               </div>
               <div>
-                <a class="btn btn-default submit" type="submit" href="{{ url_for('auth.login') }}" id="submit_login">Log in</a>
-                <a class="btn btn-default" href="#signup">Create Account?</a>
+            <a class="btn btn-email submit" type="submit" href="{{ url_for('auth.login') }}" id="submit_login"><i class="fa fa-envelope"> </i> Sign in (Email)</a>
+            <a class="btn btn-google" href="{{ url_for('google.login') }}"> <i class="fa fa-google"></i> Sign in with Google </a>
+
+            <a class="btn btn-dark" href="#signup"><i class="fa fa-user-plus"> </i> Create Account</a>
+
                 <div class="clearfix"></div>
               <span class="title" id="message"></span>
               </div>