Merge branch 'master' of https://[email protected]/toddbirchard…

…/pythonmyadmin

Makefile

@@ -76,15 +76,15 @@ lint: env
 			--show-source \
 			--statistics
 
-
 .PHONY: clean
 clean:
 	find . -name 'poetry.lock' -delete && \
 	find . -name '.coverage' -delete && \
 	find . -wholename './**/*.pyc' -delete && \
-	find . -type d -wholename '__pycache__' -exec rm -rf {} +
+	find . -type d -wholename '**/__pycache__' -exec rm -rf {} +
 	find . -type d -wholename '.pytest_cache' -exec rm -rf {} +
 	find . -type d -wholename '**/.pytest_cache' -exec rm -rf {} +
 	find . -type d -wholename './logs/*' -exec rm -rf {} +
 	find . -type d -wholename './.reports/*' -exec rm -rf {} +
-	find . -type d -wholename '**/webassets-cache/' -exec rm -rf {} +
+	find . -type d -wholename '**/.webassets-cache/' -exec rm -rf {} +
+	rm -rf './pythonmyadmin/static/.webassets-cache/'

config.py

@@ -4,17 +4,20 @@
 
 from dotenv import load_dotenv
 
-basedir = path.abspath(path.dirname(__file__))
-load_dotenv(path.join(basedir, ".env"))
+BASE_DIR = path.abspath(path.dirname(__file__))
+load_dotenv(path.join(BASE_DIR, ".env"))
 
 
 class Config:
     """Global configuration variables."""
 
     # General Config
+    APP_NAME = "pythonmyadmin"
     ENVIRONMENT = environ.get("ENVIRONMENT")
-    SECRET_KEY = environ.get("SECRET_KEY")
+
+    # Flask Config
     FLASK_APP = environ.get("FLASK_APP")
+    SECRET_KEY = environ.get("SECRET_KEY")
     FLASK_DEBUG = environ.get("FLASK_DEBUG")
 
     # Database

gunicorn.conf.py

@@ -5,15 +5,15 @@
 from dotenv import load_dotenv
 
 # Read environment variables from ".env" file.
-basedir = path.abspath(path.dirname(__file__))
-load_dotenv(path.join(basedir, ".env"))
+BASE_DIR = path.abspath(path.dirname(__file__))
+load_dotenv(path.join(BASE_DIR, ".env"))
 
 # Fetch deployment environment from environment variables.
 ENVIRONMENT = environ.get("ENVIRONMENT")
 
 proc_name = "pythonmyadmin"
-wsgi_app = "wsgi:app"
-bind = "unix:flask.sock"
+wsgi_app = "main:app"
+bind = "unix:pythonmyadmin.sock"
 threads = 4
 workers = 2
 
@@ -23,10 +23,11 @@
     threads = 1
     bind = ["127.0.0.1:8000"]
 elif ENVIRONMENT == "production":
+    access_log_format = "%(h)s %(l)s %(u)s %(t)s %(r)s %(s)s %(b)s %(f)s %(a)s"
     daemon = True
-    accesslog = "/var/log/pythonmyadmin/access.log"
-    errorlog = "/var/log/pythonmyadmin/error.log"
+    accesslog = "/var/log/pythonmyadmin/access.json"
+    errorlog = "/var/log/pythonmyadmin/error.json"
     loglevel = "trace"
-    dogstatsd_tags = "env:prod,service:pythonmyadmin,language:python"
+    dogstatsd_tags = "env:production,service:pythonmyadmin,language:python"
 else:
     raise ValueError(f"Unknown environment provided: `{ENVIRONMENT}`. Must be `development` or `production`.")

pyproject.toml

@@ -41,9 +41,11 @@ flake8 = "*"
 cryptography = "*"
 gunicorn = "*"
 poetry-plugin-export = "*"
+ddtrace = "^2.9.1"
+loguru = "^0.7.2"
 
 [tool.poetry.scripts]
-run = "wsgi:app"
+run = "main:app"
 
 [tool.poetry.urls]
 issues = "https://github.com/toddbirchard/pythonmyadmin/issues"

pythonmyadmin/__init__.py

@@ -17,23 +17,21 @@ def create_app() -> Flask:
     db.init_app(app)
 
     with app.app_context():
-        # Create tables for our models
-        db.create_all()
-
         # Import parts of our application
-        from table import tableview
-
         from . import routes
         from .assets import compile_js_assets, compile_style_assets
+        from .tables import table_view
 
-        # Register App Blueprint
-        app.register_blueprint(routes.main_bp)
+        # Create tables for our models
+        db.create_all()
 
         # Compile static assets
         if app.config["ENVIRONMENT"] == "development":
             compile_js_assets(app)
             compile_style_assets(app)
 
-        app = tableview.create_dash_view(app)
+        # Register App Blueprint
+        app.register_blueprint(routes.main_bp)
+        app = table_view.create_dash_view(app)
 
         return app

pythonmyadmin/assets.py

@@ -10,12 +10,12 @@ def compile_js_assets(app: Flask):
     Environment.debug = False
     js_bundle = Bundle("js/*.js", filters="jsmin", output="dist/js/main.js")
     assets.register("js_all", js_bundle)
-    if app.config["ENVIRONMENT"] != "production":
-        js_bundle.build()
+    js_bundle.build()
 
 
 def compile_style_assets(app: Flask):
     """Build CSS style bundle."""
+    # shutil.rmtree(f"{BASE_DIR}/pythonmyadmin/static/.webassets-cache", ignore_errors=False)
     assets = Environment(app)
     Environment.auto_build = True
     Environment.debug = False
