Copy Placeholders for UCSBOrganization pages; add to App.js/AppNavbar.js
Acceptance Criteria:
[ ] When you navigate to /ucsborganization/create in the URL bar,
there is page that allows the user to create a new UCSBOrganization record.
[ ] When you enter data into the form and click the submit button,
if the data is valid, the data is sent to the server,
a new UCSBOrganization record is created,and the user is routed to the
/ucsborganization route for the UCSBOrganizationIndexPage page.
[ ] When you enter data into the form and click the submit button,
if the data is not valid,appropriate error messages are displayed,
the data is NOT sent to the server, a new UCSBOrganization record is NOT created,
and the user remains on the ucsborganization/create page.
[ ] When you submit valid data to the page and click submit, a new valid database
entry is stored in the database. (You can verify this by using the swagger
endpoint to view the current data in the table.)
[ ] The PR description has step-by-step descriptions for testing the new page, along
with screenshots, so that someone reviewing the PR will know what to do to test
it, and what it is supposed to look like when it functions correctly.
[ ] The PR description has a link to the storybook entry for the new page.
Implementation Details
[ ] Before starting, refamiliarize yourself with the backend CRUD API endpoints for
UCSBOrganization by looking at the swagger page. You are going to be copy/pasting
code from the Restaurant and UCSBDates components. Those use backend api endpoints
that are similar to the ones for UCSBOrganization, but not identical. You will need
to know the exact name of the API endpoints for UCSBOrganization in order to
be sure that your frontend code is calling the correct backend endpoints.
[ ] In UCSBOrganizationCreatePage.js, replace the code from PlaceholderCreatePage.js
with code modelled after the files RestaurantCreatePage.js and/or UCSBDatesCreatePage.js
that is appropriate to your UCSBOrganization table. Be sure to get the API endpoint names correct for your UCSBOrganization table.
[ ] In UCSBOrganizationCreatePage.test.js, replace the code from PlaceholderCreatePage.test.js
with code modelled after the files RestaurantCreatePage.test.js and/or UCSBDatesCreatePage.test.js
appropriate to your UCSBOrganization table. Be sure to get the API endpoint names correct for your UCSBOrganization table.
[ ] Under frontend/src/stories/pages/UCSBOrganization/ create a file called UCSBOrganizationCreatePage.stories.js
modelled after the files RestaurantCreatePage.stories.js and/or UCSBDatesCreatePage.stories.js.
Reminders (all from frontend directory):
To run storybook locally: npm run storybook.
To run tests locally: npm test.
Quickly test coverage locally: npm run coverage
Check linting locally: npx eslint --fix .
Check mutation coverage locally (slow): npx stryker run
Check mutation coverage of single file (faster): npx stryker run -m src/main/pages/UCSBOrganization/UCSBOrganizationCreatePage.js
What to do next
Do a PR (following the usual steps).
Check for other PRs
Start work on "Index Page for UCSBOrganization plus tests and stories"(following the usual steps for a new issue)
Dependencies
Complete the following issues first:
UCSBOrganization
pages; add to App.js/AppNavbar.jsAcceptance Criteria:
[ ] When you navigate to
/ucsborganization/create
in the URL bar, there is page that allows the user to create a new UCSBOrganization record.[ ] When you enter data into the form and click the submit button, if the data is valid, the data is sent to the server, a new UCSBOrganization record is created,and the user is routed to the
/ucsborganization
route for theUCSBOrganizationIndexPage
page.[ ] When you enter data into the form and click the submit button, if the data is not valid,appropriate error messages are displayed, the data is NOT sent to the server, a new UCSBOrganization record is NOT created, and the user remains on the
ucsborganization/create
page.[ ] When you submit valid data to the page and click submit, a new valid database entry is stored in the database. (You can verify this by using the swagger endpoint to view the current data in the table.)
[ ] The PR description has step-by-step descriptions for testing the new page, along with screenshots, so that someone reviewing the PR will know what to do to test it, and what it is supposed to look like when it functions correctly.
[ ] The PR description has a link to the storybook entry for the new page.
Implementation Details
[ ] Before starting, refamiliarize yourself with the backend CRUD API endpoints for
UCSBOrganization
by looking at the swagger page. You are going to be copy/pasting code from theRestaurant
andUCSBDates
components. Those use backend api endpoints that are similar to the ones forUCSBOrganization
, but not identical. You will need to know the exact name of the API endpoints forUCSBOrganization
in order to be sure that your frontend code is calling the correct backend endpoints.[ ] In
UCSBOrganizationCreatePage.js
, replace the code fromPlaceholderCreatePage.js
with code modelled after the filesRestaurantCreatePage.js
and/orUCSBDatesCreatePage.js
that is appropriate to yourUCSBOrganization
table. Be sure to get the API endpoint names correct for yourUCSBOrganization
table.[ ] In
UCSBOrganizationCreatePage.test.js
, replace the code fromPlaceholderCreatePage.test.js
with code modelled after the filesRestaurantCreatePage.test.js
and/orUCSBDatesCreatePage.test.js
appropriate to yourUCSBOrganization
table. Be sure to get the API endpoint names correct for yourUCSBOrganization
table.[ ] Under
frontend/src/stories/pages/UCSBOrganization/
create a file calledUCSBOrganizationCreatePage.stories.js
modelled after the filesRestaurantCreatePage.stories.js
and/orUCSBDatesCreatePage.stories.js
.Reminders (all from
frontend
directory):npm run storybook
.npm test
.npm run coverage
npx eslint --fix .
npx stryker run
npx stryker run -m src/main/pages/UCSBOrganization/UCSBOrganizationCreatePage.js
What to do next
UCSBOrganization
plus tests and stories"(following the usual steps for a new issue)