-
-
Notifications
You must be signed in to change notification settings - Fork 516
Next: October feedback #2013
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
Next: October feedback #2013
Conversation
Replaces the custom loading component with the new spinner component. This change ensures consistent styling and improves maintainability by utilizing the new UI spinner component across the application.
Implements input group components with addon, button, input, text, and textarea variations. This provides a flexible and consistent way to group related input elements with prefixes, suffixes, and buttons.
Adds a new Button Group UI component with associated text and separator elements. This component provides a flexible and visually appealing way to group related buttons or actions, enhancing the user interface and experience. The button group supports horizontal and vertical orientations via tailwind variants.
Updates the search input component to use the InputGroup component instead of the Input component. This change improves the structure and styling of the search input field.
Wraps the stack status and options dropdowns in a button group for better visual organization. Changes the stack options button variant to "outline" for improved appearance.
Introduces `Kbd` and `KbdGroup` components for displaying keyboard shortcuts, enhancing the user interface and providing a more intuitive user experience. Replaces direct usage of `` in the navbar with the new `Kbd.Root` component for improved consistency and styling.
Ensures route parameters, specifically organizationId and projectId, are reactive by utilizing `$derived` from Svelte. This change allows components to automatically react to changes in the route parameters, ensuring that the UI stays in sync with the current route. This fixes an issue where changes to the route parameters were not always reflected in the component's state.
Replaces the streaming indicator button with a refresh button on the events and issues pages. This change removes the manual pause functionality and instead provides a refresh button that allows users to manually reload the data. The refresh button is disabled when rows are selected or the current page is not the first page. The button also indicates when the data is loading. This change aims to provide a more intuitive and user-friendly way to refresh data in the application.
Ensures that the date filter is persisted when clearing all filters, providing a consistent time range for event queries. Removes FacetedFilter.Actions from the DateFacetedFilter component and updates the filter removal logic to preserve the date filter. This change ensures that the default time range is always applied when the user clears all other filters. This helps to improve the user experience by ensuring they always see events from the last week by default.
Implements a stack events chart on the stack card to visualize event occurrences over the last 7 days. This provides users with a quick overview of recent event activity related to a specific stack. It includes handling for empty data sets and uses a skeleton loader while data is loading. The changes also include a minor fix to faceted filter builder for date filters.
Removes the `filterRemoved` prop and associated `handleRemove` function from the date faceted filter component. This change streamlines the component's interface by removing unused functionality, which will increase the efficiency of the component for the October feedback tasks.
Adds a "Last 7 days" label above the event chart in the stack card to provide context to the displayed data. This clarifies the time period represented by the chart, improving the user's understanding of recent event activity.
Refactors the data table footer to improve responsiveness across different screen sizes by utilizing a grid layout and adjusting the visibility of elements. Also, it addresses layout issues with selection counts in the table footer, displaying the number of selected rows more concisely.
Updates several dependencies in package.json, including bits-ui, dompurify, @sveltejs/kit, @types/node, and typescript-eslint. These updates likely include bug fixes, performance improvements, and new features from the updated libraries.
Refactors data table components to enhance responsiveness and visual consistency. This includes adjustments to footer layouts, page count display, and toolbar structure to better adapt to different screen sizes. It also ensures a more streamlined and user-friendly experience across various devices.
Increases the Microsoft Extensions, OpenTelemetry, jsdom, eslint, storybook, svelte, sveltekit-superforms, bits-ui, and other package versions to the latest stable releases. This upgrade resolves potential security vulnerabilities and incorporates new features and performance improvements from the updated libraries.
Ensures charts always display a minimum yDomain to prevent them from appearing empty when there is no data, improving the user experience.
Ensures the extended data display correctly reflects user-defined filters by applying the excluded keys to the filtered data, not the transformed data. This prevents users from seeing filtered out data.
Slightly increases the padding at the top of the sidebar group to improve the visual appearance. This change addresses feedback received regarding the spacing and layout of elements within the sidebar.
Refines the stack card's layout for improved readability and visual appeal. Reduces spacing and adjusts grid layouts within the card content. Replaces badges with a simpler tag display.
Removes hover effect that shows filter trigger icon in event views. This change simplifies the UI and improves usability. Also, the additional data section for request and environment components have been updated.
Updates chart components to ensure that the Y axis domain always includes at least a minimum value of 1, preventing empty charts when data values are very low or zero.
This change adds the ability to navigate to a specific URL when a row in a data table is clicked. The `rowHref` prop is added to the `DataTable.Body` component, allowing a URL to be specified for each row. When a row is clicked, the browser will navigate to the specified URL. Also adds default toolbar component to project and organization tables
Refactors the events and issues pages to use a flexbox layout with gap for better spacing and responsiveness. Adds a view options component to the projects page for improved user control over the data table display.
Refactors data table components to streamline toolbar rendering. Removes unnecessary props and consolidates conditional rendering for a cleaner and more maintainable implementation.
Improves user experience by adding direct links from event and stack summaries to the corresponding event or stack details page, allowing users to quickly navigate to more detailed information.
Replaces the pulsating circle indicator with a pause icon when streaming is active. This provides a more visually clear and standard way to represent the active streaming state.
Improves the visual appearance of event tags within the event overview. This change removes the badge component and streamlines the tag display by directly integrating the filter trigger with the tag text. This results in a cleaner and more intuitive user experience when interacting with event tags.
Updates faceted filter triggers to use buttons instead of links for improved accessibility and consistency with the UI. The change replaces the <A> component with the <Button> component in the following files: - boolean-faceted-filter-trigger.svelte - date-faceted-filter-trigger.svelte - level-faceted-filter-trigger.svelte - number-faceted-filter-trigger.svelte - project-faceted-filter-trigger.svelte - reference-faceted-filter-trigger.svelte - session-faceted-filter-trigger.svelte - status-faceted-filter-trigger.svelte - string-faceted-filter-trigger.svelte - tag-faceted-filter-trigger.svelte - type-faceted-filter-trigger.svelte - version-faceted-filter-trigger.svelte
Updates various package dependencies to their latest versions to address potential bugs, improve performance, and ensure compatibility with other packages.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull Request Overview
This PR applies feedback from October, focusing on UI improvements, component refactoring, and dependency updates. The changes enhance user experience through better navigation, improved visual consistency, and updated package versions.
Reviewed Changes
Copilot reviewed 108 out of 109 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
| tests/Exceptionless.Tests/Exceptionless.Tests.csproj | Updated test dependency versions |
| src/Exceptionless.Web/Exceptionless.Web.csproj | Updated Microsoft and OpenTelemetry package versions |
| src/Exceptionless.Web/ClientApp/src/routes/status/+page.svelte | Replaced Loading with Spinner component |
| src/Exceptionless.Web/ClientApp/src/routes/(auth)/logout/+page.svelte | Replaced Loading with Spinner component |
| src/Exceptionless.Web/ClientApp/src/routes/(auth)/login/+page.svelte | Replaced Loading with Spinner component |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/stream/+page.svelte | Added rowHref, restructured toolbar layout |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/project/add/+page.svelte | Replaced Loading with Spinner component |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/project/[projectId]/settings/+page.svelte | Changed projectId to reactive derived value |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/project/[projectId]/manage/+page.svelte | Changed projectId to reactive derived value, replaced Loading with Spinner |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/project/[projectId]/integrations/+page.svelte | Changed projectId to reactive derived value |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/project/[projectId]/configure/+page.svelte | Changed projectId to reactive derived value |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/project/[projectId]/configuration-values/+page.svelte | Changed projectId to reactive derived value |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/project/[projectId]/api-keys/+page.svelte | Changed projectId to reactive derived value |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/project/[projectId]/+layout.svelte | Changed projectId to reactive derived value |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/organization/list/+page.svelte | Added rowHref for navigation |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/organization/add/+page.svelte | Replaced Loading with Spinner component |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/organization/[organizationId]/usage/+page.svelte | Added yDomain configuration for chart |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/organization/[organizationId]/projects/+page.svelte | Added rowHref and DataTableViewOptions |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/organization/[organizationId]/manage/+page.svelte | Changed organizationId to reactive derived value, replaced Loading with Spinner |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/organization/[organizationId]/+layout.svelte | Changed organizationId to reactive derived value, removed manual organization setting |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/issues/+page.svelte | Replaced streaming with refresh button, added rowHref, restructured layout |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/account/security/+page.svelte | Replaced Loading with Spinner component |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/+page.svelte | Replaced streaming with refresh button, added rowHref, restructured layout |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/(components)/layouts/sidebar.svelte | Adjusted sidebar padding |
| src/Exceptionless.Web/ClientApp/src/routes/(app)/(components)/layouts/navbar.svelte | Replaced DropdownMenu.Shortcut with Kbd component |
| src/Exceptionless.Web/ClientApp/src/lib/features/webhooks/components/table/webhooks-data-table.svelte | Fixed toolbar conditional rendering |
| src/Exceptionless.Web/ClientApp/src/lib/features/users/components/table/users-data-table.svelte | Fixed toolbar conditional rendering |
| src/Exceptionless.Web/ClientApp/src/lib/features/tokens/components/table/tokens-data-table.svelte | Fixed toolbar conditional rendering |
| src/Exceptionless.Web/ClientApp/src/lib/features/stacks/components/stack-options-dropdown-menu.svelte | Changed button variant from ghost to outline |
| src/Exceptionless.Web/ClientApp/src/lib/features/stacks/components/stack-card.svelte | Added 7-day chart, improved layout and styling |
| src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/ui/spinner/spinner.svelte | New Spinner component |
| src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/ui/kbd/* | New Kbd component for keyboard shortcuts |
| src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/ui/input-group/* | New InputGroup component for grouped inputs |
| src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/ui/button-group/* | New ButtonGroup component |
| src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/ui/card/card.svelte | Changed border-radius from lg to xl |
| src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/ui/button/button.svelte | Added icon-xs size variant |
| src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/streaming-indicator-button.svelte | Updated to use Pause icon instead of animated dot |
| src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/search-input.svelte | Migrated to use InputGroup component |
| src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/refresh-button.svelte | New RefreshButton component |
| src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/loading.svelte | Removed (replaced by Spinner) |
| src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/faceted-filter/* | Replaced Loading with Spinner, improved filter clearing logic |
| src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/data-table/* | Enhanced responsive layout, added rowHref support, improved footer layout |
| src/Exceptionless.Web/ClientApp/src/lib/features/projects/components/table/projects-data-table.svelte | Added rowHref support, fixed toolbar rendering |
| src/Exceptionless.Web/ClientApp/src/lib/features/organizations/components/table/organizations-data-table.svelte | Added rowHref support, fixed toolbar rendering |
| src/Exceptionless.Web/ClientApp/src/lib/features/events/components/views/* | Removed opacity transitions on filter triggers, improved layout |
| src/Exceptionless.Web/ClientApp/src/lib/features/events/components/table/events-data-table.svelte | Added rowHref support, improved footer layout |
| src/Exceptionless.Web/ClientApp/src/lib/features/events/components/summary/* | Added href attributes to links for better navigation |
| src/Exceptionless.Web/ClientApp/src/lib/features/events/components/filters/* | Converted filter triggers to Button components, improved accessibility |
| src/Exceptionless.Web/ClientApp/src/lib/features/events/components/events-stack-chart.svelte | New chart component for stack visualizations |
| src/Exceptionless.Web/ClientApp/src/lib/features/events/components/events-dashboard-chart.svelte | Replaced custom skeleton with Skeleton component, added yDomain |
| src/Exceptionless.Web/ClientApp/package.json | Updated frontend dependencies |
| src/Exceptionless.Job/Exceptionless.Job.csproj | Updated NuGet package versions |
| src/Exceptionless.Insulation/Exceptionless.Insulation.csproj | Updated NuGet package versions |
| src/Exceptionless.Core/Exceptionless.Core.csproj | Updated NuGet package versions |
...ptionless.Web/ClientApp/src/lib/features/shared/components/data-table/data-table-body.svelte
Show resolved
Hide resolved
...s.Web/ClientApp/src/lib/features/events/components/filters/tag-faceted-filter-trigger.svelte
Show resolved
Hide resolved
src/Exceptionless.Web/ClientApp/src/lib/features/events/components/extended-data-item.svelte
Show resolved
Hide resolved
src/Exceptionless.Web/ClientApp/src/lib/features/events/components/filters/helpers.svelte.ts
Outdated
Show resolved
Hide resolved
Improves the stream page by integrating data table view options, allowing users to customize the display of data within the stream. This enhancement provides a more personalized and efficient user experience.
ejsmith
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Lots of great progress. Nice work!
…ents/filters/helpers.svelte.ts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Updates event summary components to use the resolve function when generating links to individual events. This ensures that the links are correctly generated based on the application's routing configuration and prevents hardcoding URLs which can cause issues in different environments or when the routing configuration changes.
Simplifies data table row click handling to improve user experience by ensuring the row click event is always executed even when modifier keys are pressed. This allows users to trigger the intended row click action consistently.
Ensures that regular clicks on data table rows with href attributes do not trigger default navigation behavior. This allows the row click handler to be executed without unexpected page transitions.
Updates the layout to improve spacing and prevent overflow issues. - Adds spacing to the data table column header for better visual appeal. - Removes the horizontal overflow from the split layout content. - Adds vertical overflow to the main app layout.
The page count now displays at least "1" even when there are no items in the table, preventing a display of "Page 1 of 0".
Reduces the gap size in the event filter area to improve the layout and spacing, particularly on smaller screens. The previous gap size was slightly too large, causing elements to wrap prematurely.
No description provided.