@@ -100,14 +100,6 @@ Based on comprehensive PR review analysis, follow these critical development sta
100100- Use utilities from established libraries: 'web-utility'
101101- Import ` './Base' ` in model files for proper configuration
102102
103- #### Data and API Integration
104-
105- - Use ** GitHub API** with ContentModel from mobx-github for content management
106- - Use configured ` githubClient ` from ` models/Base.ts ` for authenticated API calls
107- - ** Base64 decode** content from GitHub API responses: ` atob(item.content) `
108- - Replace filesystem reading with GitHub Contents API calls
109- - Use ` ContentModel('owner', 'repo') ` pattern for repository content access
110-
111103#### Error Handling and Static Generation
112104
113105- ** Natural error throwing** for static generation - let errors bubble up to catch build issues
@@ -118,9 +110,20 @@ Based on comprehensive PR review analysis, follow these critical development sta
118110
119111#### Component Usage Patterns
120112
121- - ** ALWAYS use React Bootstrap components** instead of custom HTML elements
122- - Use utilities from established libraries: 'web-utility'
123- - Import from existing configured clients: use ` githubClient ` from ` models/Base.ts `
113+ ``` typescript
114+ // ✅ Correct - use React Bootstrap components
115+ import { Button , Badge , Breadcrumb , Card , Container } from ' react-bootstrap' ;
116+
117+ < Button variant = " outline-primary" size = " sm" href = {url } target = " _blank" >
118+ {t (' edit_on_github' )}
119+ < / Button >
120+
121+ < Badge bg = " secondary" > {label }< / Badge >
122+
123+ // ❌ Wrong - custom HTML elements
124+ < a href = {url } className = " btn btn-outline-primary" > Edit < / a >
125+ < span className = " badge bg-secondary" > {label }< / span >
126+ ```
124127
125128#### Semantic HTML Structure
126129
0 commit comments