@@ -26,5 +26,4 @@ def compile_style_assets(app: Flask):
         extra={"rel": "stylesheet/less"},
     )
     assets.register("less_all", less_bundle)
-    if app.config["ENVIRONMENT"] != "production":
-        less_bundle.build(force=True)
+    less_bundle.build(force=True)

pythonmyadmin/static/less/main.less

@@ -1,7 +1,7 @@
 @import './variables.less';
 @import './nav.less';
 @import './table.less';
-@import './home.less';
+@import './index.less';
 
 body,
 html {
@@ -10,6 +10,8 @@ html {
   padding: 0;
   background: @background-color !important;
   font-family: @body-font;
+  max-width: 100%;
+  overflow: hidden;
   @media(max-width: @mobile-breakpoint) {
     margin: 0;
   }
@@ -39,10 +41,13 @@ html {
     box-shadow: 0 0 4px #cdd3e2;
     padding: 30px;
     background: white;
+    @media(max-width: @tablet-breakpoint) {
+      max-width: 96vw;
+    }
     @media(max-width: 600px) {
       margin: 0;
       max-width: unset;
-      width: 100%;
+
       padding: 5vw;
     }
 
@@ -84,21 +89,28 @@ html {
 
   .dash-spreadsheet-container {
     max-width: 100%;
-    margin: 40px auto !important;
+    margin: 40px auto;
     overflow: hidden;
     border: 1px solid #d3d8e0;
     box-shadow: none;
     font-family: @body-font;
+
+    @media(max-width: @tablet-breakpoint) {
+      margin: 2vw auto;
+    }
   }
 
   .layout-container {
     width: 1000px;
-    max-width: 90%;
+    max-width: 96vw;
     margin: 20px auto;
+    @media(max-width: @tablet-breakpoint) {
+      width: unset;
+      max-width: 96vw;;
+      margin: 2vw auto 0px auto;
+    }
     @media(max-width: @mobile-breakpoint) {
       width: 100%;
-      max-width: 95%;
-      margin: 20px auto;
     }
   }
 }

pythonmyadmin/static/less/nav.less

@@ -1,13 +1,18 @@
 header {
   position: relative;
   width: 100%;
-  margin-bottom: 50px !important;
+  margin-bottom: 2vw;
   padding: 40px 0 !important;
   background: white !important;
   box-shadow: 0 0 5px #bec6cf;
   font-family: 'Lato', sans-serif;
+  max-width: 100%;
+  overflow: hidden;
+  @media(max-width: 800px) {
+    margin: 0 auto;
+    box-shadow: 0 0 2px #707985;
+  }
   @media(max-width: 600px) {
-    margin: 0 !important;
     padding: 30px 0 !important;
   }
 
@@ -58,7 +63,7 @@ header {
 
     .nav-link,
     a {
-      margin-left: 30px;
+      margin-left: 25px;
       color: #70829d;
       font-size: 1.1em;
       text-decoration: none;
@@ -70,7 +75,7 @@ header {
       }
 
       i {
-        margin-right: 5px;
+        margin-right: 3px;
       }
     }
   }

pythonmyadmin/static/less/table.less

@@ -5,18 +5,26 @@
   margin: 0;
 
   header {
-    margin-bottom: 25px !important;
+    margin-bottom: 25px;
+
+    @media(max-width: @tablet-breakpoint) {
+      margin: 0 auto 2vw;
+    }
   }
 
   .dash-spreadsheet-container {
     max-width: 100%;
-    margin: 25px auto !important;
+    margin: 25px auto;
     overflow: hidden;
     border: 0;
     border-radius: 4px;
     box-shadow: 0 0 4px #cdd3e2;
     font-family: @body-font;
 
+    @media(max-width: @tablet-breakpoint) {
+      margin: 2vw auto;
+    }
+
     * {
       box-shadow: none !important;
       font-family: @body-font;
@@ -57,6 +65,7 @@
 
         svg {
           width: 0.5em;
+          font-size: 1.6em;
         }
       }
 
@@ -78,7 +87,7 @@
         width: fit-content;
 
         span:last-of-type {
-          font-size: 0.85em;
+          font-size: 0.95em;
           text-transform: uppercase;
         }
       }
@@ -94,19 +103,27 @@
       }
     }
 
-    td {
+    .dash-cell {
       padding: 15px 10px !important;
       overflow: hidden !important;
       line-height: 1.25 !important;
       text-align: center !important;
-      transition: all 0.2s ease-out;
+      transition: all 0.1s ease-out;
 
       &.focused {
-        //background-color: rgba(154, 212, 255, 0.2) !important;
-        box-shadow: 0 0 4px #cdd3e2;
-       //  border: 1px #317ed1;
-      }
+        * {
+          background: rgb(49 126 209 / 15%);
+          color: #205681;
+        }
+       }
 
+       &::selection {
+        * {
+          background: rgb(49 126 209 / 15%);
+          color: #205681;
+        }
+      }
+
       &.unfocused {
         caret-color: #317ed1 !important
       }
@@ -119,7 +136,6 @@
         display: block !important;
         max-width: 500px;
         overflow: hidden !important;
-        font-size: .9em;
         font-weight: 300;
         text-align: left !important;
         text-overflow: ellipsis;
@@ -220,7 +236,6 @@
       .Select-value-label {
         padding: 4px 9px;
         line-height: 1;
-        font-size: .8em;
       }
     }
 
@@ -242,7 +257,7 @@
   .previous-page {
     padding: 7px 11px;
     margin: 0 1px;
-    font-size: 0.9em;
+    // font-size: 0.9em;
     font-weight: 300;
     background: #e7f1f2;
     border: 1px solid #b8d6da;