First of all, thank you for contributing, you're awesome!
To have your code integrated in the API Platform project, there are some rules to follow, but don't panic, it's easy!
If you happen to find a bug, we kindly request you to report it. However, before submitting it, please:
- Check the project documentation available online
Then, if it appears that it's a real bug, you may report it using GitHub by following these 3 points:
- Check if the bug is not already reported!
- A clear title to resume the issue
- A description of the workflow needed to reproduce the bug
NOTE: Don't hesitate giving as much information as you can (OS, browser, ...)
Please base your changes on the main branch.
You can patch @api-platform/admin by two different ways:
- if you already have a project in progress: read Linking the Source Version to an Existing Project;
- if you do not have an existing project: read Running Admin Through Storybook.
If you already have a project in progress, you can develop directly from it.
The instructions below explain how to install the source version of API Platform Admin in your project and contribute a patch.
Your client should already use @api-platform/admin and its bootstrap file (usually: src/App.tsx) should at least contains:
import React from 'react';
import { HydraAdmin } from '@api-platform/admin';
function App() {
return (
<HydraAdmin entrypoint="https://demo.api-platform.com" />
)
}
export default AppInstall your own version of @api-platform/admin:
cd ..
git clone https://github.com/api-platform/admin.gitLink it:
cd admin
yarn link
cd ../<yourproject>
yarn link "@api-platform/admin"Use the React version of your project to build @api-platform/admin:
cd node_modules/react/
yarn link
cd ../../../admin
yarn link reactBuild continuously your @api-platform/admin version:
yarn install --force
yarn watchOpen a new terminal console with the same path.
Start your client:
cd ../<yourproject>/
yarn install --force
yarn dev --forceYou can now hack in the cloned repository of
api-platform-admin.
If you do not have an existing project, you can use Storybook to visualize changes in the source code, and test them.
This development stack consists of two Docker containers:
pwa: containing the<Admin>sources and Storybook;php: holding the API sources.
Additionally, this method allows testing the integration between API Platform and the admin component by writing stories, scenarios and tests.
Install everything:
docker compose upBefore accessing the Storybook instance, make sure to go to https://localhost to accept the self-signed certificate. Once it's done, you'll see the API documentation running on a customized version of Swagger UI.
Now you can go to http://localhost:3000/ to see the Storybook instance in action. The changes you'll make in the source code will be hot-reloaded.
Tips: you can run Storybook directly in your local machine by running
yarn storybook. It will take another port, usually 3001. Make sure to have the API running before.
To run a command directly inside a container, run:
# Run a command in the php container
docker compose exec -T php your-command
# Run a command in the pwa container
docker compose exec -T pwa your-commandBefore sending a Pull Request, make sure the tests pass correctly:
# Functional tests
yarn test
# End to end tests
yarn test-storybook --url http://127.0.0.1:3000/If you add a new feature, don't forget to add tests for it.
- Functionnal tests are written with Jest and React Testing Library;
- End-to-end tests are written with Storybook play functions.
The API Platform Admin project follows coding standards inspired by the Airbnb JavaScript style guide. But don't worry, you can fix CS issues automatically using the ESLint tool:
yarn fixAnd then, add the fixed files to your commit before pushing. Be sure to add only your modified files. If any other file is fixed by CS tools, just revert it before committing.
When you send a PR, just make sure that:
- You add valid test cases (Jest).
- Tests are green.
- You make a PR on the related documentation in the api-platform/docs repository.
- You make the PR on the same branch you based your changes on. If you see commits that you did not make in your PR, you're doing it wrong.
- Also don't forget to add a comment when you update a PR with a ping to the maintainers, so he/she will get a notification.
- Squash your commits into one commit (see the next chapter).
All Pull Requests must include this header.
If you have 3 commits, start with:
git rebase -i HEAD~3An editor will be opened with your 3 commits, all prefixed by pick.
Replace all pick prefixes by fixup (or f) except the first commit of the list.
Save and quit the editor.
After that, all your commits will be squashed into the first one and the commit message will be the first one.
If you would like to rename your commit message, type:
git commit --amendNow force push to update your PR:
git push --force-with-leaseAlways execute the tests before releasing a new version:
yarn build
yarn test
yarn lintTo fix linting errors, you can use yarn fix.
To release a new version:
yarn version # this creates a tag and a commit
git push
git push --tagsGitHub CI/CD Actions will then publish the version on npm.
To create a new release:
gh release createWhen asked about the release notes, pick 'Write using generated notes as template'.
Finally, don't forget to update the milestones:
- Close the milestone you just released
- Create a new milestone for the next version
When you open a Pull Request to the API Platform project, you agree to license your code under the MIT license and to transfer the copyright on the submitted code to Kévin Dunglas.
Be sure to you have the right to do that (if you are a professional, ask your company)!
If you include code from another project, please mention it in the Pull Request description and credit the original author.