[CI-4339] Fix Sort Component Rendering to Inputs with the Same Id

[Mudaafi]

Fix Description

Fixes a bug where two inputs were rendered with the same id for Sort Options. While the Desktop sort options are set to display: none, we are still rendering the elements to the DOM. This leads to weird behaviors on mobile due to invalid DOM structure.

To fix this, rather than attempting to use JavaScript to determine when the css screen breakpoints are reached, we keep the existing behavior, but just render the inputs with different ids.

Pull Request Checklist

Before you submit a pull request, please make sure you have to following:

• I have added or updated TypeScript types for my changes, ensuring they are compatible with the existing codebase.
• I have added JSDoc comments to my TypeScript definitions for improved documentation.
• I have added tests that prove my fix is effective or that my feature works.
• I have added any necessary documentation (if appropriate).
• I have made sure my PR is up-to-date with the main branch.

PR Type

What kind of change does this PR introduce?

• Bugfix
• Feature
• Code style update (formatting, local variables)
• Refactoring (no functional changes, no API changes)
• Documentation content changes
• TypeScript type definitions update
• Other... Please describe:

[jjl014]

The changes look good to me! 👍