Refactor post rendering logic to include recommended articles and update author details

Author: Mayen007

__pycache__/app.cpython-311.pyc

@@ -4,6 +4,7 @@
 from flask_migrate import Migrate
 from models import Post, Comment, Event
 from datetime import datetime
+from sqlalchemy import func
 import os
 
 
@@ -30,6 +31,10 @@ def create_app():
     def inject_year():
         return {'year': datetime.utcnow().year}
 
+    @app.route('/')
+    def home():
+        return render_template('index.html')
+
     @app.route('/about')
     def about():
         return render_template('about.html')
@@ -54,12 +59,6 @@ def get_events():
         except Exception as e:
             return jsonify({"error": str(e)}), 500
 
-    @app.route('/')
-    def home():
-        teaser_events = Event.query.filter_by(is_featured=True).order_by(
-            Event.event_date.asc()).limit(2).all()
-        return render_template('index.html', teaser_events=teaser_events)
-
     @app.route('/events')
     def events():
         featured_events = Event.query.filter_by(
@@ -78,23 +77,34 @@ def post(post_id):
         post = Post.query.get_or_404(post_id)
         comments = Comment.query.filter_by(post_id=post.id).all()
 
-        # Get previous and next posts for navigation
         prev_post = Post.query.filter(
             Post.id < post_id).order_by(Post.id.desc()).first()
         next_post = Post.query.filter(
             Post.id > post_id).order_by(Post.id.asc()).first()
 
-        # Get related posts (same category, excluding current post)
         related_posts = []
         if post.category:
             related_posts = Post.query.filter(
                 Post.category == post.category,
                 Post.id != post.id
             ).order_by(Post.date_posted.desc()).limit(3).all()
 
+        recommended_posts = []
+        if post.category:
+            recommended_posts = Post.query.filter(
+                Post.category != post.category,
+                Post.id != post.id
+            ).order_by(func.random()).limit(3).all()
+
+        if not recommended_posts:
+            recommended_posts = Post.query.filter(
+                Post.id != post.id
+            ).order_by(func.random()).limit(3).all()
+
         return render_template("post.html", post=post, comments=comments,
                                prev_post=prev_post, next_post=next_post,
-                               related_posts=related_posts)
+                               related_posts=related_posts,
+                               recommended_posts=recommended_posts)
 
     @app.route('/add_comment/<int:post_id>', methods=['POST'])
     def add_comment(post_id):
@@ -111,7 +121,6 @@ def add_comment(post_id):
         db.session.add(comment)
         db.session.commit()
 
-        # Redirect to the post page
         return redirect(url_for('post', post_id=post_id))
 
     return app

app.py

@@ -57,7 +57,7 @@ def populate_database():
         """,
             category="Artificial Intelligence",
             date_posted=datetime.utcnow(),
-            image_url="./static/img/ai-ml.jpg"
+            image_url="img/ai-ml.jpg"
         )
 
         post2 = Post(
@@ -100,7 +100,7 @@ def populate_database():
             """,
             category="Web Development",
             date_posted=datetime.utcnow(),
-            image_url="./static/img/web-dev.jpg"
+            image_url="img/web-dev.jpg"
         )
 
         post3 = Post(
@@ -130,7 +130,7 @@ def populate_database():
         """,
             category="Tech and Gadgets",
             date_posted=datetime.utcnow(),
-            image_url="./static/img/tech-gadget.jpg"
+            image_url="img/tech-gadget.jpg"
         )
 
         post4 = Post(
@@ -161,7 +161,7 @@ def populate_database():
         """,
             category="Technology",
             date_posted=datetime.utcnow(),
-            image_url="./static/img/5g.jpg"
+            image_url="img/5g.jpg"
         )
 
         post5 = Post(
@@ -202,7 +202,7 @@ def populate_database():
             """,
             category="Cybersecurity",
             date_posted=datetime.utcnow(),
-            image_url="./static/img/cybersecurity.jpg"
+            image_url="img/cybersecurity.jpg"
         )
 
         post6 = Post(
@@ -242,7 +242,7 @@ def populate_database():
             """,
             category="Technology",
             date_posted=datetime.utcnow(),
-            image_url="./static/img/quantum-computing.jpg"
+            image_url="img/quantum-computing.jpg"
         )
 
         db.session.add_all([post1, post2, post3, post4, post5, post6])
