chore: Refactor publisher listing app #4859
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
Demo
Jenkins 
demos.haus ![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?s=60&v=4){kind=small}
steverydz
force-pushed
the
refactor-listing-page-data-fetching
branch
from
e8b453b
to
78e4d2a
Compare
steverydz
force-pushed
the
refactor-listing-page-data-fetching
branch
18 times, most recently
from
1d6f97c
to
4fa04a9
Compare
steverydz
force-pushed
the
refactor-listing-page-data-fetching
branch
2 times, most recently
from
a76dba9
to
f63be2f
Compare
steverydz
force-pushed
the
refactor-listing-page-data-fetching
branch
from
f63be2f
to
3c18464
Compare
chillkang
reviewed
Oct 2, 2024
ilayda-cp
approved these changes
Oct 2, 2024
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.
Done
Currently the listing view uses data directly from the template. This will be problematic when moving to the publisher app as it would require the data for every view to be embedded into one template. This PR refactors the app so that the data comes from an API endpoint,
/api/:snap_name/listingin this case.This application is split into sections, one for each section of the listing page, e.g Listing details, Contact information and Additional information. Each one of these components contains sub-components that are only relevant to that component.
The data for the
GETrequest has been formatted so it works out of the box with the form which uses React Hook Form. For thePOSTrequest, the store API requires the data in a specific format, for example all of the images (icon, banner, and screenshots) need to be present in an array, even if only one of them has changed. Therefore there are some utilities to identify changed fields and format the data so it can be saved.React Query is used to manage the data requests. Each method has been separated into a hook to make reuse easier. The
ListingFormcomponent is a child component of the mainAppcomponent, with the data passed to that component once it is available, in order to avoid the state where no data is available.Once the form has saved successfully it makes a new
GETrequest to get the latest data and then calls theresetmethod from React Hook Form with the new default values so the form is then in a reset state with the latest data.The application makes use of shared components for the
PageHeaderandSaveAndPreview. These are used by the rest of the publisher app and it will make it easier to integrate the listing page into the publisher app once this PR is merged.How to QA
Testing