import { useEffect, useState } from 'react';
import { useParams, Link } from 'react-router-dom';
import { blogPostsData } from '../data/blogPostsData';
import { NotFound } from './NotFound';
export const BlogPost = () => {
const { slug } = useParams<{ slug: string }>();
const [post, setPost] = useState(blogPostsData.find(post => post.slug === slug));
const [relatedPosts, setRelatedPosts] = useState(blogPostsData.slice(0, 3));
useEffect(() => {
// Find the post by slug
const currentPost = blogPostsData.find(post => post.slug === slug);
if (currentPost) {
// Set the post
setPost(currentPost);
// Find related posts (same category or shared tags)
const related = blogPostsData
.filter(p => p.id !== currentPost.id)
.filter(p =>
p.category === currentPost.category ||
p.tags.some(tag => currentPost.tags.includes(tag))
)
.slice(0, 3);
setRelatedPosts(related);
// Scroll to top when new post is loaded
window.scrollTo(0, 0);
}
}, [slug]);
if (!post) {
return ;
}
return (
{/* Post Header */}
{post.category}
{/* Post Info */}
{post.title}
{post.date}
{post.author}
{post.readTime}
{post.commentCount} Comments
{/* Post Content */}
{/* Post Tags */}
{post.tags.map((tag, index) => (
{tag}
))}
{/* Share Section */}
Share this arcane knowledge
{/* Author Info */}
SecCodeSmith
Digital blacksmith forging embedded systems and IoT solutions in the fires of innovation. Specializes in low-level firmware, communication protocols, and hardware-software integration for resource-constrained devices.
{/* Comments Section */}
Discussions ({post.commentCount})
{/* Sample Comments */}
Michael Chen
May 5, 2025 at 15:42
Excellent article! I've been struggling with I2C bus lockups in my weather station project. The recovery function you provided solved the issue. Have you considered adding a timeout mechanism to the SPI transfers for error detection?
@Michael - Good point about the timeout! For SPI transfers, you can implement a timeout using either the HAL Timeout parameter or a hardware timer. For maximum reliability, I prefer using the hardware timer approach as it continues to function even if the main code gets stuck. I'll cover this in a future article on error handling.