Refactor self-role management to use a role builder interface

- Replaced the text area for role input with a structured role builder, enhancing user experience and reducing input errors.
- Updated the self-role management logic to handle roles as structured objects instead of plain text, improving data integrity.
- Introduced new functions for parsing and validating roles, ensuring compliance with the new builder format.
- Enhanced error handling for role creation and updates, providing clearer feedback for missing or invalid data.
- Updated localization files to reflect changes in role management terminology and instructions.

apps/webui/src/messages/en.json

@@ -736,8 +736,19 @@
       },
       "description": "Description",
       "roles": "Roles",
-      "rolesPlaceholder": "roleId | label | emoji | description (one per line)",
-      "rolesHint": "One role per line: roleId | label | emoji (optional) | description (optional).",
+      "roleSelect": "Role",
+      "roleLabel": "Label",
+      "roleLabelPlaceholder": "Button display name",
+      "roleEmoji": "Emoji",
+      "roleDescription": "Description (optional)",
+      "roleDescriptionPlaceholder": "Short text for dropdown",
+      "addRole": "Add role",
+      "emojiPlaceholder": "Search emoji…",
+      "emojiServer": "Server",
+      "emojiUnicode": "Standard",
+      "emojiRequired": "Reaction mode requires an emoji for every role.",
+      "tooManyRoles": "Maximum 25 roles per panel.",
+      "rolesBuilderHint": "Pick a role, label, and optional emoji/description. Reaction mode requires an emoji.",
       "create": "Create panel",
       "listTitle": "Self-role panels",
       "listDescription": "Existing panels for this server.",