Merge pull request #4 from MT-superdev/matas/fix/pr-audit

Matas/fix/pr audit

Author: dkargatzis

.dockerignore

@@ -1,32 +1,12 @@
-# Version control
+node_modules
+dist
 .git
 .gitignore
-
-# CI/CD and deployment
-.github
-helm-chart
-
-# Docker files
-Dockerfile
-.dockerignore
-
-# Development files
-README.md
 *.md
-
-# IDE and editor files
-.vscode
-.idea
-*.swp
-*.swo
-
-# OS generated files
+.env
+.env.local
 .DS_Store
-Thumbs.db
-
-# Logs
 *.log
-
-# Temporary files
-tmp/
-temp/ 
+coverage
+.vscode
+.idea

.env.example

@@ -0,0 +1,11 @@
+# API Configuration
+# Set the backend API base URL for local development
+# This overrides the automatic detection (localhost:8000 for localhost, production URL otherwise)
+# 
+# Examples:
+# VITE_API_BASE=http://localhost:8000/api/v1
+# VITE_API_BASE=http://localhost:3000/api/v1
+# VITE_API_BASE=https://your-ngrok-url.ngrok.io/api/v1
+# VITE_API_BASE=https://api.watchflow.dev/api/v1
+
+VITE_API_BASE=

.gitignore

@@ -0,0 +1,29 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Environment variables
+.env
+.env.local
+.env.*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

COMMIT_MSG.txt

@@ -0,0 +1,10 @@
+Major refactor: React/Vite landing, remove legacy scripts and docs
+
+- Replace legacy script/style stack with React 18 + TypeScript + Vite + Tailwind
+- Add /analyze route, installation_id-in-URL flow (no PAT when from install link)
+- Align example rules and mock YAML with backend parameters-based format
+- Example rule cards: tooltip-style cards (no shadow, no rounded corners), updated copy
+- Metadata: theme-color, OG/Twitter/canonical; remove temp DEPLOYMENT.md
+- Remove legacy code: stars.js, script.js, temp_old_script.js, style.css
+- README: deployment section kept; drop broken doc links
+- Dockerfile and helm-chart unchanged for deploy

Dockerfile

@@ -1,3 +1,51 @@
+# Multi-stage build for React/Vite app
+FROM node:20-alpine AS builder
+
+WORKDIR /app
+
+# Copy package files
+COPY package*.json ./
+
+# Install dependencies
+RUN npm ci --legacy-peer-deps
+
+# Copy source files
+COPY . .
+
+# Build the application
+RUN npm run build
+
+# Production stage with nginx
 FROM nginx:alpine
-COPY . /usr/share/nginx/html/
-EXPOSE 80 
+
+# Copy built files from builder stage
+COPY --from=builder /app/dist /usr/share/nginx/html
+
+# Copy nginx configuration for SPA routing
+RUN echo 'server { \
+    listen 80; \
+    server_name _; \
+    root /usr/share/nginx/html; \
+    index index.html; \
+    \
+    # Gzip compression \
+    gzip on; \
+    gzip_vary on; \
+    gzip_min_length 1024; \
+    gzip_types text/plain text/css text/xml text/javascript application/x-javascript application/xml+rss application/json application/javascript; \
+    \
+    # SPA routing - serve index.html for all routes \
+    location / { \
+        try_files $uri $uri/ /index.html; \
+    } \
+    \
+    # Cache static assets \
+    location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot)$ { \
+        expires 1y; \
+        add_header Cache-Control "public, immutable"; \
+    } \
+}' > /etc/nginx/conf.d/default.conf
+
+EXPOSE 80
+
+CMD ["nginx", "-g", "daemon off;"]

README.md

