dereklseitz/campfire-dashboard
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: Address dependency issues within KendoReact components.

Browse Source 
- add gray-matter to reduce duplicated meta data for posts
    - rename files in data/BlogPosts/ to address limitations in path handling
This commit is contained in:
Derek L. Seitz
2025-09-25 20:10:16 -05:00
parent f94d30e5ef
commit f22d9f08bf
10 changed files with 603 additions and 444 deletions
Download Patch File Download Diff File Expand all files Collapse all files

89
src/pages/Dashboard.jsx
View File

@@ -1,58 +1,69 @@
// DashboardPage.jsx
import React from 'react';
import { blogPosts } from '../data/blog-post-data';
import { loadPosts } from '../data/blog-post-data';
import { Button } from '@progress/kendo-react-buttons';
const Dashboard = React.forwardRef((props, ref) => {
// Separate published and draft posts
// State to hold posts loaded asynchronously
const [blogPosts, setBlogPosts] = useState([]);
// Load posts on component mount
useEffect(() => {
const fetchPosts = async () => {
const postsData = await loadPosts();
setBlogPosts(postsData);
};
fetchPosts();
}, []);
// Separate published and draft posts (no changes here)
const publishedPosts = blogPosts.filter(post => post.published);
const draftPosts = blogPosts.filter(post => !post.published);
const handleEdit = (slug) => {
// Navigate to editor page for the given post slug
props.navigate(`/editor/${slug}`);
};
return (
<div style={{ textAlign: 'center' }} ref={ref}>
<h1>Dashboard</h1>
<div style={{ textAlign: 'center' }} ref={ref}>
<h1>Dashboard</h1>
<section style={{ textAlign: 'center' }}>
<h2>Published Posts</h2>
{publishedPosts.length ? (
<ul>
{publishedPosts.map(post => (
<li key={post.slug}>
<a class="k-link" href={post.canonical_url} target="_blank" rel="noreferrer">
{post.title}
</a>{' '}
<span style={{ marginLeft: '30px', padding: '0 20px' }} >{post.date}</span>{' '}
<Button style={{ marginLeft: '30px', padding: '0 20px' }} onClick={() => handleEdit(post.slug)}>Edit</Button>
</li>
))}
</ul>
) : (
<p>No published posts.</p>
)}
</section>
<section style={{ textAlign: 'center' }}>
<h2>Published Posts</h2>
{publishedPosts.length ? (
<ul>
{publishedPosts.map(post => (
<li key={post.slug}>
<a className="k-link" href={post.canonical_url} target="_blank" rel="noreferrer">
{post.title}
</a>{' '}
<span style={{ marginLeft: '30px', padding: '0 20px' }}>{post.date}</span>{' '}
<Button style={{ marginLeft: '30px', padding: '0 20px' }} onClick={() => handleEdit(post.slug)}>Edit</Button>
</li>
))}
</ul>
) : (
<p>No published posts.</p>
)}
</section>
<section style={{ textAlign: 'center' }}>
<h2>Drafts</h2>
{draftPosts.length ? (
<ul>
{draftPosts.map(post => (
<li key={post.slug}>
{post.title}{' '}
<Button style={{ marginLeft: '30px', padding: '0 20px' }} onClick={() => handleEdit(post.slug)}>Edit</Button>
</li>
))}
</ul>
) : (
<p>No drafts.</p>
)}
</section>
<section style={{ textAlign: 'center' }}>
<h2>Drafts</h2>
{draftPosts.length ? (
<ul>
{draftPosts.map(post => (
<li key={post.slug}>
{post.title}{' '}
<Button style={{ marginLeft: '30px', padding: '0 20px' }} onClick={() => handleEdit(post.slug)}>Edit</Button>
</li>
))}
</ul>
) : (
<p>No drafts.</p>
)}
</section>
</div>
);
});
export default Dashboard;
export default Dashboard;