# Monorepo Frontend Applications

**Last Updated**: 2025-12-19  
**Status**: MANDATORY reference for all frontend development and deployment

---

## Overview

This project is a **monorepo** containing TWO separate frontend applications that serve different domains. AI agents MUST understand which app to modify based on the target domain.

---

## Application Mapping

| Domain | Local Directory | Server Path | Purpose |
|--------|-----------------|-------------|---------|
| **bronhouder.nl** | `/frontend/` | `/var/www/glam-frontend/` | Main GLAM ontology frontend, schema visualization |
| **archief.support** | `/apps/archief-assistent/` | `/var/www/archief-assistent/` | Archive assistant app, institution map |

---

## Directory Structure

```
/Users/kempersc/apps/glam/
├── frontend/                         # bronhouder.nl
│   ├── src/
│   │   ├── pages/
│   │   │   ├── MapPage.tsx          # Map for bronhouder.nl (different from archief.support!)
│   │   │   └── ...
│   │   ├── App.tsx
│   │   └── ...
│   ├── package.json
│   ├── vite.config.ts
│   └── dist/                         # Build output → /var/www/glam-frontend/
│
├── apps/
│   └── archief-assistent/            # archief.support
│       ├── src/
│       │   ├── pages/
│       │   │   ├── MapPage.tsx      # Map for archief.support
│       │   │   └── ...
│       │   ├── App.tsx
│       │   └── ...
│       ├── package.json
│       ├── vite.config.ts
│       └── dist/                     # Build output → /var/www/archief-assistent/
│
└── infrastructure/
    └── deploy.sh                     # Deployment script (currently only handles /frontend/)
```

---

## Deployment Commands

### Archief Assistent (archief.support)

```bash
# Build
cd /Users/kempersc/apps/glam/apps/archief-assistent
npm run build

# Deploy
rsync -avz --delete dist/ root@91.98.224.44:/var/www/archief-assistent/
```

### Main Frontend (bronhouder.nl)

```bash
# Build
cd /Users/kempersc/apps/glam/frontend
npm run build

# Deploy (use deploy script)
./infrastructure/deploy.sh --frontend

# Or manual rsync
rsync -avz --delete dist/ root@91.98.224.44:/var/www/glam-frontend/
```

---

## Common Mistakes to Avoid

### Mistake 1: Editing the Wrong MapPage

If user reports an issue with `archief.support/map`:

- **WRONG**: Edit `/frontend/src/pages/MapPage.tsx`
- **CORRECT**: Edit `/apps/archief-assistent/src/pages/MapPage.tsx`

### Mistake 2: Deploying to Wrong Directory

If deploying changes for archief.support:

- **WRONG**: `rsync dist/ root@91.98.224.44:/var/www/glam-frontend/`
- **CORRECT**: `rsync dist/ root@91.98.224.44:/var/www/archief-assistent/`

### Mistake 3: Using deploy.sh for Archief Assistent

The `infrastructure/deploy.sh` script currently only handles the main frontend. For archief-assistent, use manual rsync.

---

## Caddy Configuration

The server uses Caddy as web server. Both apps are configured in `/etc/caddy/Caddyfile`:

```bash
# View Caddy config
ssh root@91.98.224.44 "cat /etc/caddy/Caddyfile"

# Reload Caddy after config changes
ssh root@91.98.224.44 "systemctl reload caddy"
```

---

## Debug Logging

### Current Debug Logs (to be removed)

Debug logs were added during map troubleshooting on 2025-12-19:

**File**: `/apps/archief-assistent/src/pages/MapPage.tsx`
```javascript
console.log('[AA-MapPage] ...') // Remove these
```

**File**: `/apps/archief-assistent/src/App.tsx`
```javascript
console.log('[AA-App] ...')        // Remove these
console.log('[AA-AppContent] ...') // Remove these
```

### Removal Command

```bash
# Search for debug logs
grep -rn "\[AA-" apps/archief-assistent/src/

# Remove manually by editing the files
```

---

## Known Harmless Warnings

These MapLibre GL warnings appear in console but do NOT affect functionality:

| Warning | Cause | Action |
|---------|-------|--------|
| `Error in parsing value for 'user-select'. Declaration dropped.` | MapLibre GL CSS parsing | **Ignore** - cosmetic |
| `WebGL warning: texImage: Alpha-premult and y-flip are deprecated` | WebGL deprecation notice | **Ignore** - still works |

---

## Troubleshooting

### Map Not Displaying on archief.support

1. **Check correct file**: Ensure editing `/apps/archief-assistent/src/pages/MapPage.tsx`
2. **Check CSS**: Map container needs explicit dimensions or absolute positioning
3. **Check console**: Look for `[AA-MapPage]` logs (if debug enabled)
4. **Check network**: Verify tile requests to MapTiler

### Solution for Map Container CSS

The map container MUST have explicit dimensions. Using `height: 100%` in a flex column layout results in `height: 0`.

**Working CSS**:
```jsx
<Box sx={{ position: 'absolute', top: 0, left: 0, right: 0, bottom: 0, zIndex: 1 }}>
  <Map ... />
</Box>
```

**Broken CSS** (height becomes 0):
```jsx
<Box sx={{ width: '100%', height: '100%' }}>
  <Map ... />
</Box>
```

---

## Version History

| Date | Change |
|------|--------|
| 2025-12-19 | Initial documentation after archief.support map fix |