Skip to main content

Contributing

Help improve Midnight Auth for everyone! We welcome contributions of all kinds.

Ways to Contribute​

🐛 Report Bugs​

Found an issue? Let us know on GitHub Issues

💡 Suggest Features​

Have an idea? Open a feature request

💻 Submit Code​

Fix bugs or add features via pull requests

📝 Improve Documentation​

Help make documentation clearer and more comprehensive

Getting Started​

1. Fork and Clone​

Fork the repository on GitHub, then clone your fork:

git clone https://github.com/YOUR_USERNAME/midnight-auth.git
cd midnight-auth

2. Install Dependencies​

npm install

3. Create a Branch​

git checkout -b feature/your-feature-name

4. Make Changes​

Make your changes following our coding standards. Ensure your code:

  • Follows existing code style and conventions
  • Includes TypeScript types
  • Has proper error handling
  • Includes tests if applicable
  • Is well-documented

5. Test Your Changes​

npm run build
npm run test
npm run lint

6. Commit and Push​

git add .
git commit -m "feat: add your feature description"
git push origin feature/your-feature-name

7. Open a Pull Request​

Go to GitHub and open a pull request from your branch to the main repository.

Commit Convention​

We follow conventional commits for clear and consistent commit messages:

feat: add new feature
fix: bug fix
docs: documentation changes
style: code style changes (formatting, etc.)
refactor: code refactoring
test: adding or updating tests
chore: maintenance tasks

Examples​

feat: add session timeout configuration
fix: resolve wallet connection error on reload
docs: update installation guide
refactor: simplify wallet state management
test: add tests for useMidnightAuth hook

Code Style​

TypeScript​

  • Use TypeScript for all new code
  • Provide proper type definitions
  • Avoid any types when possible
  • Use interfaces for object shapes
// Good
interface WalletConfig {
  timeout: number
  autoConnect: boolean
}

// Avoid
const config: any = { timeout: 1000 }

React Components​

  • Use functional components with hooks
  • Properly type props
  • Handle loading and error states
  • Clean up effects
interface ButtonProps {
  onClick: () => void
  disabled?: boolean
}

export function Button({ onClick, disabled = false }: ButtonProps) {
  return <button onClick={onClick} disabled={disabled}>Click</button>
}

Naming Conventions​

  • Components: PascalCase (MidnightConnectButton)
  • Hooks: camelCase with 'use' prefix (useMidnightAuth)
  • Types/Interfaces: PascalCase (WalletState)
  • Constants: UPPER_SNAKE_CASE (DEFAULT_TIMEOUT)

Testing​

Writing Tests​

  • Write tests for new features
  • Update tests when modifying existing code
  • Aim for good coverage of critical paths
  • Test edge cases and error scenarios
describe('useMidnightAuth', () => {
  it('should connect to wallet', async () => {
    const { result } = renderHook(() => useMidnightAuth())
    await act(async () => {
      await result.current.connect()
    })
    expect(result.current.isConnected).toBe(true)
  })
})

Running Tests​

# Run all tests
npm test

# Run tests in watch mode
npm test -- --watch

# Run tests with coverage
npm test -- --coverage

Documentation​

Updating Docs​

  • Update relevant documentation when adding features
  • Include code examples
  • Explain the "why" not just the "what"
  • Keep language clear and concise

Documentation Structure​

  • Introduction: Overview and key features
  • Installation: Setup instructions
  • Quick Start: Basic usage
  • Components: Component API reference
  • Hooks: Hook API reference
  • Examples: Real-world usage patterns

Pull Request Guidelines​

Before Submitting​

  • Code follows style guidelines
  • Tests pass locally
  • Documentation is updated
  • Commit messages follow convention
  • Branch is up to date with main

PR Description​

Include in your PR description:

  • What: What changes does this PR introduce?
  • Why: Why are these changes needed?
  • How: How were the changes implemented?
  • Testing: How were the changes tested?

Example PR Description​

## What
Adds session timeout configuration to MidnightAuthProvider

## Why
Users need to customize session duration based on their security requirements

## How
- Added `sessionTimeout` prop to MidnightAuthProvider
- Updated session management logic
- Added TypeScript types

## Testing
- Added unit tests for session timeout
- Tested with various timeout values
- Verified backward compatibility

Code of Conduct​

We are committed to providing a welcoming and inclusive environment. Please:

  • Be respectful and considerate
  • Welcome newcomers and help them learn
  • Accept constructive criticism gracefully
  • Focus on what's best for the community
  • Use inclusive language

Questions?​

If you have questions about contributing:

Recognition​

Contributors will be recognized in:

  • GitHub contributors list
  • Release notes
  • Project README

Thank you for contributing to Midnight Auth! 🎉