Skip to content

Conversation

Copilot
Copy link
Contributor

@Copilot Copilot AI commented Sep 22, 2025

PR-38 PR-38 PR-38 Powered by Pull Request Badge

Powered by Pull Request Badge

This PR implements a new recipes section that provides access to Chinese cooking recipes from the CookLikeHOC repository, following the same pattern as the existing policy pages.

What's Added

New Recipe Pages:

  • /recipes - Index page showing all 238 recipes organized in hierarchical categories (主食, 炒菜, 汤, etc.)
  • /recipes/[...slug] - Individual recipe pages with full markdown content rendering

Navigation Integration:

  • Added recipes link to the Wiki dropdown menu in the main navigation
  • Easy access to recipes from anywhere in the application

GitHub Integration:

  • Added recipeContentStore in models/Wiki.ts targeting the Gar-b-age/CookLikeHOC repository
  • Automatic content fetching and caching with 5-minute revalidation
  • Direct "Edit on GitHub" links to source files

Acknowledgment Section:

  • Added prominent acknowledgment for 老乡鸡餐饮公司及开源菜谱仓库原作者 on recipes homepage
  • Links to the original CookLikeHOC repository with proper attribution

Multilingual Support:
Added translation keys in all supported languages:

  • English: "Recipes", "Servings", "Prep Time"
  • Simplified Chinese: "菜谱", "份数", "准备时间"
  • Traditional Chinese: "菜譜", "份數", "準備時間"

Code Refactoring & Improvements

Shared Components:

  • Created reusable ContentTree component (components/Layout/ContentTree.tsx)
  • Refactored both policy and recipe index pages to eliminate code duplication
  • Reduced codebase by 38 lines while improving maintainability

UI Component Upgrades:

  • Replaced manual Badge lists with BadgeBar component from mobx-restful-table
  • Applied consistent styling across recipe and policy detail pages
  • Enhanced visual consistency throughout the application

Translation Cleanup:

  • Unified translation keys for consistent messaging
  • Removed unused translation keys from all language files
  • Uses consistent github_document_description across all pages

Implementation Details

The implementation follows the exact same patterns as the existing policy pages:

  • Uses ContentModel from mobx-github for repository access
  • Implements static generation with getStaticProps and getStaticPaths
  • Maintains consistent UI with React Bootstrap components
  • Includes proper breadcrumb navigation and GitHub integration

Live Example

The updated recipes homepage now features the acknowledgment section and improved navigation:

Updated Recipes Page

The recipe page for 宫保鸡丁 (Kung Pao Chicken) demonstrates the complete functionality:

Recipe Page Screenshot

Features include:

  • Proper Chinese recipe content with ingredients (配料) and cooking steps (步骤)
  • Breadcrumb navigation: Recipes → 宫保鸡丁.md
  • "Edit on GitHub" button linking to the source repository
  • Responsive layout consistent with the rest of the site
  • Enhanced badge display using BadgeBar component

Files Changed

  • components/Navigator/MainNavigator.tsx - Added recipes link to Wiki dropdown
  • components/Layout/ContentTree.tsx - New shared component for tree rendering
  • models/Wiki.ts - Added recipeContentStore for CookLikeHOC repository
  • pages/recipes/index.tsx - Recipe index page with acknowledgment and shared component
  • pages/recipes/[...slug].tsx - Dynamic recipe pages with BadgeBar component
  • pages/policy/index.tsx - Refactored to use shared ContentTree component
  • pages/policy/[...slug].tsx - Updated to use BadgeBar component
  • translation/*.ts - Updated translation keys in all languages

This provides seamless access to hundreds of Chinese cooking recipes while maintaining full consistency with the existing codebase architecture and improving code quality through refactoring.

Created from VS Code via the GitHub Pull Request extension.

Created from VS Code via the GitHub Pull Request extension.


💬 Share your feedback on Copilot coding agent for the chance to win a $200 gift card! Click here to start the survey.

Co-authored-by: TechQuery <19969570+TechQuery@users.noreply.github.com>
@Copilot Copilot AI changed the title [WIP] 参考 #file:index.tsx #file:[...slug].tsx ,生成 https://github.com/Gar-b-age/CookLikeHOC 的页面。 Add recipes section for CookLikeHOC repository following policy pages pattern Sep 22, 2025
Copilot finished work on behalf of TechQuery September 22, 2025 15:11
@Copilot Copilot AI requested a review from TechQuery September 22, 2025 15:11
@TechQuery TechQuery added the enhancement Some improvements label Sep 22, 2025
Copy link
Member

@TechQuery TechQuery left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@copilot 在主导航栏的知识库菜单下面加一个菜谱链接,并在菜谱主页标题下面注明感谢老乡鸡餐饮公司及开源菜谱仓库原作者。

…ared components, and BadgeBar

Co-authored-by: TechQuery <19969570+TechQuery@users.noreply.github.com>
Copy link
Contributor Author

Copilot AI commented Sep 22, 2025

@copilot 在主导航栏的知识库菜单下面加一个菜谱链接,并在菜谱主页标题下面注明感谢老乡鸡餐饮公司及开源菜谱仓库原作者。

Done! Added recipes link to the Wiki dropdown menu and included acknowledgment text for 老乡鸡餐饮公司及开源菜谱仓库原作者 on the recipes homepage. The changes are in commit 35e585b.

Updated Recipes Page

@Copilot Copilot AI changed the title Add recipes section for CookLikeHOC repository following policy pages pattern Add recipes section for CookLikeHOC repository with navigation integration and code refactoring Sep 22, 2025
@Copilot Copilot AI requested a review from TechQuery September 22, 2025 16:28
Copilot finished work on behalf of TechQuery September 22, 2025 16:28
Copy link

coderabbitai bot commented Sep 22, 2025

Important

Review skipped

Bot user detected.

To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Note

Other AI code review bot(s) detected

CodeRabbit has detected other AI code review bot(s) in this pull request and will avoid duplicating their findings in the review comments. This may lead to a less comprehensive review.

✨ Finishing touches
🧪 Generate unit tests
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch copilot/fix-ea07d89d-d4f4-45f2-87ca-9127e5f17913

Comment @coderabbitai help to get the list of available commands and usage tips.

@TechQuery TechQuery marked this pull request as ready for review September 22, 2025 18:33
Copy link

dosubot bot commented Sep 22, 2025

Related Documentation

Checked 10 published document(s). No updates required.

How did I do? Any feedback?  Join Discord

@TechQuery TechQuery changed the title Add recipes section for CookLikeHOC repository with navigation integration and code refactoring [add] Recipe Wiki pages for CookLikeHOC repository with code refactoring Sep 22, 2025
@TechQuery TechQuery merged commit 8771159 into main Sep 22, 2025
3 of 4 checks passed
@TechQuery TechQuery deleted the copilot/fix-ea07d89d-d4f4-45f2-87ca-9127e5f17913 branch September 22, 2025 18:35
@github-project-automation github-project-automation bot moved this from In progress to Done in 官网项目群 Sep 22, 2025
Copy link

dosubot bot commented Sep 22, 2025

Documentation Updates

Checked 10 published document(s). No updates required.

How did I do? Any feedback?  Join Discord

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement Some improvements
Projects
Status: Done
Development

Successfully merging this pull request may close these issues.

2 participants