Pulling fix/display-states into develop #649
Merged
Conversation
This file contains 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
![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?s=60&v=4){kind=small}
|
Important Auto Review SkippedBot user detected. To trigger a single review, invoke the Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (invoked as PR comments)
Additionally, you can add CodeRabbit Configration File (
|
ktun95
force-pushed
the
fix/display-states
branch
from
fb7df0a to
e6aa653
Compare
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## develop #649 +/- ##
===========================================
+ Coverage 94.68% 94.69% +0.01%
===========================================
Files 186 188 +2
Lines 14034 14072 +38
Branches 488 491 +3
===========================================
+ Hits 13288 13326 +38
Misses 746 746
|
…ble and setLoading function call The loading state variable and setLoading function call were unnecessary as they were not being used. Removing them simplifies the code and improves readability.
… check for authorization The cases in the conditionalRouting function have been reordered to to prioritize check for authorization. So if the user is already authorized, it will disregard any subsequent loading states.
…prop type to accept number or string The import statement for the unused `Box` component has been removed to clean up the code. The `height` prop of the `LoadingDisplay` component has been updated to accept either a number or a string, providing more flexibility in specifying the height of each loading skeleton.
…ding indicators The EditableLoader component is added to display loading indicators in the UI. It uses the LoadingDisplay component to render multiple loading indicators with different configurations. This component will be used to indicate loading states in editable pages.
…of the EditableLoader component The EditableLoader component now has a TSDoc comment that provides a brief description of its purpose. This improves code documentation and makes it easier for other developers to understand the intended use of the component.
…laying loading state in editable content pages The EditableContentLoadingDisplay component is added to the ui-common package. This component is intended for use in editable content pages to display a loading state. It consists of multiple instances of the LoadingDisplay component with different configurations to visually represent the loading state of different sections of the page.
The EditableContentLoadingDisplay component was added to the exports in the index.ts file of the ui-common package. This allows other modules to import and use the EditableContentLoadingDisplay component.
…tLoadingDisplay component for consistency and better user experience The usage of the Loader component has been replaced with the EditableContentLoadingDisplay component to ensure consistency and improve the user experience when loading editable content.
…LoadingDisplay component for consistency and better user experience The Editable.tsx file has been refactored to import the EditableContentLoadingDisplay component from the "@dictybase/ui-common" library. This component is now used instead of the previously imported Loader component for displaying a loading state. Additionally, some unused imports have been removed to clean up the code. This change improves the consistency and user experience of the Editable feature.
…isplay component from @dictybase/ui-common package The code has been refactored to remove unused variables and imports, making the code cleaner and more maintainable. The Loader component has been replaced with the EditableContentLoadingDisplay component from the @dictybase/ui-common package, which provides a more consistent and standardized loading display for editable content. Closes #648
- Import `EditableContentLoadingDisplay` from `@dictybase/ui-common` and remove unused import `Loader` - Remove unused variables `gqlLoading` and `logToLoading` - Replace `<Loader />` with `<EditableContentLoadingDisplay />` when `loading` is true - Simplify pattern matching for `data` object in `useContentBySlugQuery` hook - Remove unnecessary condition for `hasNotFoundError` check in `when` block The changes were made to improve code readability and remove unused code. The `EditableContentLoadingDisplay` component is now used instead of the `Loader` component for displaying loading state. The destructuring of hooks and variables has been simplified for better code organization. The condition for `hasNotFoundError` check in the `when` block has been simplified. Closes #648
…c to ACCESS.private to restrict access to the NotFoundErrorAuth component The access variable is now set to ACCESS.private instead of ACCESS.public. This change restricts access to the NotFoundErrorAuth component, ensuring that only authenticated users with the "content-admin" role can access it.
…nd match statement The isLoading variable and the match statement are no longer needed as the useAuthorization hook now directly returns the isAuthorized value. This simplifies the code and improves readability.
…nd match statement The isLoading variable and the match statement are no longer needed as the useAuthorization hook no longer returns an isLoading property. The code has been simplified to directly use the isAuthorized property to determine whether to display the authorized or unauthorized Navbar component.
…o enable cache-and-network fetching The fetchPolicy option is added to the useContentBySlugQuery hook with the value "cache-and-network". This allows the query to fetch data from both the cache and the network, improving the user experience by providing the most up-to-date data while still utilizing the cache when available.
…to be rendered before EditableView component for better user experience The Editable component now renders the EditableContentLoadingDisplay component before the EditableView component. This change improves the user experience by displaying skipping the loading display when the content is already present.
Even if content data is being fetched, if there is already data present, the data will be rendered. This creates a more seamless user experience.
…e rendered before ContentView component for better readability and maintainability The EditableContentLoadingDisplay component is now rendered before the ContentView component in the match function, improving the readability and maintainability of the code.
The new file EditableView.test.tsx contains unit tests for the EditableView component. The first test checks if the content data is rendered correctly. It uses the createMemoryRouter function from react-router-dom to set up the router and render the component. The test asserts that the content text is present in the rendered output. The second test checks if an Edit button is rendered and if clicking on it navigates to the ../edit subpath. It uses the userEvent library to simulate a click on the Edit button. The test asserts that the "edit route" text is present in the rendered output after clicking the button.
The new unit test verifies that the EditButton component renders an "Edit" button and that clicking on it navigates to the "/edit" subpath. This test ensures that the EditButton behaves correctly and allows users to navigate to the appropriate route for editing.
…ugData object in mocks The contentBySlugData object in the mocks now includes the created_at field with a timestamp and the created_by field with user information. This allows for more comprehensive and realistic data in the content mock.
Removed dynamic key generation for Header items to prevent unnecessary rerendering.
Removed dynamic key generation for Logo items to prevent unnecessary rerendering.
…er public routes only The publicRoutes function was updated to correctly filter routes based on the access level. Now, only routes with ACCESS.public are included in the resulting array, ensuring that only public routes are returned as intended.
ktun95
force-pushed
the
fix/display-states
branch
from
b87679f to
5f6fd09
Compare
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.