feat(experience): add role progression to show career advancement within a company (#2761)

* feat(experience): add role progression support for career advancement

* fix(experience): remove indent and border from role progression items

* refactor(experience): enhance role progression UI and functionality

- Updated the ExperienceItem component to improve role display and styling.
- Refactored the CreateExperienceDialog and UpdateExperienceDialog to support role reordering using drag-and-drop.
- Added role handling in JSON and ReactiveResume importers.
- Enhanced experience schema to include roles, ensuring better data structure for career progression.
- Improved overall user experience with clearer role management in the experience section.

---------

Co-authored-by: root <root@reactive-resume-dev.one.one.one.one>
Co-authored-by: Amruth Pillai <im.amruth@gmail.com>

src/schema/resume/data.ts

@@ -131,13 +131,34 @@ export const educationItemSchema = baseItemSchema.extend({
 	description: z.string().describe("The description of the education. This should be a HTML-formatted string."),
 });
 
+export const roleItemSchema = z.object({
+	id: z.string().describe("The unique identifier for the role. Usually generated as a UUID."),
+	position: z.string().describe("The position or job title for this role."),
+	period: z.string().describe("The period of time this role was held."),
+	description: z.string().describe("The description of this specific role. This should be a HTML-formatted string."),
+});
+
+export type RoleItem = z.infer<typeof roleItemSchema>;
+
 export const experienceItemSchema = baseItemSchema.extend({
 	company: z.string().min(1).describe("The name of the company or organization."),
-	position: z.string().describe("The position held at the company or organization."),
+	position: z
+		.string()
+		.describe(
+			"The position held at the company or organization. Used when there is only a single role. If multiple roles are provided in the 'roles' field, this serves as a summary title or can be left blank.",
+		),
 	location: z.string().describe("The location of the company or organization."),
-	period: z.string().describe("The period of time the author was employed at the company or organization."),
+	period: z
+		.string()
+		.describe(
+			"The overall period of time at the company. When multiple roles are used, this should reflect the total tenure.",
+		),
 	website: urlSchema.describe("The website of the company or organization, if any."),
 	description: z.string().describe("The description of the experience. This should be a HTML-formatted string."),
+	roles: z
+		.array(roleItemSchema)
+		.catch([])
+		.describe("Optional list of individual roles held at this company to show career progression."),
 });
 
 export const interestItemSchema = baseItemSchema.extend({

src/schema/resume/sample.ts

@@ -91,6 +91,7 @@ export const sampleResumeData: ResumeData = {
 						url: "",
 						label: "",
 					},
+					roles: [],
 					description:
 						"<ul><li><p>Lead gameplay programmer on an unannounced AAA action-adventure title built in Unreal Engine 5 for PC and next-gen consoles</p></li><li><p>Architected and implemented core combat system including hit detection, combo mechanics, and enemy AI behavior trees serving 15+ enemy types</p></li><li><p>Developed custom editor tools in C++ that reduced level designer iteration time by 40% and improved workflow efficiency across the team</p></li><li><p>Optimized rendering pipeline and gameplay systems to maintain 60 FPS performance target on all supported platforms, achieving 95% frame rate stability</p></li><li><p>Ad nostrud enim adipisicing ea proident aliqua veniam nisi amet ea irure et mollit.</p></li></ul><p></p>",
 				},
@@ -449,6 +450,7 @@ export const sampleResumeData: ResumeData = {
 						url: "",
 						label: "",
 					},
+					roles: [],
 					description:
 						"<ul><li>Core developer on 'Starbound Odyssey,' a sci-fi roguelike that achieved 500K+ sales on Steam with 'Very Positive' user reviews</li><li>Implemented procedural generation systems for level layouts, enemy encounters, and loot drops using Unity and C#</li><li>Designed and programmed player progression systems including skill trees, equipment upgrades, and meta-progression mechanics</li><li>Created robust save/load system supporting cloud saves and cross-platform play between PC and Nintendo Switch</li><li>Integrated third-party SDKs for analytics (GameAnalytics), achievements (Steamworks), and multiplayer networking (Photon)</li><li>Fixed critical bugs and balanced gameplay based on community feedback and telemetry data, releasing 12 post-launch content updates</li><li>Worked closely with artists to implement VFX, animations, and shaders that enhanced visual polish while maintaining performance targets</li></ul>",
 				},
@@ -463,6 +465,7 @@ export const sampleResumeData: ResumeData = {
 						url: "",
 						label: "",
 					},
+					roles: [],
 					description:
 						"<ul><li><p>Contributed to development of three mobile puzzle games built in Unity, collectively downloaded 2M+ times on iOS and Android</p></li><li><p>Implemented UI systems, touch controls, and gesture recognition optimized for mobile devices and various screen sizes</p></li><li><p>Developed monetization features including rewarded video ads, in-app purchases, and daily reward systems that increased retention by 25%</p></li><li><p>Optimized memory usage and load times for mobile platforms, reducing app size by 35% through asset compression and code optimization</p></li><li><p>Collaborated with game designers to balance puzzle difficulty curves and progression pacing using A/B testing data</p></li></ul><p></p>",
 				},