Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore(console): multiple scopes with fix for app deletion #2370

Merged
merged 4 commits into from
Jun 8, 2023

Conversation

poolsar42
Copy link
Collaborator

@poolsar42 poolsar42 commented Jun 6, 2023

Description

Modifies list of allowed scopes to display it properly when there're too many selected

And also It doesn't save app detail in auth page in console when opening delete app dialog

Related Issues

Testing

Locally in console and with storybook

Checklist

  • I have read the CONTRIBUTING guidelines
  • I have tested my code (manually and/or automated if applicable)
  • I have updated the documentation (if necessary)

@poolsar42 poolsar42 self-assigned this Jun 6, 2023
@poolsar42 poolsar42 marked this pull request as draft June 6, 2023 16:29
@poolsar42 poolsar42 changed the title fix(console): Toast toggled when invoking app deletion chore(console): multiple scopes with fix for app deletion Jun 6, 2023
@poolsar42 poolsar42 force-pushed the fix/2360-console-toast-when-delete-app-dialog branch from 63bb0a9 to 539d4df Compare June 6, 2023 22:10
@poolsar42 poolsar42 marked this pull request as ready for review June 6, 2023 22:10
@@ -467,7 +467,7 @@ export default function AppDetailIndexPage() {
experimental: value.experimental,
}
})}
selectedItems={appDetails.app.scopes?.map((scope) => {
preselectedItems={appDetails.app.scopes?.map((scope) => {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Type-checker doesn't like this.

disabled?: boolean
onChange?: () => void
learnMore?: string
}

const ComboboxItem = ({ item, selected }) => {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Depending on the width of field at the point the page is rendered, different issues arise. In general, the size of the dropdown contorl and the pills contained within, don't adjust relative to the surroundings.

  1. When starting on regular desktop width, and decreasing the width of the window we see the field width doesn't resize as other input fields do.
image
  1. When going into mobile view, the whole viewport remains stretched relative to the fixed size of the dropdown input field.
image
  1. When refreshing page on a narrow desktop view, or mobile view, we see scope pills overlapping with the chevron of the dropdown control itself
image

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you for detailed review. I didn't think properly of resizing the window size during one session

For this reason I've added ResizeObserver to constantly scan the size of this dropdown and properly adjust panels.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@poolsar42 poolsar42 force-pushed the fix/2360-console-toast-when-delete-app-dialog branch from 539d4df to fbd4bf2 Compare June 7, 2023 18:11
@betimshahini betimshahini merged commit d9bccb7 into main Jun 8, 2023
@betimshahini betimshahini deleted the fix/2360-console-toast-when-delete-app-dialog branch June 8, 2023 07:47
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
2 participants