@@ -275,7 +275,7 @@ def populate_database():
             description='A deep dive into the latest cybersecurity trends and best practices.',
             location='London, UK',
             event_date=datetime(2025, 6, 20),
-            image_url='events/cybersecurity_forum.jpg',
+            image_url='img/cybersecurity_forum.jpg',
             link='https://cybersecurityforum.com',
             is_featured=False,
             category='Workshop'
@@ -297,7 +297,7 @@ def populate_database():
             description='Discover how cloud technology is transforming industries worldwide.',
             location='Singapore',
             event_date=datetime(2025, 9, 12),
-            image_url='events/cloud_expo.jpg',
+            image_url='img/cloud_expo.jpg',
             link='https://cloudexpo.com',
             is_featured=False,
             category='Webinar'
@@ -319,7 +319,7 @@ def populate_database():
             description='Showcasing cutting-edge robotics and automation advancements.',
             location='Tokyo, Japan',
             event_date=datetime(2025, 11, 8),
-            image_url='events/robotics_expo.jpg',
+            image_url='img/robotics_expo.jpg',
             link='https://roboticsexpo.com',
             is_featured=False,
             category='Conference'

populate_db.py

@@ -2099,6 +2099,7 @@ footer {
   overflow: hidden;
   box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
   transition: transform 0.3s ease;
+  height: 450px;
 }
 
 .featured-post-card:hover {
@@ -2320,7 +2321,7 @@ footer {
   margin-bottom: var(--space-md);
   flex-grow: 1;
   line-height: 1.5;
-  
+
 }
 
 .blog-card-meta {
@@ -3864,6 +3865,10 @@ footer {
     flex-direction: column;
   }
 
+  .featured-post-card {
+    height: 100%;
+  }
+
   .form-visual {
     display: none;
   }

static/css/index.css

@@ -31,7 +31,7 @@ <h1>{{ post.title }}</h1>
         <img src="{{ url_for('static', filename='img/author-avatar.jpg') }}" alt="Author">
       </div>
       <div class="author-info">
-        <h3>John Doe</h3>
+        <h3>Mayen Akech</h3>
         <p>Tech Writer & Developer</p>
       </div>
       <div class="post-share">
@@ -93,10 +93,10 @@ <h4>No Next Post</h4>
     <div class="sidebar-widget author-card">
       <div class="author-card-header">
         <img src="{{ url_for('static', filename='img/author-avatar.jpg') }}" alt="Author">
-        <h3>John Doe</h3>
+        <h3>Mayen Akech</h3>
         <p>Tech Writer & Developer</p>
       </div>
-      <p class="author-bio">John is a seasoned tech enthusiast with over 10 years of experience in software development
+      <p class="author-bio">Mayen is a seasoned tech enthusiast with over 10 years of experience in software development
         and emerging technologies.</p>
       <div class="author-social">
         <a href="#" aria-label="Twitter"><i class="fab fa-twitter"></i></a>
@@ -199,12 +199,12 @@ <h4>{{ comment.username }}</h4>
 <section class="related-articles-section">
   <div class="section-header">
     <h2>You Might Also <span>Enjoy</span></h2>
-    <p class="section-subtitle">More articles from this category</p>
+    <p class="section-subtitle">Discover more tech insights</p>
   </div>
 
   <div class="related-articles-container">
-    {% if related_posts %}
-    {% for related in related_posts %}
+    {% if recommended_posts %}
+    {% for related in recommended_posts %}
     <article class="related-article-card">
       <div class="article-image">
         <img
@@ -227,7 +227,7 @@ <h3>{{ related.title }}</h3>
     {% endfor %}
     {% else %}
     <div class="no-related">
-      <p>No related articles available at this time.</p>
+      <p>No recommended articles available at this time.</p>
     </div>
     {% endif %}
   </div>