Skip to content

Update environment-routes.component.html#1793

Open
sugita-mf wants to merge 5 commits intomockoon:mainfrom
sugita-mf:patch-1
Open

Update environment-routes.component.html#1793
sugita-mf wants to merge 5 commits intomockoon:mainfrom
sugita-mf:patch-1

Conversation

@sugita-mf
Copy link

@sugita-mf sugita-mf commented Jul 1, 2025

Technical implementation details
Added a flag icon indicator next to the response dropdown button that shows the current default response status. The implementation:
Uses existing setDefaultRouteResponse function for consistency
Follows the same styling pattern as dropdown menu flags (text-primary for default, text-muted for non-default)
Only displays for HTTP and WebSocket routes with responses
Maintains existing flag icons inside dropdown menu
Uses ngbTooltip for user guidance
Responsive design with proper spacing (ms-2)

Checklist
[x] data migration added (@mockoon/commons) - Not needed, no data structure changes
[x] commons lib tests added (@mockoon/commons) - Not needed, no commons changes
[x] commons-server lib tests added (@mockoon/commons-server) - Not needed, no server changes
[x] CLI tests added (@mockoon/cli) - Not needed, no CLI changes
[x] desktop UI automated tests added (@mockoon/app) - Should be added for UI interaction

Note: Most checklist items are not applicable as this is a UI-only change that doesn't affect data structures, server logic, or CLI functionality. Only desktop UI tests would be relevant.
Closes #1792

feat: add default response flag indicator next to dropdown
@sugita-mf sugita-mf requested a review from 255kb as a code owner July 1, 2025 07:44
@sugita-mf
Copy link
Author

#1792

@sugita-mf
Copy link
Author

I did them for fixing CI's error.

cd packages/app && npx prettier src/renderer/app/components/environment-routes/environment-routes.component.html --write
npx prettier "src/**/*.{ts,js,scss,html}" "test/**/*.{ts,js,scss,html}" --no-error-on-unmatched-pattern --check

@255kb

I have fixed the Prettier formatting issue in environment-routes.component.html on the patch-1 branch and pushed the changes to my fork.
Could you please review and confirm the changes?
Thank you!

@255kb
Copy link
Member

255kb commented Jul 8, 2025

I didn't test your PR yet, but I would say adding the flag indicator on the dropdown button could make sense.
Could you add screenshots to see how it looks?

From the top of my mind:

  • I would rather see this flag inside the button for consistency. From the code it seems you put it outside:

image

  • The flag you added is interactable but I don't think it makes sense as interacting from there wouldn't let you choose another response as the default. I think it's better to add it as a non clickable indicator only.

@sugita-mf
Copy link
Author

sugita-mf commented Jul 9, 2025

@255kb

Could you add screenshots to see how it looks?

スクリーンショット 2025-07-09 14 33 33

@sugita-mf
Copy link
Author

@255kb
I fixed here af2acce
スクリーンショット 2025-07-09 16 57 06

@255kb
Copy link
Member

255kb commented Jul 29, 2025

Thanks for the changes.

However, we need to keep the same design:

  • blue full flag when route is the default one
  • grey full flag when route is the default one, but a response mode is disabling the rules (random, sequential, etc.)
  • grey outlined flag when route is not the default one

I guess the easiest way to achieve this is to create an ng-template out of this part of the code (to avoid duplication).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Feature Request - Add default response flag indicator next to dropdown

2 participants