feat(cms): types for brand assets page #53
Conversation
kemuru
changed the title
WalkthroughThis pull request introduces multiple new content types and components for the brand assets page in the Strapi CMS backend. The changes include creating schemas, controllers, routes, and services for various sections such as hero, Kleros badges, colors, fonts, logos, PNK token, and styled images. Additionally, two new components ( Changes
Possibly related PRs
Suggested reviewers
Poem
Finishing Touches
🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
✅ Deploy Preview for kleros-website-v2 ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (19)
cms-backend/src/api/brand-assets-page-kleros-colors-section/content-types/brand-assets-page-kleros-colors-section/schema.json (1)
14-26: Consider adding validation rules and required fields.The attributes could benefit from additional configuration:
- Consider marking fields as required where appropriate
- Add min/max length validation for text fields
- Add min/max items validation for the colorCards component
Example enhancement:
"attributes": { "header": { - "type": "string" + "type": "string", + "required": true, + "minLength": 1, + "maxLength": 100 }, "subtitle": { - "type": "string" + "type": "string", + "required": true, + "minLength": 1, + "maxLength": 200 }, "colorCards": { "type": "component", "repeatable": true, - "component": "brand-assets-page.color-card" + "component": "brand-assets-page.color-card", + "required": true, + "min": 1, + "max": 20 } }cms-backend/src/api/brand-assets-page-pnk-token-section/controllers/brand-assets-page-pnk-token-section.ts (1)
5-5: Add missing semicolon for consistency.Add a semicolon after the import statement to maintain TypeScript style consistency.
-import { factories } from '@strapi/strapi' +import { factories } from '@strapi/strapi';cms-backend/src/api/brand-assets-page-pnk-token-section/content-types/brand-assets-page-pnk-token-section/schema.json (3)
14-16: Add required flag and description for header field.Consider adding validation and improving documentation for the header field:
"header": { "type": "string", + "required": true, + "description": "The main title for the PNK token section", + "minLength": 1, + "maxLength": 100 }
17-19: Add required flag and description for subtitle field.Consider adding validation and improving documentation for the subtitle field:
"subtitle": { "type": "string", + "required": true, + "description": "The subtitle text for the PNK token section", + "minLength": 1, + "maxLength": 200 }
20-24: Add required flag and description for imageDownload component.Consider adding validation and improving documentation for the imageDownload component:
"imageDownload": { "type": "component", "repeatable": false, "component": "brand-assets-page.image-download", + "required": true, + "description": "The downloadable PNK token image assets" }cms-backend/src/api/brand-assets-page-styled-images-section/content-types/brand-assets-page-styled-images-section/schema.json (2)
14-16: Add field configurations for better content management.Consider adding configurations for string fields:
requiredflag for mandatory fieldsdefaultvalues where applicableminLength/maxLengthconstraints- Field descriptions for better content editor experience
Example configuration:
"header": { "type": "string", + "required": true, + "minLength": 1, + "maxLength": 100, + "default": "Styled Images", + "description": "Main header for the styled images section" }
23-27: Add constraints for repeatable components.The repeatable image download components should have min/max constraints to prevent potential issues with too few or too many items.
Example configuration:
"wallpapersImageDownloads": { "type": "component", "repeatable": true, - "component": "brand-assets-page.image-download" + "component": "brand-assets-page.image-download", + "min": 1, + "max": 10 }Also applies to: 34-38
cms-backend/src/api/brand-assets-page-kleros-logo-section/controllers/brand-assets-page-kleros-logo-section.ts (1)
1-3: Enhance controller documentation.While the documentation header is present, it could be more descriptive about the controller's purpose and responsibilities.
Consider expanding the documentation:
/** - * brand-assets-page-kleros-logo-section controller + * Controller for managing Kleros logo section content in the brand assets page. + * Handles CRUD operations for logo assets and their associated metadata. + * @module api/brand-assets-page-kleros-logo-section */cms-backend/src/api/brand-assets-page-kleros-logo-section/content-types/brand-assets-page-kleros-logo-section/schema.json (2)
14-16: Add validation constraints for the header field.The header field lacks validation rules which could lead to potential issues with empty or overly long strings.
Consider adding validation constraints:
"header": { "type": "string", + "required": true, + "minLength": 1, + "maxLength": 100 }
1-23: Consider adding metadata fields for SEO and tracking.The schema could benefit from additional fields to support SEO and asset tracking.
Consider adding fields like:
"attributes": { "header": { "type": "string" }, "imageDownloads": { "type": "component", "repeatable": true, "component": "brand-assets-page.image-download" }, + "seoDescription": { + "type": "text", + "required": false + }, + "lastUpdated": { + "type": "datetime", + "private": true + } }cms-backend/src/api/brand-assets-page-kleros-fonts-section/controllers/brand-assets-page-kleros-fonts-section.ts (1)
5-5: Add missing semicolon for consistency.Add a semicolon after the import statement to maintain consistent style.
-import { factories } from '@strapi/strapi' +import { factories } from '@strapi/strapi';cms-backend/src/api/brand-assets-page-kleros-fonts-section/content-types/brand-assets-page-kleros-fonts-section/schema.json (1)
14-16: Add validation rules for the header field.Consider adding validation rules for the header field such as required, minLength, or maxLength to ensure data integrity.
"header": { - "type": "string" + "type": "string", + "required": true, + "minLength": 1, + "maxLength": 100 }cms-backend/src/api/brand-assets-page-hero/routes/brand-assets-page-hero.ts (1)
5-7: Add type annotations for better type safety.Consider adding type annotations to improve type safety and documentation:
-import { factories } from '@strapi/strapi'; +import { Strapi, factories } from '@strapi/strapi'; +const pluginId = 'api::brand-assets-page-hero.brand-assets-page-hero'; + +export default factories.createCoreRouter<Strapi.CoreRouter>(pluginId);cms-backend/src/api/brand-assets-page-logos-package-section/controllers/brand-assets-page-logos-package-section.ts (2)
5-5: Maintain consistent code style.Add a semicolon after the import statement to maintain consistency with other files.
-import { factories } from '@strapi/strapi' +import { factories } from '@strapi/strapi';
7-7: Add type annotations for the controller.Consider adding type annotations to improve type safety and documentation:
-export default factories.createCoreController('api::brand-assets-page-logos-package-section.brand-assets-page-logos-package-section'); +const pluginId = 'api::brand-assets-page-logos-package-section.brand-assets-page-logos-package-section'; + +export default factories.createCoreController<Strapi.CoreController>(pluginId);cms-backend/src/api/brand-assets-page-kleros-badges-section/content-types/brand-assets-page-kleros-badges-section/schema.json (1)
14-16: Add validation rules for string fields.Consider adding validation rules for
headerandsubtitlefields to ensure data integrity:
- Required/optional status
- Min/max length
- Pattern matching if needed
"header": { - "type": "string" + "type": "string", + "required": true, + "minLength": 1, + "maxLength": 100 }, "subtitle": { - "type": "string" + "type": "string", + "required": true, + "minLength": 1, + "maxLength": 200 }Also applies to: 17-19
cms-backend/src/api/brand-assets-page-logos-package-section/content-types/brand-assets-page-logos-package-section/schema.json (1)
14-16: Add validation rules for string fields.Consider adding validation rules for
headerandsubtitlefields to ensure data integrity:
- Required/optional status
- Min/max length
- Pattern matching if needed
"header": { - "type": "string" + "type": "string", + "required": true, + "minLength": 1, + "maxLength": 100 }, "subtitle": { - "type": "string" + "type": "string", + "required": true, + "minLength": 1, + "maxLength": 200 }Also applies to: 17-19
cms-backend/src/api/brand-assets-page-hero/content-types/brand-assets-page-hero/schema.json (2)
14-16: Add validation rules for string fields.Consider adding validation rules for
headerandsubtitlefields to ensure data integrity:
- Required/optional status
- Min/max length
- Pattern matching if needed
"header": { - "type": "string" + "type": "string", + "required": true, + "minLength": 1, + "maxLength": 100 }, "subtitle": { - "type": "string" + "type": "string", + "required": true, + "minLength": 1, + "maxLength": 200 }Also applies to: 17-19
1-37: Consider implementing consistent validation rules across all schemas.All three schemas (
brand-assets-page-hero,brand-assets-page-logos-package-section, andbrand-assets-page-kleros-badges-section) share similar string fields. Consider implementing consistent validation rules across all schemas to maintain data integrity and improve maintainability.I can help create a standardized set of validation rules if you'd like.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (2)
cms-backend/types/generated/components.d.tsis excluded by!**/generated/**cms-backend/types/generated/contentTypes.d.tsis excluded by!**/generated/**
📒 Files selected for processing (34)
cms-backend/src/api/brand-assets-page-hero/content-types/brand-assets-page-hero/schema.json(1 hunks)cms-backend/src/api/brand-assets-page-hero/controllers/brand-assets-page-hero.ts(1 hunks)cms-backend/src/api/brand-assets-page-hero/routes/brand-assets-page-hero.ts(1 hunks)cms-backend/src/api/brand-assets-page-hero/services/brand-assets-page-hero.ts(1 hunks)cms-backend/src/api/brand-assets-page-kleros-badges-section/content-types/brand-assets-page-kleros-badges-section/schema.json(1 hunks)cms-backend/src/api/brand-assets-page-kleros-badges-section/controllers/brand-assets-page-kleros-badges-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-kleros-badges-section/routes/brand-assets-page-kleros-badges-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-kleros-badges-section/services/brand-assets-page-kleros-badges-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-kleros-colors-section/content-types/brand-assets-page-kleros-colors-section/schema.json(1 hunks)cms-backend/src/api/brand-assets-page-kleros-colors-section/controllers/brand-assets-page-kleros-colors-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-kleros-colors-section/routes/brand-assets-page-kleros-colors-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-kleros-colors-section/services/brand-assets-page-kleros-colors-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-kleros-fonts-section/content-types/brand-assets-page-kleros-fonts-section/schema.json(1 hunks)cms-backend/src/api/brand-assets-page-kleros-fonts-section/controllers/brand-assets-page-kleros-fonts-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-kleros-fonts-section/routes/brand-assets-page-kleros-fonts-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-kleros-fonts-section/services/brand-assets-page-kleros-fonts-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-kleros-logo-section/content-types/brand-assets-page-kleros-logo-section/schema.json(1 hunks)cms-backend/src/api/brand-assets-page-kleros-logo-section/controllers/brand-assets-page-kleros-logo-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-kleros-logo-section/routes/brand-assets-page-kleros-logo-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-kleros-logo-section/services/brand-assets-page-kleros-logo-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-logos-package-section/content-types/brand-assets-page-logos-package-section/schema.json(1 hunks)cms-backend/src/api/brand-assets-page-logos-package-section/controllers/brand-assets-page-logos-package-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-logos-package-section/routes/brand-assets-page-logos-package-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-logos-package-section/services/brand-assets-page-logos-package-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-pnk-token-section/content-types/brand-assets-page-pnk-token-section/schema.json(1 hunks)cms-backend/src/api/brand-assets-page-pnk-token-section/controllers/brand-assets-page-pnk-token-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-pnk-token-section/routes/brand-assets-page-pnk-token-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-pnk-token-section/services/brand-assets-page-pnk-token-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-styled-images-section/content-types/brand-assets-page-styled-images-section/schema.json(1 hunks)cms-backend/src/api/brand-assets-page-styled-images-section/controllers/brand-assets-page-styled-images-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-styled-images-section/routes/brand-assets-page-styled-images-section.ts(1 hunks)cms-backend/src/api/brand-assets-page-styled-images-section/services/brand-assets-page-styled-images-section.ts(1 hunks)cms-backend/src/components/brand-assets-page/color-card.json(1 hunks)cms-backend/src/components/brand-assets-page/image-download.json(1 hunks)
✅ Files skipped from review due to trivial changes (12)
- cms-backend/src/api/brand-assets-page-hero/controllers/brand-assets-page-hero.ts
- cms-backend/src/api/brand-assets-page-logos-package-section/services/brand-assets-page-logos-package-section.ts
- cms-backend/src/api/brand-assets-page-kleros-colors-section/services/brand-assets-page-kleros-colors-section.ts
- cms-backend/src/api/brand-assets-page-kleros-logo-section/services/brand-assets-page-kleros-logo-section.ts
- cms-backend/src/api/brand-assets-page-kleros-logo-section/routes/brand-assets-page-kleros-logo-section.ts
- cms-backend/src/components/brand-assets-page/color-card.json
- cms-backend/src/api/brand-assets-page-logos-package-section/routes/brand-assets-page-logos-package-section.ts
- cms-backend/src/api/brand-assets-page-pnk-token-section/routes/brand-assets-page-pnk-token-section.ts
- cms-backend/src/api/brand-assets-page-styled-images-section/services/brand-assets-page-styled-images-section.ts
- cms-backend/src/components/brand-assets-page/image-download.json
- cms-backend/src/api/brand-assets-page-kleros-badges-section/services/brand-assets-page-kleros-badges-section.ts
- cms-backend/src/api/brand-assets-page-hero/services/brand-assets-page-hero.ts
🔇 Additional comments (21)
cms-backend/src/api/brand-assets-page-kleros-colors-section/routes/brand-assets-page-kleros-colors-section.ts (1)
1-7: LGTM! Standard Strapi router implementation.The router is correctly implemented using Strapi's factory pattern and follows the standard naming conventions.
cms-backend/src/api/brand-assets-page-kleros-colors-section/controllers/brand-assets-page-kleros-colors-section.ts (1)
1-7: LGTM! Standard Strapi controller implementation.The controller is correctly implemented using Strapi's factory pattern and follows the standard naming conventions.
cms-backend/src/api/brand-assets-page-kleros-colors-section/content-types/brand-assets-page-kleros-colors-section/schema.json (1)
1-13: LGTM! Content type configuration follows Strapi conventions.The single type configuration with draft/publish capability is appropriate for a brand assets page section.
cms-backend/src/api/brand-assets-page-pnk-token-section/services/brand-assets-page-pnk-token-section.ts (1)
1-7: LGTM! Service implementation follows Strapi's best practices.The service is correctly implemented using Strapi's factory pattern and follows the naming conventions.
cms-backend/src/api/brand-assets-page-pnk-token-section/controllers/brand-assets-page-pnk-token-section.ts (1)
1-7: LGTM! Controller implementation follows Strapi's best practices.The controller is correctly implemented using Strapi's factory pattern and follows the naming conventions.
cms-backend/src/api/brand-assets-page-pnk-token-section/content-types/brand-assets-page-pnk-token-section/schema.json (1)
1-26: LGTM! Schema structure follows Strapi's content-type conventions.The schema is well-structured as a single type with appropriate collection naming and draft/publish capability.
cms-backend/src/api/brand-assets-page-styled-images-section/routes/brand-assets-page-styled-images-section.ts (1)
1-7: LGTM! Standard Strapi router implementation.The router is correctly implemented using Strapi's core router factory with proper API identifier.
cms-backend/src/api/brand-assets-page-styled-images-section/controllers/brand-assets-page-styled-images-section.ts (1)
1-7: LGTM! Standard Strapi controller implementation.The controller is correctly implemented using Strapi's core controller factory with proper API identifier.
cms-backend/src/api/brand-assets-page-styled-images-section/content-types/brand-assets-page-styled-images-section/schema.json (1)
1-40: LGTM! Schema structure follows Strapi's content type patterns.The overall schema structure is well-organized and follows Strapi's content type patterns. The separation of wallpapers and product mockups sections with their respective headers, subtitles, and image downloads is logical.
cms-backend/src/api/brand-assets-page-kleros-logo-section/controllers/brand-assets-page-kleros-logo-section.ts (1)
5-7: LGTM! Controller implementation follows best practices.The implementation correctly uses Strapi's factory pattern with
createCoreController, which provides standard CRUD operations and follows the recommended approach for content type controllers.cms-backend/src/api/brand-assets-page-kleros-logo-section/content-types/brand-assets-page-kleros-logo-section/schema.json (2)
4-8: LGTM! Content type naming follows conventions.The schema correctly defines singular and plural names, with a clear displayName that follows PascalCase convention.
17-21: Verify the existence of the referenced component.The schema references the
brand-assets-page.image-downloadcomponent. Let's verify its existence and structure.✅ Verification successful
Component
brand-assets-page.image-downloadexists and is properly structured🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Check if the referenced component exists and examine its structure fd -t f "image-download.json" "src/components/brand-assets-page" -x cat {}Length of output: 194
Script:
#!/bin/bash # Search for image-download.json file anywhere in the repository fd -H "image-download.json" # Search for brand-assets-page directory to understand the structure fd -t d -H "brand-assets-page"Length of output: 1505
Script:
#!/bin/bash # Examine the structure of the image-download component cat cms-backend/src/components/brand-assets-page/image-download.jsonLength of output: 581
cms-backend/src/api/brand-assets-page-kleros-fonts-section/routes/brand-assets-page-kleros-fonts-section.ts (1)
1-7: LGTM! Standard Strapi router implementation.The router is correctly implemented using Strapi's factory pattern and follows naming conventions.
cms-backend/src/api/brand-assets-page-kleros-fonts-section/services/brand-assets-page-kleros-fonts-section.ts (1)
1-7: LGTM! Standard Strapi service implementation.The service is correctly implemented using Strapi's factory pattern and follows naming conventions.
cms-backend/src/api/brand-assets-page-kleros-fonts-section/controllers/brand-assets-page-kleros-fonts-section.ts (1)
1-7: LGTM! Standard Strapi controller implementation.The controller is correctly implemented using Strapi's factory pattern and follows naming conventions.
cms-backend/src/api/brand-assets-page-kleros-fonts-section/content-types/brand-assets-page-kleros-fonts-section/schema.json (2)
1-23: LGTM! Well-structured schema definition.The schema follows Strapi's conventions and properly defines a single type content model with draft/publish capabilities.
17-21: Verify the referenced component exists.The schema references the
content.link-cardcomponent. Let's verify its existence in the codebase.✅ Verification successful
Component
content.link-cardexists and is properly referencedThe component is correctly defined at
cms-backend/src/components/content/link-card.jsonand matches the schema reference.🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Search for the content.link-card component definition fd --type f "schema.json" | xargs rg -l "content.link-card"Length of output: 377
Script:
#!/bin/bash # Search for the link-card component definition fd --type d "link-card$" --full-path fd --type f "schema.json" | rg "components/content/link-card"Length of output: 98
Script:
#!/bin/bash # Broader search for any files related to link-card fd "link-card"Length of output: 64
cms-backend/src/api/brand-assets-page-kleros-badges-section/routes/brand-assets-page-kleros-badges-section.ts (1)
5-7: Apply consistent TypeScript improvements.Apply the same TypeScript improvements as suggested for the hero section router.
cms-backend/src/api/brand-assets-page-kleros-badges-section/controllers/brand-assets-page-kleros-badges-section.ts (1)
5-7: Apply consistent improvements.Apply the same improvements as suggested for the logos package section controller:
- Add semicolon after import
- Add TypeScript type annotations
cms-backend/src/api/brand-assets-page-kleros-badges-section/content-types/brand-assets-page-kleros-badges-section/schema.json (1)
20-24: Verify the referenced component exists.The schema references
brand-assets-page.image-downloadcomponent. Let's verify its existence.✅ Verification successful
Component
brand-assets-page.image-downloadexists and is correctly referenced🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Check if the image-download component exists fd -t f "image-download.json" "cms-backend/src/components"Length of output: 121
cms-backend/src/api/brand-assets-page-logos-package-section/content-types/brand-assets-page-logos-package-section/schema.json (1)
20-29: Consider using a more specific component type for arrowLink.Both
buttonandarrowLinkuse the samecontent.button-linkcomponent type. This might be confusing as they likely serve different purposes. Consider creating a more specific component type forarrowLinkto better represent its intended use.Also, let's verify the referenced component exists:
| "background": { | ||
| "allowedTypes": [ | ||
| "images", | ||
| "files", | ||
| "videos", | ||
| "audios" | ||
| ], | ||
| "type": "media", | ||
| "multiple": false | ||
| } |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Restrict media types for background.
The background field allows unnecessary media types (files, videos, audios) for what appears to be a hero section background. Consider restricting to images only.
"background": {
"allowedTypes": [
- "images",
- "files",
- "videos",
- "audios"
+ "images"
],
"type": "media",
- "multiple": false
+ "multiple": false,
+ "required": true
}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| "background": { | |
| "allowedTypes": [ | |
| "images", | |
| "files", | |
| "videos", | |
| "audios" | |
| ], | |
| "type": "media", | |
| "multiple": false | |
| } | |
| "background": { | |
| "allowedTypes": [ | |
| "images" | |
| ], | |
| "type": "media", | |
| "multiple": false, | |
| "required": true | |
| } |
Summary by CodeRabbit
New Features
Content Type Additions
Components Added