Add professional repo polish: badges, LICENSE, templates, and CI

.env.example

@@ -5,4 +5,3 @@ VITE_FIREBASE_STORAGE_BUCKET=your-project.firebasestorage.app
 VITE_FIREBASE_MESSAGING_SENDER_ID=your-sender-id
 VITE_FIREBASE_APP_ID=your-app-id
 VITE_FIREBASE_MEASUREMENT_ID=your-measurement-id
-VITE_LOGO_URL=/your-logo.svg

.github/ISSUE_TEMPLATE/bug_report.md

@@ -0,0 +1,27 @@
+---
+name: Bug Report
+about: Report a bug to help us improve
+title: ''
+labels: bug
+assignees: ''
+---
+
+**Describe the bug**
+A clear and concise description of what the bug is.
+
+**To reproduce**
+Steps to reproduce the behavior:
+1. Go to '...'
+2. Click on '...'
+3. See error
+
+**Expected behavior**
+What you expected to happen.
+
+**Screenshots**
+If applicable, add screenshots to help explain the problem.
+
+**Environment**
+- Browser: [e.g. Chrome 120]
+- OS: [e.g. macOS 14]
+- Device: [e.g. Desktop / Mobile]

.github/ISSUE_TEMPLATE/feature_request.md

@@ -0,0 +1,19 @@
+---
+name: Feature Request
+about: Suggest a new feature or improvement
+title: ''
+labels: enhancement
+assignees: ''
+---
+
+**Problem**
+What problem does this feature solve?
+
+**Proposed solution**
+Describe the feature you'd like.
+
+**Alternatives considered**
+Any alternative solutions or features you've considered.
+
+**Additional context**
+Any other context, mockups, or screenshots.

.github/PULL_REQUEST_TEMPLATE.md

@@ -0,0 +1,18 @@
+## What does this PR do?
+
+<!-- Brief description of the change -->
+
+## Why?
+
+<!-- Motivation or link to the related issue -->
+
+## How to test
+
+<!-- Steps to verify the change works -->
+
+## Checklist
+
+- [ ] `npm run lint` passes
+- [ ] `npm run build` passes
+- [ ] Tested on mobile viewport
+- [ ] Updated README if needed

.github/workflows/ci.yml

@@ -0,0 +1,40 @@
+name: CI
+
+on:
+  push:
+    branches: [main]
+  pull_request:
+    branches: [main]
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    strategy:
+      matrix:
+        node-version: [20, 22]
+
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ matrix.node-version }}
+          cache: npm
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Lint
+        run: npm run lint
+
+      - name: Type-check and build
+        run: npm run build
+        env:
+          VITE_FIREBASE_API_KEY: dummy
+          VITE_FIREBASE_AUTH_DOMAIN: dummy
+          VITE_FIREBASE_PROJECT_ID: dummy
+          VITE_FIREBASE_STORAGE_BUCKET: dummy
+          VITE_FIREBASE_MESSAGING_SENDER_ID: dummy
+          VITE_FIREBASE_APP_ID: dummy

.gitignore

@@ -17,9 +17,6 @@ dist
 dist-ssr
 *.local
 