@@ -0,0 +1,108 @@
+# Watchflow Landing Page
+
+Modern React/TypeScript implementation of the Watchflow landing page with improved UX, better state management, and type safety.
+
+## Features
+
+- ✅ **Repository Analysis**: Analyze any GitHub repository and get agentic guardrail recommendations
+- ✅ **Rule Feasibility Check**: Validate if natural language rules can be implemented
+- ✅ **Token Management**: Optional GitHub token for higher rate limits and private repos
+- ✅ **PR Creation**: One-click PR creation with generated rules
+- ✅ **Mock Analysis**: Example analysis for demonstration
+- ✅ **Responsive Design**: Works on all screen sizes
+
+## Tech Stack
+
+- **React 18** with TypeScript
+- **Vite** for fast builds and HMR
+- **Tailwind CSS** for styling
+- **Lucide Icons** for consistent iconography
+- **shadcn/ui** components
+
+## Development
+
+### Prerequisites
+
+- Node.js 20+ 
+- npm or bun
+
+### Setup
+
+```bash
+# Install dependencies
+npm install --legacy-peer-deps
+
+# Start dev server
+npm run dev
+
+# Build for production
+npm run build
+
+# Preview production build
+npm run preview
+```
+
+The app will be available at `http://localhost:8080`
+
+## API Configuration
+
+The app automatically detects the environment:
+
+- **localhost/127.0.0.1**: Uses `http://localhost:8000/api/v1` (default for local dev)
+- **Production**: Uses `https://api.watchflow.dev/api/v1` (when not on localhost)
+- **Custom**: Override with `VITE_API_BASE` environment variable
+
+### Using .env file
+
+Create a `.env` file in the root directory to set a custom backend URL:
+
+```bash
+# .env
+VITE_API_BASE=http://localhost:8000/api/v1
+```
+
+Or for different ports or ngrok:
+```bash
+# .env
+VITE_API_BASE=http://localhost:3000/api/v1
+# or
+VITE_API_BASE=https://your-ngrok-url.ngrok-free.app/api/v1
+```
+
+**Note**: Vite only exposes environment variables prefixed with `VITE_` to the client. See `.env.example` for a template.
+
+## Deployment
+
+The project includes a Helm chart for Kubernetes deployment and a GitHub Actions workflow for automated deployment to EKS.
+
+### Quick Deploy
+
+```bash
+# Build Docker image
+docker build -t watchflow-landing:latest .
+
+# Test locally
+docker run -p 8080:80 watchflow-landing:latest
+
+# Deploy to EKS (see helm-chart/ directory)
+```
+
+## Project Structure
+
+```
+watchflow-landing/
+├── src/
+│   ├── components/       # React components
+│   ├── hooks/           # Custom React hooks
+│   ├── pages/           # Page components
+│   ├── utils/           # Utility functions
+│   └── lib/             # Shared libraries
+├── public/              # Static assets
+├── helm-chart/          # Kubernetes Helm chart
+├── .github/workflows/   # CI/CD workflows
+└── Dockerfile           # Multi-stage Docker build
+```
+
+## License
+
+See parent repository for license information.

components.json

@@ -0,0 +1,20 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "default",
+  "rsc": false,
+  "tsx": true,
+  "tailwind": {
+    "config": "tailwind.config.ts",
+    "css": "src/index.css",
+    "baseColor": "slate",
+    "cssVariables": true,
+    "prefix": ""
+  },
+  "aliases": {
+    "components": "@/components",
+    "utils": "@/lib/utils",
+    "ui": "@/components/ui",
+    "lib": "@/lib",
+    "hooks": "@/hooks"
+  }
+}

eslint.config.js

@@ -0,0 +1,26 @@
+import js from "@eslint/js";
+import globals from "globals";
+import reactHooks from "eslint-plugin-react-hooks";
+import reactRefresh from "eslint-plugin-react-refresh";
+import tseslint from "typescript-eslint";
+
+export default tseslint.config(
+  { ignores: ["dist"] },
+  {
+    extends: [js.configs.recommended, ...tseslint.configs.recommended],
+    files: ["**/*.{ts,tsx}"],
+    languageOptions: {
+      ecmaVersion: 2020,
+      globals: globals.browser,
+    },
+    plugins: {
+      "react-hooks": reactHooks,
+      "react-refresh": reactRefresh,
+    },
+    rules: {
+      ...reactHooks.configs.recommended.rules,
+      "react-refresh/only-export-components": ["warn", { allowConstantExport: true }],
+      "@typescript-eslint/no-unused-vars": "off",
+    },
+  },
+);