refactor(ui): extracted formatting utilities to separate module #370
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
There was a problem hiding this comment.
Pull Request Overview
This PR refactors UI formatting utilities by extracting them into a separate module, making the formatting logic more modular and reusable.
- Extract formatting functions (for number, duration, and date formatting) into a new module (formatutils.js).
- Update imports throughout the codebase to reference the new module for formatting functions while retaining error handling functions in uiutil.jsx.
Reviewed Changes
Copilot reviewed 12 out of 12 changed files in this pull request and generated 1 comment.
Show a summary per file
| File | Description |
|---|---|
| src/utils/uiutil.jsx | Removed various formatting functions; retained error handling utilities (redirect, etc.). |
| src/utils/taskutil.jsx | Updated import for formatDuration to use the new module. |
| src/utils/formatutils.js | New module containing formatting utilities (sizeDisplayName, parseQuery, etc.). |
| src/pages/Task.jsx | Updated imports to reference formatDuration and sizeDisplayName from formatutils.js. |
| src/pages/Snapshots.jsx | Updated imports for formatting functions (e.g. ownerName → formatOwnerName) appropriately. |
| src/pages/SnapshotHistory.jsx | Adjusted imports to use formatutils.js for several formatting functions. |
| src/pages/Policy.jsx | Updated parseQuery import to reference the new module. |
| src/pages/Policies.jsx | Refactored owner name formatting to use the new formatOwnerName function from formatutils.js. |
| src/components/SnapshotEstimation.jsx | Adjusted imports to use sizeDisplayName from formatutils.js. |
| src/components/DirectoryItems.jsx | Updated imports for objectLink and rfc3339TimestampForDisplay to the new module. |
Comments suppressed due to low confidence (1)
src/utils/uiutil.jsx:1
- [nitpick] Now that formatting functions have been extracted to formatutils.js, consider reviewing the module boundaries. If uiutil.jsx only handles error-related utilities (such as redirect and errorAlert), it may improve clarity to further separate error handling from general UI utilities.
import { faExclamationTriangle } from "@fortawesome/free-solid-svg-icons";
| import { handleChange } from "../forms"; | ||
| import KopiaTable from "../components/KopiaTable"; | ||
| import { compare, errorAlert, ownerName, redirect, sizeDisplayName, sizeWithFailures } from "../utils/uiutil"; | ||
| import { compare, formatOwnerName, sizeDisplayName } from "../utils/formatutils"; |
There was a problem hiding this comment.
[nitpick] With the refactoring, formatting functions are now split between formatutils.js and uiutil.jsx. For consistency and clarity, consider grouping all formatting utilities together if they share similar usage contexts.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
No description provided.