Skip to content

CONTRIBUTING.md

Latest commit

 

History

History
93 lines (66 loc) · 2.94 KB

CONTRIBUTING.md

File metadata and controls

93 lines (66 loc) · 2.94 KB
Raw

Contributing to Lark

Thank you for your interest in contributing to Lark. This guide covers everything you need to get started with the frontend codebase.

Prerequisites

  • Node.js 20 or later
  • npm 10 or later
  • A running Lark backend instance (default: http://127.0.0.1:4001)

Getting Started

# Fork and clone the repository
git clone https://github.com/<your-username>/lark.git
cd lark/lark-web

# Install dependencies
npm install

# Start the dev server
npm run dev

The app will be available at http://localhost:5173. API requests are proxied to the backend automatically.

Development Workflow

  1. Create a branch from main:

    git checkout -b feat/your-feature

  2. Make your changes. The dev server supports hot module replacement -- changes appear instantly.

  3. Run the type checker before committing:

    npx tsc --noEmit

  4. Build to verify there are no production issues:

    npm run build

  5. Commit with a clear message following Conventional Commits:

    feat: add keyboard shortcut for channel switching
fix: prevent duplicate messages on reconnect
docs: update environment variable table

  6. Push and open a pull request against main.

Code Style

  • TypeScript strict mode is enabled. Avoid any -- use proper types from src/types/index.ts.
  • Functional components only. No class components.
  • Tailwind CSS for all styling. No inline styles or CSS modules.
  • Named exports for components. Default exports only at the route/page level.
  • Keep components focused. If a file exceeds 200 lines, consider splitting it.
  • Use custom hooks (src/hooks/) for data fetching and side effects.

Project Conventions

Concern Approach
State management React useState / useReducer -- no external store yet
Data fetching useApi hook wrapping fetch with Bearer token auth
Real-time updates useWebSocket hook for server-push events
Routing react-router-dom with workspace-scoped routes
Authentication JWT or API key stored in localStorage
Error handling ErrorBoundary component wraps the app

Pull Request Guidelines

  • Keep PRs focused on a single change.
  • Include a clear description of what changed and why.
  • Add screenshots or recordings for UI changes.
  • Ensure npx tsc --noEmit and npm run build pass.
  • Link related issues using Closes #123.

Reporting Bugs

Use the bug report template. Include steps to reproduce, expected behavior, and your environment details.

Feature Requests

Use the feature request template. Describe the problem you are trying to solve and your proposed solution.

Questions

Open a discussion on GitHub. We are happy to help.