Add 25 stages of the AI Wiki to platform website (#11564)

[ysmoradi]

closes #11564

Summary by CodeRabbit

• New Features
  • Added "What You'll Learn - 25 Comprehensive Stages" section to the Interactive Wiki template with detailed learning stages and descriptions.
  • Introduced hierarchical navigation structure for the Wiki section with expandable categories including EF Core, DTOs & Mapperly, API & OData, and additional topics.

[coderabbitai]

Important

Review skipped

Auto incremental reviews are disabled on this repository.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. 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.

Walkthrough

The PR adds a new "What You'll Learn - 25 Comprehensive Stages" section to the Interactive Wiki page with detailed stage descriptions and learning journey instructions. Navigation is updated to support hierarchical menu items via new IsExpanded and ChildItems properties on BitNavItem.

Changes

Cohort / File(s)	Summary
Interactive Wiki Content src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates07InteractiveWiki.razor	Adds new UI section enumerating 25 comprehensive stages with headers, descriptive paragraphs, and individual div containers with distinctive IDs (ef-core, dtos-mappers, api-odata, etc.). Includes concluding block with learning journey prompt and code sample.
Navigation Structure src/Websites/Platform/src/Bit.Websites.Platform.Client/Shared/MainLayout.razor.cs	Converts single "Interactive Wiki" nav item into expanded parent item with ChildItems list. Introduces two new properties to BitNavItem: IsExpanded (boolean) and ChildItems (List\).

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

• The content addition in Templates07InteractiveWiki.razor is mostly static markup with repetitive structure—straightforward to validate for typos and consistency
• Navigation restructuring in MainLayout.razor.cs involves minimal new logic; focus review on ensuring the new BitNavItem properties are properly initialized and the parent-child hierarchy is correctly established

Poem

🐰 Twenty-five stages now shine bright,
Each with a name and learning light,
Parents and children in menus align,
The wiki's expanded, wisdom's design!
Hop along this organized way,
Your journey awaits, come learn today! 📚✨

Pre-merge checks and finishing touches

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The PR title accurately summarizes the main change: adding 25 stages of the AI Wiki to the platform website, which directly aligns with the primary objective.
Linked Issues check	✅ Passed	The code changes implement the requirement from issue #11564 by adding a comprehensive 'What You'll Learn - 25 Comprehensive Stages' UI section with all 25 stages enumerated and a hierarchical navigation structure.
Out of Scope Changes check	✅ Passed	All changes are directly related to adding the 25 stages UI section and supporting navigation structure; no unrelated modifications detected.

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

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

[coderabbitai]

Actionable comments posted: 1

🧹 Nitpick comments (2)

src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates07InteractiveWiki.razor (2)

32-155: Consider refactoring inline styles and using semantic heading tags.

All 25 stage IDs correctly match the navigation fragment identifiers, which is excellent! However, consider these optional improvements:

1. Replace inline style="margin-top: 1rem;" with a CSS class for consistency and maintainability
2. Use semantic heading tags (<h4> or <h5>) instead of <strong> tags for stage titles to improve document structure and accessibility

Example refactor for one stage:

-<div id="ef-core" style="margin-top: 1rem;">
-    <strong>Stage 1: Entity Framework Core</strong>
+<div id="ef-core" class="wiki-stage">
+    <h4>Stage 1: Entity Framework Core</h4>
     <p>Learn about DbContext, entity models, entity type configurations, and migrations (optional). Understand nullable reference types in EF Core relationships and client-side offline database support.</p>
 </div>

Then add to CSS:

.wiki-stage {
    margin-top: 1rem;
}

.wiki-stage h4 {
    font-weight: bold;
}

---

160-171: Consider refactoring inline styles for code block.

The instructions section is clear and helpful. As a minor optimization, consider moving the inline styles from the <code> element to a CSS class.

Example refactor:

-<code style="display: block; margin: 1rem 0; padding: 0.75rem; background-color: var(--bit-clr-bg-pri); border-radius: 4px;">
+<code class="wiki-command-block">
     Run getting started
 </code>

Then add to CSS:

.wiki-command-block {
    display: block;
    margin: 1rem 0;
    padding: 0.75rem;
    background-color: var(--bit-clr-bg-pri);
    border-radius: 4px;
}

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

Knowledge base: Disabled due to Reviews -> Disable Knowledge Base setting

📥 Commits

Reviewing files that changed from the base of the PR and between b9bc918 and b7455b9.

📒 Files selected for processing (2)

• src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates07InteractiveWiki.razor (1 hunks)
• src/Websites/Platform/src/Bit.Websites.Platform.Client/Shared/MainLayout.razor.cs (1 hunks)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)

• GitHub Check: CodeQL analysis (csharp)
• GitHub Check: build and test

🔇 Additional comments (2)

src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates07InteractiveWiki.razor (1)

24-26: LGTM!

The section header is well-structured and clearly introduces the 25 stages content.

src/Websites/Platform/src/Bit.Websites.Platform.Client/Shared/MainLayout.razor.cs (1)

38-72: BitNavItem class properly supports both IsExpanded and ChildItems properties.

Verification confirms:

• ChildItems property exists as public List<BitNavItem> ChildItems { get; set; } = [];
• IsExpanded property exists as public bool IsExpanded { get; set; }

The code in MainLayout.razor.cs correctly uses these properties with no issues.

[Copilot]

Pull Request Overview

This PR enhances the Interactive Wiki documentation by adding a detailed breakdown of all 25 learning stages and creating a navigable hierarchical structure in the side navigation menu.

• Added comprehensive descriptions for all 25 stages of the interactive learning guide
• Created a nested navigation structure with anchor links to each stage section
• Improved user experience by making the Interactive Wiki menu expandable with direct links to specific topics

Reviewed Changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 1 comment.

File	Description
MainLayout.razor.cs	Transformed the "Interactive Wiki" nav item into an expandable parent with 20 child navigation items linking to specific stage sections
Templates07InteractiveWiki.razor	Added a new "What You'll Learn - 25 Comprehensive Stages" section with detailed descriptions and anchor IDs for all 25 stages