diff --git a/src/components/Cards/PostCard.jsx b/src/components/Cards/PostCard.jsx index 145b29f..e1072bf 100644 --- a/src/components/Cards/PostCard.jsx +++ b/src/components/Cards/PostCard.jsx @@ -27,8 +27,10 @@ const PostCard = ({ post, onEdit }) => { const formattedDate = date.toLocaleDateString(undefined, dateOptions); + // Split formatted date to check if time component exists const parts = formattedDate.split(','); if (parts.length > 1) { + // Reconstruct with separate date and time formatting for consistency const timePart = date.toLocaleTimeString(undefined, { hour: 'numeric', minute: '2-digit', hour12: true }); const datePart = date.toLocaleDateString(undefined, { year: 'numeric', month: 'short', day: 'numeric' }); return `${datePart}, ${timePart}`; diff --git a/src/components/Editor/MarkdownEditor.jsx b/src/components/Editor/MarkdownEditor.jsx index 3c236d2..4303492 100644 --- a/src/components/Editor/MarkdownEditor.jsx +++ b/src/components/Editor/MarkdownEditor.jsx @@ -1,6 +1,5 @@ // MarkdownEditor.jsx // KendoReact Splitter implementation for dual-pane markdown editing with live preview -// Demonstrates advanced layout components and real-time markdown processing import React, { useState } from 'react'; import { Splitter, SplitterPane } from '@progress/kendo-react-layout'; import { marked } from 'marked'; diff --git a/src/components/Editor/WysiwygEditor.jsx b/src/components/Editor/WysiwygEditor.jsx index 5144407..d5e90fb 100644 --- a/src/components/Editor/WysiwygEditor.jsx +++ b/src/components/Editor/WysiwygEditor.jsx @@ -1,6 +1,5 @@ // WysiwygEditor.jsx // KendoReact Editor implementation for HTML editing with custom toolbar -// Demonstrates custom tool integration and advanced editor configuration import React, { useState } from 'react'; import { Editor, EditorTools, EditorToolsSettings } from '@progress/kendo-react-editor'; import InlineCodeTool from './custom/InlineCodeTool'; diff --git a/src/components/Editor/custom/EditorModeToggle.jsx b/src/components/Editor/custom/EditorModeToggle.jsx index f9ba9b9..4131062 100644 --- a/src/components/Editor/custom/EditorModeToggle.jsx +++ b/src/components/Editor/custom/EditorModeToggle.jsx @@ -1,6 +1,5 @@ // EditorModeToggle.jsx // Custom KendoReact component for switching between HTML and Markdown editing modes -// Demonstrates reusable UI components and state management patterns import React from 'react'; import { Button } from '@progress/kendo-react-buttons'; diff --git a/src/components/Editor/custom/InlineCodeTool.jsx b/src/components/Editor/custom/InlineCodeTool.jsx index 6259bd7..f83ad45 100644 --- a/src/components/Editor/custom/InlineCodeTool.jsx +++ b/src/components/Editor/custom/InlineCodeTool.jsx @@ -21,14 +21,14 @@ const InlineCodeTool = (props) => { const hasMark = state.doc.rangeHasMark(from, to, markType); if (hasMark) { - // Remove code mark if already present + // Remove code mark if already present (toggle off) tr.removeMark(from, to, markType); } else { - // Add code mark to selected text + // Add code mark to selected text (toggle on) tr.addMark(from, to, markType.create()); } - // Dispatch transaction to apply changes + // Dispatch transaction to apply changes to editor dispatch(tr); } } diff --git a/src/components/LoginComponent.jsx b/src/components/LoginComponent.jsx index c282141..5fa071c 100644 --- a/src/components/LoginComponent.jsx +++ b/src/components/LoginComponent.jsx @@ -24,6 +24,7 @@ const LoginComponent = ({ onLogin }) => { } else { console.error("Invalid username or password"); setError("Invalid username or password. Please try again."); + // Clear error after 50 seconds (long timeout for demo purposes) setTimeout(() => { setError(''); }, 50000); diff --git a/src/components/PanelBar.jsx b/src/components/PanelBar.jsx index 879b6d1..41aa419 100644 --- a/src/components/PanelBar.jsx +++ b/src/components/PanelBar.jsx @@ -35,7 +35,7 @@ const CampfirePanelBar = ({ isExpanded = true }) => { const navigate = useNavigate(); const renderItem = (item) => { - // External links + // Handle external links (open in new tab) if (item.url) { return ( { ); } - // Internal routes + // Handle internal routes (navigate within app) if (item.route) { return ( { ); } - // Headers with children + // Handle section headers with child items return ( { const path = location.pathname; const pathSegments = path.split('/').filter(segment => segment); + // Dashboard routes if (path === '/dashboard' || path === '/') { return [{ id: 'dashboard', text: 'Dashboard' }]; } + // Published posts filter if (path === '/posts') { return [ { id: 'dashboard', text: 'Dashboard' }, @@ -21,6 +23,7 @@ const CampfireBreadcrumb = () => { ]; } + // Drafts filter if (path === '/drafts') { return [ { id: 'dashboard', text: 'Dashboard' }, @@ -28,6 +31,7 @@ const CampfireBreadcrumb = () => { ]; } + // New post editor if (path === '/editor') { return [ { id: 'editor', text: 'Editor' }, @@ -35,6 +39,7 @@ const CampfireBreadcrumb = () => { ]; } + // Edit existing post if (path.startsWith('/editor/')) { const slug = pathSegments[1]; return [ @@ -43,6 +48,7 @@ const CampfireBreadcrumb = () => { ]; } + // Default fallback return [{ id: 'dashboard', text: 'Dashboard' }]; }; diff --git a/src/components/UI/Copyright.jsx b/src/components/UI/Copyright.jsx index 6cbd3a8..e28a8bd 100644 --- a/src/components/UI/Copyright.jsx +++ b/src/components/UI/Copyright.jsx @@ -18,6 +18,7 @@ export default function Copyright({ isLoginPage, isLoggedIn }) { }, [isLoginPage]); // Show copyright on login page with transition, or at bottom after login + // Hide completely when not on login page and not logged in if (!isLoginPage && !isLoggedIn) { return null; } diff --git a/src/pages/Dashboard.jsx b/src/pages/Dashboard.jsx index 845d806..30635d1 100644 --- a/src/pages/Dashboard.jsx +++ b/src/pages/Dashboard.jsx @@ -48,6 +48,7 @@ const Dashboard = React.forwardRef((props, ref) => { }; const filter = getFilterFromPath(); + // Show sections based on URL filter or show both if no filter const showPublished = !filter || filter === 'published'; const showDrafts = !filter || filter === 'drafts'; diff --git a/src/pages/EditorPage.jsx b/src/pages/EditorPage.jsx index 3e77893..3142d45 100644 --- a/src/pages/EditorPage.jsx +++ b/src/pages/EditorPage.jsx @@ -79,7 +79,7 @@ const EditorPage = React.forwardRef((props, ref) => { if (editMode === 'html') { // Switch to markdown mode - keep the existing markdown content setEditMode('markdown'); - // Reset splitter to 50/50 + // Reset splitter to 50/50 for markdown editor setPanes([ { size: '50%' }, {}