Merge pull request #163 from OpenSourceFellows/docs/update-readme-and-package-metadata

Update README and package.json metadata

Author: oscar-romero-jorge

CONTRIBUTING.md

@@ -11,22 +11,22 @@ Click the **"Fork"** button on the top right of this page to create a copy of th
 
 ### 2. Clone Your Fork Locally
 
-```bash
+```sh
 git clone https://github.com/YOUR-USERNAME/YOUR-FORK.git
 cd YOUR-FORK
 ```
 
 ### 3. Add the Original Repo as a Remote
 
-```bash
+```sh
 git remote add upstream https://github.com/OpenSourceFellows/map-dashboard.git
 ```
 
 ### 4. Create a New Branch for Your Work
 
     Never work directly on main or reuse old branches.
 
-```bash
+```sh
 git checkout main
 git pull upstream main
 git checkout -b feature/your-feature-name
@@ -36,14 +36,14 @@ git checkout -b feature/your-feature-name
 
 Make your changes locally, and commit them:
 
-```bash
+```sh
 git add .
 git commit -m "Add: brief description of your change"
 ```
 
 ### 6. Push the Branch to Your Fork
 
-```bash
+```sh
 git push origin feature/your-feature-name
 ```
 
@@ -59,7 +59,7 @@ git push origin feature/your-feature-name
 
 Before starting new work, always sync your fork:
 
-```bash
+```sh
 git checkout main
 git fetch upstream
 git merge upstream/main

README.md

@@ -6,7 +6,8 @@ A modern, interactive map dashboard built with React and Vite. This project prov
 
 ## Features
 
-- Interactive map visualization (placeholder, ready for integration)
+- Interactive map visualization with Leaflet
+- Dark mode support
 - Layer controls for toggling map data
 - Custom UI components (Button, CheckBox)
 - Responsive layout and styling
@@ -15,7 +16,7 @@ A modern, interactive map dashboard built with React and Vite. This project prov
 
 ## Prerequisites
 
-- Node.js (v18 or higher recommended)
+- Node.js (v20 or higher recommended)
 - pnpm (v9 or higher)
 
 ## Installation
@@ -25,32 +26,61 @@ A modern, interactive map dashboard built with React and Vite. This project prov
    git clone https://github.com/OpenSourceFellows/map-dashboard.git
    cd map-dashboard
    ```
+
 2. Install dependencies:
    ```sh
    pnpm install
    ```
 
+3. **Optional**: For full development setup, you may also need the companion backend server:
+   ```sh
+   git clone https://github.com/OpenSourceFellows/dashboard-server.git
+   ```
+   See the [dashboard-server repository](https://github.com/OpenSourceFellows/dashboard-server) for backend setup instructions.
+
 ## Development
 
-To start the development server:
+Start the development server:
 
 ```sh
 pnpm run dev
 ```
 
 The app will be available at `http://localhost:5173` by default.
 