-# Branding
-public/talabat-logo.svg
-
 # Editor directories and files
 .vscode/*
 !.vscode/extensions.json

CONTRIBUTING.md

@@ -0,0 +1,42 @@
+# Contributing to Workstream
+
+Thanks for your interest in contributing! Here's how to get started.
+
+## Development Setup
+
+1. Fork and clone the repo
+2. Run `npm install`
+3. Copy `.env.example` to `.env` and fill in your Firebase config
+4. Run `npm run dev` to start the development server
+
+## Making Changes
+
+1. Create a new branch from `main`
+2. Make your changes
+3. Run `npm run lint` to check for lint errors
+4. Run `npm run build` to verify the build passes
+5. Commit your changes with a clear, descriptive message
+
+## Pull Requests
+
+- Keep PRs focused — one feature or fix per PR
+- Update the README if your change affects the public API or setup
+- Make sure the build passes before requesting review
+
+## Code Style
+
+- TypeScript strict mode
+- Functional React components with hooks
+- TailwindCSS for styling (no inline styles or CSS modules)
+- Use the existing UI components in `src/components/ui/` where possible
+
+## Reporting Bugs
+
+Open an issue with:
+- Steps to reproduce
+- Expected vs actual behavior
+- Browser and OS info
+
+## Feature Requests
+
+Open an issue describing the feature and why it would be useful. Discussion before implementation is encouraged for larger changes.

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Brahim Guaali
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -1,57 +1,73 @@
+<div align="center">
+
 # Workstream
 
-A visual project tracker that shows how work branches over time. Track parallel workstreams, see when and why they diverged, and maintain context across your team.
+**A visual project tracker that shows how work branches over time.**
 
-## Features
+Track parallel workstreams, see when and why they diverged, and maintain context across your team.
 
-- **Visual Stream Tree**: Interactive canvas with drag-and-drop, zoom, and pan navigation
-- **Stream Management**: Create, branch, and track workstreams in a nested hierarchy
-- **Rich Context**: Add notes, change status, and link artifacts to any stream
-- **Project Metrics**: Track key metrics with change percentages and optional targets
-- **Stream Dependencies**: Define dependencies between streams
-- **Source Types**: Categorize streams as task, investigation, meeting, blocker, or discovery
-- **AI Insights**: AI-powered project analysis with TL;DR, progress overview, blockers, metrics trends, and recommendations (Gemini via Firebase AI Logic)
-- **Export Formats**: Export projects as JSON (data backup), Markdown (readable document), or PDF (print)
-- **Import / Export**: Full JSON import/export with metrics, streams, events, and positions preserved
-- **Google Auth**: Sign in with Google via Firebase Authentication
+[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](LICENSE)
+[![React](https://img.shields.io/badge/React-19-61dafb?logo=react&logoColor=white)](https://react.dev)
+[![TypeScript](https://img.shields.io/badge/TypeScript-5.9-3178c6?logo=typescript&logoColor=white)](https://www.typescriptlang.org)
+[![Firebase](https://img.shields.io/badge/Firebase-11-ffca28?logo=firebase&logoColor=black)](https://firebase.google.com)
+[![Vite](https://img.shields.io/badge/Vite-7-646cff?logo=vite&logoColor=white)](https://vite.dev)
+[![TailwindCSS](https://img.shields.io/badge/Tailwind-4-06b6d4?logo=tailwindcss&logoColor=white)](https://tailwindcss.com)
+[![D3.js](https://img.shields.io/badge/D3.js-7-f9a03c?logo=d3dotjs&logoColor=white)](https://d3js.org)
+[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](CONTRIBUTING.md)
 
+<br />
 
 https://github.com/user-attachments/assets/37d18491-6b29-4698-9c46-078cf517bcaa
 
+</div>
+
+---
+
+## Features
+
+- **Visual Stream Tree** — Interactive D3-powered canvas with drag-and-drop, zoom, and pan
+- **Stream Branching** — Create, branch, and track workstreams in a nested hierarchy
+- **Rich Context** — Add notes, change status, and link artifacts (PRs, tickets, docs) to any stream
+- **Project Metrics** — Track key metrics with change percentages and optional targets
+- **Stream Dependencies** — Define and visualize dependencies between streams
+- **Source Types** — Categorize streams as task, investigation, meeting, blocker, or discovery
+- **AI Insights** — AI-powered analysis with TL;DR, progress, blockers, metrics trends, and recommendations (Gemini 2.5 Flash via Firebase AI Logic)
+- **Export** — Export projects as JSON, Markdown, or PDF
+- **Import / Export** — Full JSON round-trip with metrics, streams, events, and canvas positions preserved
+- **Real-time Collaboration** — Share projects with role-based access (owner, editor, viewer)
+- **Google Auth** — Sign in with Google via Firebase Authentication
+- **Mobile Responsive** — Fully responsive layout for desktop and mobile
 
 ## Tech Stack
 
-- **Frontend**: React 19, TypeScript, Vite
-- **Styling**: TailwindCSS 4
-- **Visualization**: D3.js
-- **AI**: Firebase AI Logic (Gemini 2.5 Flash)
-- **Backend**: Firebase (Firestore + Auth)
-- **Hosting**: Firebase Hosting
+| Layer | Technology |
+|-------|-----------|
+| **Frontend** | React 19, TypeScript 5.9, Vite 7 |
+| **Styling** | TailwindCSS 4 |
+| **Visualization** | D3.js 7 |
+| **AI** | Firebase AI Logic (Gemini 2.5 Flash) |
+| **Backend** | Firebase (Firestore + Auth) |
+| **Hosting** | Firebase Hosting |
 
 ## Getting Started
 
 ### Prerequisites
 
-- Node.js 20+
+- [Node.js](https://nodejs.org) 20+
 - A Firebase project with Firestore and Authentication enabled
 
 ### Installation
 
 ```bash
+# Clone the repository
+git clone https://github.com/brahim-guaali/Workstream.git
+cd Workstream
+
 # Install dependencies
 npm install
 
-# Create .env with your Firebase config
-cat > .env << 'EOF'
-VITE_FIREBASE_API_KEY=your-api-key
-VITE_FIREBASE_AUTH_DOMAIN=your-project.firebaseapp.com
-VITE_FIREBASE_PROJECT_ID=your-project-id
-VITE_FIREBASE_STORAGE_BUCKET=your-project.firebasestorage.app
-VITE_FIREBASE_MESSAGING_SENDER_ID=your-sender-id
-VITE_FIREBASE_APP_ID=your-app-id
-VITE_FIREBASE_MEASUREMENT_ID=your-measurement-id
-VITE_LOGO_URL=/your-logo.svg
-EOF
+# Copy the example env file and fill in your Firebase config
+cp .env.example .env
 
 # Start development server
 npm run dev
@@ -60,7 +76,7 @@ npm run dev
 ### Environment Variables
 
 | Variable | Required | Description |
-|----------|----------|-------------|
+|----------|:--------:|-------------|
 | `VITE_FIREBASE_API_KEY` | Yes | Firebase API key |
 | `VITE_FIREBASE_AUTH_DOMAIN` | Yes | Firebase auth domain |
 | `VITE_FIREBASE_PROJECT_ID` | Yes | Firebase project ID |
@@ -83,27 +99,27 @@ npm run dev
 ```
 src/
 ├── components/
-│   ├── auth/              # SignIn
-│   ├── layout/            # Header, Layout
-│   ├── project/           # ProjectList, ProjectCard
-│   ├── stream/            # StreamDetail, AddStreamModal
-│   ├── visualization/     # StreamTree (D3 canvas)
-│   └── ui/                # Button, Modal, Input, Textarea
-├── contexts/              # AuthContext
-├── hooks/                 # useProjects, useStreams, useEvents, useProjectInsights
-├── lib/                   # firebase.ts, utils.ts, exportDocument.ts
-├── types/                 # database.ts
+│   ├── auth/              # Sign-in flow
+│   ├── layout/            # Header, Layout shell
+│   ├── project/           # Project list, cards, sharing
+│   ├── stream/            # Stream detail panel, modals
+│   ├── visualization/     # D3 stream tree canvas
+│   └── ui/                # Reusable primitives (Button, Modal, Input, etc.)
+├── contexts/              # Auth context provider
+├── hooks/                 # Custom hooks (projects, streams, events, AI insights)
+├── lib/                   # Firebase init, utilities, export logic
+├── types/                 # TypeScript type definitions
 └── pages/                 # HomePage, ProjectPage
 ```
 
-## Available Scripts
+## Scripts
 
-```bash
-npm run dev      # Start development server
-npm run build    # Type-check and build for production
-npm run preview  # Preview production build
-npm run lint     # Run ESLint
-```
+| Command | Description |
+|---------|-------------|
+| `npm run dev` | Start development server |
+| `npm run build` | Type-check and build for production |
+| `npm run preview` | Preview production build locally |
+| `npm run lint` | Run ESLint |
 
 ## Deployment
 
@@ -112,6 +128,16 @@ npm run build
 firebase deploy --only hosting --project your-project-id
 ```
 
+## Contributing
+
+Contributions are welcome! Please read the [Contributing Guide](CONTRIBUTING.md) before submitting a pull request.
+
 ## License
 
-MIT
+This project is licensed under the [MIT License](LICENSE).
+
+---
+
+<div align="center">
+  <sub>Built with React, D3.js, Firebase, and a lot of coffee.</sub>
+</div>

index.html

@@ -4,6 +4,14 @@
     <meta charset="UTF-8" />
     <link rel="icon" type="image/svg+xml" href="/vite.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name="description" content="A visual project tracker that shows how work branches over time. Track parallel workstreams, see when and why they diverged." />
+    <meta name="theme-color" content="#0f172a" />
+    <meta property="og:title" content="Workstream" />
+    <meta property="og:description" content="A visual project tracker that shows how work branches over time." />
+    <meta property="og:type" content="website" />
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta name="twitter:title" content="Workstream" />
+    <meta name="twitter:description" content="A visual project tracker that shows how work branches over time." />
     <title>Workstream</title>
   </head>
   <body>