Fix/rearrange layout #427
Merged
Fix/rearrange layout #427
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
gweiying
force-pushed
the
fix/rearrange-layout
branch
2 times, most recently
from
3edf305
to
a217464
Compare
alexanderleegs
requested changes
Apr 27, 2021
alexanderleegs
pushed a commit
that referenced
this pull request
Apr 29, 2021
* fix: simplify directoryFile utils for retrieve and update * fix: update methods using directoryFile utils * fix: introduce FolderReorderingModal * fix: refactors FolderContent * fix: update params for FolderContentItem * fix: fix breadcrumb display * fix: add propTypes for FolderReorderingModal * fix: add Cancel button to FolderReorderingModal * fix: updates draggable-id for React dnd * fix: updates dropdown button behavior for reordering * fix: updates copy text * fix: updates copy text * fix: updates variable naming for directory file output
gweiying
added a commit
that referenced
this pull request
Apr 30, 2021
* Add linting and formatting tools (#378) * fix: outdated packages with vulnerabilities * feat: install eslint and initiate config * feat: install prettier and set prettier options * feat: install eslint-config-prettier * feat: install eslint-plugin-prettier * chore: reformat eslint config * feat: add @trivago/prettier-plugin-sort-imports, define preferred import order * fix: css-loader file resolution bug introduced by CRA v4 In recent commits, we upgraded our react-scripts version from 3.4.4 to 4.0.3. This is because CRA (create-react-app) v3 uses an outdated version of eslint (facebook/create-react-app#8849). This introduced a bug related to the css-loader library, which can no longer resolve assets in the public folder: - facebook/create-react-app#9870 (comment) - webpack-contrib/css-loader#1136 (comment) This commit fixes this bug by moving the referenced image to the relevant sub-directory in the src directory. * chore: temporarily disable eslint * chore: add more files and folders to .prettierignore * chore: upgrade prettier-plugin-sort-imports to 2.0.2 fixes trivago/prettier-plugin-sort-imports#22 * chore: temporarily disable prettier * chore: remove prettier config temporarily * chore: remove jsx-a11y references temporarily * temporarily remove import/prefer-default-export reference Co-authored-by: jiehao <jiehao@open.gov.sg> Co-authored-by: Preston Lim <prestonlimlianjie@gmail.com> * Fix/resource color (#430) * fix: resource page header changed to bg-secondary * fix: using isResourcePage to determine page header * Fix/rearrange layout (#427) * fix: simplify directoryFile utils for retrieve and update * fix: update methods using directoryFile utils * fix: introduce FolderReorderingModal * fix: refactors FolderContent * fix: update params for FolderContentItem * fix: fix breadcrumb display * fix: add propTypes for FolderReorderingModal * fix: add Cancel button to FolderReorderingModal * fix: updates draggable-id for React dnd * fix: updates dropdown button behavior for reordering * fix: updates copy text * fix: updates copy text * fix: updates variable naming for directory file output * refactor: clean up ProtectedRoute and LoginContext (#431) * refactor: clean up ProtectedRoute and LoginContext * refactor: make LoginContext testable create 3 exports: LoginContext itself, LoginProvider, LoginConsumer * refactor: make route selector testable in App.jsx * refactor: group routing components * feat: add basic routing tests * refactor: move __tests__ folder to correct place Required for jest to find the test files * style: delete unnecessary div * refactor: make exports more obvious for LoginContext.js * refactor: delete duplicate route * chore: add rest of routing tests * style: remove unused declarations * Fix/fine-tune react-query settings (#389) * fix: turn off refetching on window focus for useQuery This commit sets the `refetchOnWindowFocus` flag for the useQuery on the following layouts/components to be `false`: - PageSettingsModal - EditNavBar - EditPage The reason we turn off this flag is because these pages involve user changes - with this flag on, any unsaved changes by the user would be overwritten by the refetched data. This commit also sets the - `refetchOnReconnect` - `refetchInterval` - `refetchIntervalInBackground` flags to be false for the same reasons explained above. * fix: invalidate queries after mutation This commit adds cache invalidation of all our GET queries (the useQuery invocations) after we perform a mutation. This allows us to reset our cache in a more granular manner, as opposed to simply setting the cache time for our GET queries to be 0. Additionally, this commit also adds a PAGE_SETTINGS_KEY constant to replace the string literal that was being used as the query key for the PageSettingsModal. Refer to the following documentation for more details: - https://react-query.tanstack.com/guides/query-invalidation - https://react-query.tanstack.com/guides/invalidations-from-mutations * feat: standardize output of GET API calls to return resp.data This commit standardizes the output of our GET API functions to return resp.data instead of just the response from the api call. resp.data is a better choice as we are able to use that in dependency arrays, whereas the resp object pointer always changes, which will trigger the useEffect every time even if the object data hasn't actually changed. * fix: load yaml content when reading directory file * feat: disable useQuery if component tracks local state As per our discussion (refer to meeting minutes here: https://docs.google.com/document/d/1br6T6wVX0KrcA3nwQEo7OhUrcT4veLnaz0vByEXjVvo/edit#heading=h.hyx8t36v9z3n) we will be discussing our `useQuery` functions if there are changes to the local state that are being tracked, to avoid refetching behavior from overwriting local changes. * fix: rebase errors * fix: invocation of LoginContext * Fix: rebase errors * Fix: update resource category and resource page get calls to return data directly * Refactor: use invalidateQueries instead of passing refetch function for CollectionPagesSection * Fix: error when retrieving page settings * Fix: rebase errors * Fix: invalidate query instead of reload when changing page settings * Feat: add success toast when changing settings * Fix: change folder naming to use invalidation instead of reload * Fix: invalidate correct resource folder key * Fix: update success toast messages * Fix: remove log statement * Fix: add successtoast Co-authored-by: Alexander Lee <alexander@open.gov.sg> * fix: pass parameters to wrapped components (#439) * fix: fixes toast popup on item select, folder deletion modal (#440) * fix: fixes toast popup on item select, folder deletion modal * fix: add condition for folder deletion Co-authored-by: kwajiehao <31984694+kwajiehao@users.noreply.github.com> Co-authored-by: jiehao <jiehao@open.gov.sg> Co-authored-by: Preston Lim <prestonlimlianjie@gmail.com> Co-authored-by: Alexander Lee <alexander@open.gov.sg> Co-authored-by: Alexander Lee <alexleegs@gmail.com>
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.
This PR revises the layout for rearranging folder content.
This is based on the designers' feedback for the UX review of V1 CMS, where the rearrange feature lacks user guidance. Specifically, the feedback given is as follows:
This PR revises the layout to be inline with the previously discussed design layout:
https://www.figma.com/proto/4qNhGTBMs521pDvCAIh4ON/IsomerCMS?node-id=780%3A7264&viewport=-257%2C-424%2C0.15383589267730713&scaling=scale-down
Attached are photos of the updated behavior on Staging CMS:
Additionally, this PR refactors
FolderContentto simplify the logic and parameter passing.