+Build for production:
+
+```sh
+pnpm run build
+```
+
+Preview production build:
+
+```sh
+pnpm run preview
+```
+
+Run linter:
+
+```sh
+pnpm run lint
+```
+
 ## Project Structure
 
 ```
-main/
+map-dashboard/
 ├── public/           # Static assets
 ├── src/              # Source code
 │   ├── components/   # UI and map components
+│   │   ├── Layout/   # Header and layout components
+│   │   ├── Map/      # Map-related components
+│   │   └── UI/       # Reusable UI components
 │   ├── data/         # Mock data
 │   ├── hooks/        # Custom React hooks
 │   ├── styles/       # CSS files
 │   ├── types/        # TypeScript types
+│   ├── utils/        # Utility functions
 │   ├── App.tsx       # Main app component
 │   └── main.tsx      # Entry point
 ├── package.json      # Project metadata and scripts
@@ -63,20 +93,21 @@ main/
 - [React](https://react.dev/) – UI library
 - [Vite](https://vitejs.dev/) – Fast build tool
 - [TypeScript](https://www.typescriptlang.org/) – Type safety
+- [Leaflet](https://leafletjs.com/) – Interactive maps
+- [React Leaflet](https://react-leaflet.js.org/) – React components for Leaflet
 - [ESLint](https://eslint.org/) – Linting
 
 ## Custom Components
 
 - `Header` – App title and navigation
-- `MapContainer` – Map area and controls
-- `LayerControls` – Toggle map layers
-- `MapLegend` – Map legend
-- `Button` & `CheckBox` – UI elements
-
-## How to Contribute
-
-[CONTRIBUTING.md](CONTRIBUTING.md)
+- `MapContainer` – Interactive Leaflet map with markers and polygons
+- `LayerControls` – Toggle map layers and data types
+- `MapLegend` – Map legend display
+- `CheckBox` – UI checkbox component
 
-## License
+## Additional Documentation
 
-[LICENSE.md](LICENSE.md)
+- [CONTRIBUTING.md](CONTRIBUTING.md) - Contribution guidelines
+- [LICENSE.md](LICENSE.md) - License information
+- [docs/MAINTAINER.md](docs/MAINTAINER.md) - Maintainer guide
+- [docs/QGIS_ATTRIBUTE_PRESERVATION.md](docs/QGIS_ATTRIBUTE_PRESERVATION.md) - QGIS data layer documentation

docs/MAINTAINER.md

@@ -1,33 +1,68 @@
-1. **Review in GitHub UI**:
+# Maintainer Guide
 
-   - Check "Files changed" tab.
-   - Comment on lines if needed.
-   - Approve or request changes.
+This guide is for maintainers with write access to the repository.
 
-2. **Check out the PR locally (optional)**:
-   If you want to test it locally:
+**Key difference from contributors:** You can create branches directly in the main repository instead of forking.
 
-   ```bash
-   gh pr checkout <PR-number>
-   ```
+## Branch Naming Patterns
 
-3. **Merge strategy:**
+Based on existing branches in the repository:
 
-- Use Squash and Merge to keep history clean.
-- Optionally delete the contributor’s branch (GitHub asks this by default).
+- `feature/` - New features (e.g., `feature/dark-mode`, `feature/navbar`)
+- `chore/` - Maintenance tasks (e.g., `chore/switch-to-pnpm`, `chore/organize-files`)
+- `docs/` - Documentation updates (e.g., `docs/update-readme-and-package-metadata`)
+- `Issue-##` - Issue-specific work (e.g., `Issue-10`, `Issue-67`)
 
----
+**Creating a branch:**
+```sh
+git checkout main
+git pull origin main
+git checkout -b <type>/<descriptive-name>
+```
 
-### 🔁 If the Contributor Will Submit More Work
+## Creating Pull Requests
 
-- Remind them to:
-  - Create a new branch for each PR.
-  - Keep their fork synced regularly.
+Push your branch:
 
----
+```sh
+git push -u origin <your-branch-name>
+```
 
-### 🧪 Optional: Automation Tools to Consider
+Create PR using [GitHub CLI](https://cli.github.com/) (requires installation):
 
-- GitHub Actions – for linting, testing, or builds.
-- PR Labelers – auto-label PRs.
-- CODEOWNERS – assign reviewers automatically.
+```sh
+gh pr create --title "Your PR title" --fill
+```
+
+## Reviewing Pull Requests
+
+### 1. Review in GitHub UI
+
+- Check the **"Files changed"** tab
+- Comment on lines if needed
+- Approve or request changes
+
+### 2. Check out PR locally (optional)
+
+If you want to test it locally, use [GitHub CLI](https://cli.github.com/):
+
+```sh
+gh pr checkout <PR-number>
+```
+
+### 3. Merge Strategy
+
+- Use **Squash and Merge** to keep history clean
+- Optionally delete the contributor's branch (GitHub prompts by default)
+
+## If a Contributor Will Submit More Work
+
+Remind them to:
+- Create a new branch for each PR
+- Keep their fork synced regularly
+
+## Optional: Automation Tools to Consider
+
+- GitHub Actions – for linting, testing, or builds
+- PR Labelers – auto-label PRs
+- CODEOWNERS – assign reviewers automatically

package.json

@@ -1,11 +1,17 @@
 {
-  "name": "frontend",
+  "name": "map-dashboard",
+  "description": "Interactive map dashboard for environmental geospatial data",
   "private": true,
   "version": "0.0.0",
   "type": "module",
+  "license": "SEE LICENSE IN LICENSE.md",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/OpenSourceFellows/map-dashboard.git"
+  },
   "engines": {
     "node": ">=20.11.0",
-    "npm": ">=10.0.0"
+    "pnpm": ">=9.0.0"
   },
   "scripts": {
     "dev": "vite",