feat: ✨ Type: Feature, Enhancement | Title: Enhancements in Post Creation and Display Post Feed #14
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description:
The changes mainly focus on enhancing the post creation and display process. The 'text-editor.tsx' file has been cleaned up, removing commented-out code. A new 'post-feed.tsx' file has been added to handle the display of posts in a feed. The 'post.tsx' file has been added to handle the display of individual posts. The 'page.tsx' file now uses the new 'PostFeed' component. Additionally, custom renderers for images and code have been added to enhance the display of these elements in posts. Lastly, a new 'text-editor-output.tsx' file has been added, although it is currently a placeholder.
Main Files Walkthrough:
components/rich-text-editor/text-editor.tsx: Cleaned up the file by removing commented-out code. The rest of the code remains unchanged.
components/posts/post-feed.tsx: New file added. It uses the 'useInfiniteQuery' hook from 'react-query' to fetch posts in an infinite scroll manner. It also handles the display of posts in a feed.
components/posts/post.tsx: New file added. It handles the display of individual posts, including the post's author, votes, comments, and content.
app/(main)/r/[slug]/page.tsx: Now uses the new 'PostFeed' component to display posts. The rest of the code remains unchanged.
components/renderers/custom-image-renderer.tsx: New file added. It provides a custom renderer for images in posts, using the 'next/image' component for optimized image handling.
components/renderers/custom-code-renderer.tsx: New file added. It provides a custom renderer for code blocks in posts, using a 'pre' and 'code' HTML elements for display.
components/rich-text-editor/text-editor-output.tsx: New file added. It is currently a placeholder for a component that will handle the output of the text editor.
Post feed implementation.
Infinite scrolling implemented for better user experience.