Protected packages: CRUD protection rules in project setting ui

• This issue is part of the epic Identify packages as protected to prevent accid... (&5574)
• This issue focusses on the UX/UI for the project settings section related to protecting packages.
• We can use the implemented GraphQL API

Proposal

We propose to use the same behavior UX and UI known from the features Protected Branches and Protected Tags.

NOTE: To avoid additional complexity at the start, we propose to focus just on package names for the beginning and disregard package version.

Checklist / Implementation plan

• Discuss proposal and possible designs
• Implement list of package protection rules, see Protected packages: Show protection rules in pr... (!140008 - merged)
• Implement pagination for the list of package protection rules, see Protected packages: Paginate protection rules i... (!140738 - merged)
• Implement possibility to create package protection rules in project settings, see Protected packages: Create package protection r... (!140473 - merged)
• Implement possibility to update package protection rules in project settings, see Protected packages: Update protection rules in ... (!141792 - merged)
• Implement possibility to delete package protection rules in project settings, see Protected packages: Delete protection rule in p... (!140483 - merged)
• Align letter casing across the table columns and form fields for the attributes package type and push protected up to access level => Protected packages: Use capitalized casing in s... (!144076 - merged)
• Add help text for users regarding package name and wildcards => !152221 (merged)
• Optional: Enhance list of package protection rule, e.g. sortable table, paginatable table, etc.
• Add label "protected" in the overview list of package registries as mentioned in #413641 (comment 1708536668) .
• Show label "protected" in package detail page as mentioned in #413641 (comment 1721463314) .
• Change form fields and table headers to “Name pattern”, “Type”, and “Allowed to push” (as suggested in !140738 (comment 1750010075)) => see !148704 (merged)
• Refactor the naming of methods and variables in the file app/assets/javascripts/packages_and_registries/settings/project/components/packages_protection_rules.vue => see Draft: Protected packages: Align code across in... (!146399)
• Apply the feedback and patch from @annabeldunstone regarding the package protection rule overview table => Protected packages + containers: Adjust style a... (!148704 - merged)
• Add icon with number of protected packages based on the feedback from @annabeldunstone => Draft: Protected packages + containers: Add cou... (!148699)