Skip to content

Latest commit

 

History

History
81 lines (65 loc) · 3.8 KB

CONTRIBUTING.md

File metadata and controls

81 lines (65 loc) · 3.8 KB
Raw

Contributing

This guide was heavily based on https://github.com/react-hookz/web/blob/master/CONTRIBUTING.md. Pure 💖 awesomeness 💖.

Thanks for contributing to @mirohq/websdk-react-hooks.

If you are contributing for the first time, we recommend reading this First Contributions guide first.

Project setup

  1. Fork the main repo
  2. Clone the repo to your computer (add --depth=1 to git clone command to save time)
  3. Install dependencies: yarn
  4. Make sure everything builds and tests: yarn build && yarn test
  5. Create a branch for your PR: git checkout -b my-awesome-hook
    • if you are adding a new hook, name the branch based on the hook: useUpdateEffect
    • if your change fixes an issue, name the branch based on the issue number: fix-12345
  6. Follow the directions below:

Tip: to keep your main branch pointing to the original repo's main (instead of your fork's main) do this:

git remote add upstream https://github.com/miroapp/miro-react-hooks
git fetch upstream
git branch --set-upstream-to=upstream/main main

After running these commands you'll be able to easily pull changes from the original repository with git pull.

Development

  1. Implement the hook in the src folder.
    • The folder should be named after your new hook, for instance: ./src/myAwesomeHook.
    • The file with hook implementation should use the same name and be placed inside the above created subdirectory as ./src/myAwesomeHook/myAwesomeHook.ts
    • The hook should be exported by name, not default-exported.
    • If the hook has custom types in its parameters or return values, they should be exported as well.
    • Types and interfaces should not have prefixes like I or T.
    • The hook should be developed to run specifically in the client.
    • If your hook reuses other @mirohq/websdk-react-hooks hooks, import them as import { useMiro } from '../useMiro'; instead of import { useMiro } from '..';
    • Create an index.ts file within the same subdirectory and export all the hook dependencies.
  2. Re-export the hook implementation and all its custom types in ./src/index.ts.
  3. Fully test your hook, the test filename should use the same hook's name, ./src/myAwesomeHook/myAwesomeHook.text.tsx
  4. Write docs for your hook.
    • Docs should be colocated with the implementation using the same name for the markdown file, following our previous example, it should be ./src/myAwesomeHook/myAwesomeHook.md.
    • Write a short example demonstrating your hook in that markdown file.
  5. Add a summary of the hook and a link to the docs to README.md.
  6. After all the above steps are done, run yarn format to ensure that everything is styled by our standards and there are no linting issues.
  7. yarn new-hook myAwesomeHook will help you to create a proper file structure for the new hook.

Committing

Commit message

This repo uses commit-and-tag-version and conventional commit messages so prefix your commits with fix:, feat:, etc., so that your changes appear in the release notes.

Also, there is a script that helps you to properly format commit messages:

git add .
yarn commit

The script guides you through several prompts that help you with writing a good commit message, including many non-obvious and easy-to-forget parts.

Git hooks

This project includes Git hooks that are automatically enabled when you install the dependencies. These hooks automatically test and validate your code and commit messages before each commit. In most cases disabling these hooks is not recommended.