Feat: Add labeled lists support for custom resume sections#765
Open
ahsanirfan961 wants to merge 3 commits into
Open
Feat: Add labeled lists support for custom resume sections#765ahsanirfan961 wants to merge 3 commits into
ahsanirfan961 wants to merge 3 commits into
Conversation
Contributor
There was a problem hiding this comment.
3 issues found across 15 files
Prompt for AI agents (unresolved issues)
Check if these issues are valid — if so, understand the root cause of each and fix them. If appropriate, use sub-agents to investigate and fix each issue separately.
<file name="apps/frontend/components/resume/dynamic-resume-section.tsx">
<violation number="1" location="apps/frontend/components/resume/dynamic-resume-section.tsx:43">
P2: `labeledLists` content gating checks only array length, so empty labeled-list entries can cause visually empty section rendering.</violation>
</file>
<file name="apps/frontend/messages/en.json">
<violation number="1" location="apps/frontend/messages/en.json:168">
P2: `itemsPlaceholder` implies comma-separated items, but the form parser splits only on newlines, creating misleading UX and potential single-item parsing errors.</violation>
</file>
<file name="apps/frontend/messages/ja.json">
<violation number="1" location="apps/frontend/messages/ja.json:167">
P3: Japanese localization typo in `labelPlaceholder` (`技技能`) introduces incorrect user-facing text.</violation>
</file>
Reply with feedback, questions, or to request a fix. Tag @cubic-dev-ai to re-run a review.
| case 'stringList': | ||
| return Boolean(customSection.strings?.length); | ||
| case 'labeledLists': | ||
| return Boolean(customSection.namedLists?.length); |
Contributor
There was a problem hiding this comment.
P2: labeledLists content gating checks only array length, so empty labeled-list entries can cause visually empty section rendering.
Prompt for AI agents
Check if this issue is valid — if so, understand the root cause and fix it. At apps/frontend/components/resume/dynamic-resume-section.tsx, line 43:
<comment>`labeledLists` content gating checks only array length, so empty labeled-list entries can cause visually empty section rendering.</comment>
<file context>
@@ -38,6 +39,8 @@ export const DynamicResumeSection: React.FC<DynamicResumeSectionProps> = ({
case 'stringList':
return Boolean(customSection.strings?.length);
+ case 'labeledLists':
+ return Boolean(customSection.namedLists?.length);
default:
return false;
</file context>
Suggested change
| return Boolean(customSection.namedLists?.length); | |
| return Boolean( | |
| customSection.namedLists?.some( | |
| (list) => list.label.trim() || list.items.some((item) => item.trim()) | |
| ) | |
| ); |
| "subsectionLabel": "Subsection", | ||
| "addSubsectionLabel": "Add Subsection", | ||
| "labelPlaceholder": "e.g., Technical Skills, Languages", | ||
| "itemsPlaceholder": "e.g., Python, React, TypeScript", |
Contributor
There was a problem hiding this comment.
P2: itemsPlaceholder implies comma-separated items, but the form parser splits only on newlines, creating misleading UX and potential single-item parsing errors.
Prompt for AI agents
Check if this issue is valid — if so, understand the root cause and fix it. At apps/frontend/messages/en.json, line 168:
<comment>`itemsPlaceholder` implies comma-separated items, but the form parser splits only on newlines, creating misleading UX and potential single-item parsing errors.</comment>
<file context>
@@ -159,6 +161,17 @@
+ "subsectionLabel": "Subsection",
+ "addSubsectionLabel": "Add Subsection",
+ "labelPlaceholder": "e.g., Technical Skills, Languages",
+ "itemsPlaceholder": "e.g., Python, React, TypeScript",
+ "fields": {
+ "label": "Label",
</file context>
Suggested change
| "itemsPlaceholder": "e.g., Python, React, TypeScript", | |
| "itemsPlaceholder": "e.g., Python\nReact\nTypeScript", |
| "genericLabeledListForm": { | ||
| "subsectionLabel": "サブセクション", | ||
| "addSubsectionLabel": "サブセクションを追加", | ||
| "labelPlaceholder": "例:技技能、言語", |
Contributor
There was a problem hiding this comment.
P3: Japanese localization typo in labelPlaceholder (技技能) introduces incorrect user-facing text.
Prompt for AI agents
Check if this issue is valid — if so, understand the root cause and fix it. At apps/frontend/messages/ja.json, line 167:
<comment>Japanese localization typo in `labelPlaceholder` (`技技能`) introduces incorrect user-facing text.</comment>
<file context>
@@ -159,6 +161,17 @@
+ "genericLabeledListForm": {
+ "subsectionLabel": "サブセクション",
+ "addSubsectionLabel": "サブセクションを追加",
+ "labelPlaceholder": "例:技技能、言語",
+ "itemsPlaceholder": "例:Python、React、TypeScript",
+ "fields": {
</file context>
Suggested change
| "labelPlaceholder": "例:技技能、言語", | |
| "labelPlaceholder": "例:技術スキル、言語", |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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
Currently, custom resume sections only allow users to enter a single block of text (e.g., "Skills: Python, React, Docker"). This limits how users can structure grouped content like "Technical Skills" vs "Soft Skills" or "English" vs "Spanish".
This PR adds a new Labeled Lists custom section type that lets users create multiple titled subsections, each containing a list of items. This enables more structured, professional presentations of grouped content.
What this PR does
labeledListssection type in the resume data model (backend validation and frontend types)GenericLabeledListForm) for creating, editing, removing, and reordering subsectionsType
Proposed Changes
Backend (Python/Pydantic):
LabeledListItemmodel withid,label, anditemsfieldsSectionTypeenum to includeLABELED_LISTS = "labeledLists"CustomSectionmodel withnamedListsfield (optional list of LabeledListItem)Frontend (TypeScript/React):
SectionTypeunion type to include'labeledLists'LabeledListItemTypeScript interface matching backend schemaGenericLabeledListFormcomponent with:resume-form.tsxto use the form for labeled list sectionsadd-section-dialog.tsxwith description and iconResume Rendering (All 4 Templates):
LabeledListSectionContenthelper component for consistent renderingDynamicResumeSection(shared by all templates)Internationalization:
builder.genericLabeledListFormtranslation keys in all 5 language filesDocumentation:
docs/agent/features/custom-sections.mdwith labeled lists section type overviewScreenshots / Code Snippets (if applicable)
Before (Original Behavior)
Custom sections only allow single text input:
After (With Labeled Lists)
Users can now create structured subsections:
Data Format (JSON)
{ "sectionType": "labeledLists", "namedLists": [ { "id": 1, "label": "Technical Skills", "items": ["Python", "React", "TypeScript"] }, { "id": 2, "label": "Languages", "items": ["English", "Spanish", "French"] } ] }How to Test
Create a custom section with labeled lists:
/builder)Add subsections:
Edit subsections:
Reorder subsections:
Delete subsections:
Save and reload:
Test i18n:
Test rendering across all templates:
Test edge cases:
Checklist
Additional Information
Type Safety and Validation:
i18n Completeness:
Code Quality:
Summary by cubic
Adds a new Labeled Lists custom section type to group items under labeled subsections (e.g., Technical Skills, Languages) with a clean two-column render across all templates. Includes full editor support, backend schema/validation, i18n, and docs.
New Features
LABELED_LISTStoSectionType,LabeledListItemmodel, andCustomSection.namedListswith normalization and auto ID assignment.GenericLabeledListFormwith add/remove/reorder, label input, and newline-based items; integrated into add-section dialog and form routing.Migration
Written for commit 8b0e2b0. Summary will update on new commits.