diff --git a/src/pages/Blog.jsx b/src/pages/Blog.jsx index 15da22f..dd6ee12 100644 --- a/src/pages/Blog.jsx +++ b/src/pages/Blog.jsx @@ -1,196 +1,149 @@ import React from 'react'; import './Blog.css'; -import blogImage from '../assets/blog.png'; -import blogImage1 from '../assets/blog1.png'; -import blogImage2 from '../assets/blog2.png'; -import blogImage3 from '../assets/blog3.png'; -import blogImage4 from '../assets/blog4.png'; -import blogImage5 from '../assets/blog5.png'; -import blogImage6 from '../assets/blog6.png'; -const Blog = () => { - const featuredPost = { - id: 0, - title: 'EXPLORING THE WONDERS OF THE UNKNOWN', - excerpt: 'Unraveling the Secrets of the Invisible World\nJoin us as we delve into the fascinating realm of the unseen, exploring the hidden forces and phenomena that shape our reality. From the microscopic wonders of Nanotex undiscovered gems.', - author: 'Community', - date: 'April 25, 2025', - category: 'Insight', - readTime: '12 min read', - image: blogImage +const FEED_JSON_URL = 'https://rss.app/feeds/v1.1/lfgjxjxjR77qIpL0.json'; + +function cleanText(item) { + var raw = item.content_text || item.description || ''; + return raw.replace(/https?:\/\/lnkd\.in\/\S+/g, '').trim(); +} + +function firstLine(text) { + var line = text.split('\n')[0].trim(); + return line.length > 90 ? line.slice(0, 90).trim() + '...' : line; +} + +function mapFeedItem(item, i) { + var full = cleanText(item); + var link = item.url || item.link || ''; + if (link && link.indexOf('http') !== 0) link = 'https://' + link; + var img = item.image || (item.attachments && item.attachments[0] && item.attachments[0].url) || null; + return { + id: item.id || item.guid || i, + title: firstLine(item.title || full || 'Insight Genesis Update'), + fullText: full, + excerpt: full.slice(0, img ? 150 : 300).trim() + (full.length > (img ? 150 : 300) ? '...' : ''), + date: item.date_published + ? new Date(item.date_published).toLocaleDateString('en-US', { year: 'numeric', month: 'short', day: 'numeric' }) + : '', + image: img, + url: link || null }; +} - const blogPosts = [ - { - id: 1, - title: 'EXPLORING THE WONDERS OF THE UNKNOWN', - excerpt: 'Unraveling the Secrets of the Invisible World\nJoin us as we delve into the fascinating realm of the unseen...', - author: 'Community', - date: 'April 5, 2025', - category: 'Community', - readTime: '8 min read', - image: blogImage1, - url: "https://insightgenesis0.wordpress.com/" - }, - { - id: 2, - title: 'EXPLORING THE WONDERS OF THE UNKNOWN', - excerpt: 'Unraveling the Secrets of the Invisible World\nJoin us as we delve into the fascinating realm of the unseen...', - author: 'Community', - date: 'April 10, 2025', - category: 'Community', - readTime: '6 min read', - image: blogImage2, - url: null - }, - { - id: 3, - title: 'EXPLORING THE WONDERS OF THE UNKNOWN', - excerpt: 'Unraveling the Secrets of the Invisible World\nJoin us as we delve into the fascinating realm of the unseen...', - author: 'Community', - date: 'April 13, 2025', - category: 'Community', - readTime: '10 min read', - image: blogImage3, - url: null - }, - { - id: 4, - title: 'EXPLORING THE WONDERS OF THE UNKNOWN', - excerpt: 'Unraveling the Secrets of the Invisible World\nJoin us as we delve into the fascinating realm of the unseen...', - author: 'Community', - date: 'April 5, 2025', - category: 'Community', - readTime: '7 min read', - image: blogImage4, - url: null - }, - { - id: 5, - title: 'EXPLORING THE WONDERS OF THE UNKNOWN', - excerpt: 'Unraveling the Secrets of the Invisible World\nJoin us as we delve into the fascinating realm of the unseen...', - author: 'Community', - date: 'April 13, 2025', - category: 'Community', - readTime: '9 min read', - image: blogImage5, - url: null - }, - { - id: 6, - title: 'EXPLORING THE WONDERS OF THE UNKNOWN', - excerpt: 'Unraveling the Secrets of the Invisible World\nJoin us as we delve into the fascinating realm of the unseen...', - author: 'Community', - date: 'April 13, 2025', - category: 'Community', - readTime: '5 min read', - image: blogImage6, - url: null - } - ]; +const Blog = () => { + const [blogPosts, setBlogPosts] = React.useState([]); + const [loading, setLoading] = React.useState(true); + const [openPost, setOpenPost] = React.useState(null); - const categories = ['All', 'Community', 'Insight', 'Products', 'News']; - const [selectedCategory, setSelectedCategory] = React.useState('Community'); + React.useEffect(() => { + let active = true; + fetch(FEED_JSON_URL) + .then(function (res) { + if (!res.ok) throw new Error('Feed not reachable'); + return res.json(); + }) + .then(function (data) { + var items = data.items || []; + if (active && items.length > 0) setBlogPosts(items.map(mapFeedItem)); + }) + .catch(function (e) { console.warn('Blog: feed error -', e.message); }) + .finally(function () { if (active) setLoading(false); }); + return function () { active = false; }; + }, []); - const filteredPosts = selectedCategory === 'All' - ? blogPosts - : blogPosts.filter(post => post.category === selectedCategory); + var featured = blogPosts[0]; + var rest = blogPosts.slice(1); return ( -
-
-
- // TRENDING // HOT NEWS // TRENDING -
-
+
+
+

FROM THE TEAM

+

Insight Genesis Blog

+

Insights on AI, data, and the future of human intelligence.

+
+ + {loading &&

Loading posts...

} -
-
-
-
- {featuredPost.title} + {!loading && featured && ( +
+ {featured.image && ( +
+ {featured.title}
-
-

{featuredPost.title}

-

{featuredPost.excerpt}

-
- {featuredPost.readTime} - {featuredPost.date} -
+ )} +
+ Featured +

{featured.title}

+

{featured.excerpt}

+
+ {featured.date} + Read article →
-
- - - - -
-
+ )} -
-
-
-

BLOGS

-
-
- Category - {categories.map((category) => ( - - ))} -
- -
-
- -
- {filteredPosts.map((post) => ( -
-
+
+ {rest.map(function (post) { + return ( +
+ {post.image && ( +
{post.title}
-
-

{post.title}

-

{post.excerpt}

-
-
- {post.category} - {post.date} -
- {post.url ? ( - - Read - - ) : ( - Read - )} -
+ )} +
+

{post.title}

+

{post.excerpt}

+
+ {post.date} + Read →
-
- ))} -
+
+
+ ); + })} +
-
- + {openPost && ( +
+
+ + {openPost.image && ( +
+ {openPost.title} +
+ )} +
+ {openPost.date} +

{openPost.title}

+
+ {openPost.fullText.split('\n').map(function (para, idx) { + if (!para.trim()) return null; + return

{para}

; + })} +
+ {openPost.url && ( + + View original on LinkedIn → + + )} +
- + )}
); }; -export default Blog; \ No newline at end of file +export default Blog;