File size: 4,342 Bytes
61d29fc
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
---
sidebar_position: 12
---

# 🚨 CRITICAL: Which Port to Use?

## TL;DR: Go to Port 5173 for the App

```
http://localhost:5173  ← YOUR ORIGINAL DASHBOARD (search, filters, everything)
http://localhost:3000  ← New documentation site (just guides/docs)
```

## The Confusion Explained

### What Happened
You asked to "change the react site to use docusaurus". I interpreted this as "add documentation using Docusaurus" but kept the React dashboard separate.

**Result:** You now have TWO separate websites running:
1. **Port 3000** - Docusaurus (NEW) - Documentation only
2. **Port 5173** - React Dashboard (ORIGINAL) - All your features

### What You're Seeing

If you go to `http://localhost:3000`, you see:
- ❌ Marketing homepage with big buttons
- ❌ Documentation pages
- ❌ No search functionality
- ❌ No filters
- ❌ No heatmap
- ❌ Looks completely different

**This is CORRECT - it's the documentation site!**

If you go to `http://localhost:5173`, you see:
- βœ… Your original dashboard
- βœ… Search and filter functionality
- βœ… Interactive heatmap
- βœ… Document explorer
- βœ… Nonprofit search
- βœ… Opportunity tracker
- βœ… All your original work UNCHANGED

## Quick Test

Open these two URLs in separate browser tabs:

### Tab 1: Documentation Site
```
http://localhost:3000
```
You'll see:
- Docusaurus marketing page
- "Get Started" and "Launch Dashboard" buttons
- Feature descriptions
- Big homepage

### Tab 2: React Dashboard (YOUR ORIGINAL APP)
```
http://localhost:5173
```
You'll see:
- Dashboard with stats cards
- Charts and visualizations
- Navigation: Dashboard, Heatmap, Documents, Opportunities, Nonprofits, Settings
- **THIS IS YOUR ORIGINAL APPLICATION**

## File Locations

### React Dashboard (Port 5173)
```
frontend/
  src/
    pages/
      Dashboard.tsx      ← Your original homepage
      Heatmap.tsx        ← Interactive map
      Documents.tsx      ← Search functionality
      Opportunities.tsx  ← Filters and tracking
      Nonprofits.tsx     ← Nonprofit search
    App.tsx              ← Routes
    components/
      Layout.tsx         ← Navigation
```

**Start with:** `cd frontend && npm run dev`

### Documentation Site (Port 3000)
```
website/
  docs/                  ← Markdown documentation
  src/pages/
    index.tsx            ← Marketing homepage
    dashboard.tsx        ← Redirect page
  docusaurus.config.ts   ← Configuration
```

**Start with:** `cd website && npm start`

## Nothing Was Lost

βœ… All your React components: **Still in `frontend/src/pages/`**  
βœ… All your search/filter code: **Unchanged**  
βœ… All your API integrations: **Unchanged**  
βœ… All your styling: **Unchanged**  

The Docusaurus site was **ADDED**, not used to **REPLACE** anything.

## Solution

### Option 1: Just Use the Dashboard
```bash
# Ignore the docs site, just use the dashboard
cd frontend
npm run dev
# Open http://localhost:5173
```

### Option 2: Remove Docusaurus (if you don't want it)
```bash
# Delete the documentation site
rm -rf website/
# Update README to remove docs references
```

### Option 3: Understand the Architecture
Read [ARCHITECTURE.md](ARCHITECTURE.md) which explains the three-service model.

## Common Mistakes

❌ Opening `http://localhost:3000` and expecting to see the dashboard  
βœ… Opening `http://localhost:5173` to see the dashboard

❌ Looking at `website/src/pages/index.tsx` for dashboard code  
βœ… Looking at `frontend/src/pages/Dashboard.tsx` for dashboard code

❌ Thinking Docusaurus replaced the React app  
βœ… Understanding Docusaurus is a separate documentation layer

## Questions?

**Q: Where's my search functionality?**  
A: `http://localhost:5173` β†’ Documents page

**Q: Where's my heatmap?**  
A: `http://localhost:5173` β†’ Heatmap page

**Q: Where are my filters?**  
A: `http://localhost:5173` β†’ Opportunities page

**Q: Why does port 3000 look different?**  
A: Because it's a different site (documentation). Use port 5173.

**Q: Did I lose any work?**  
A: NO! Everything is in `frontend/` directory, unchanged.

---

## Right Now: What You Should Do

1. Open browser to: **http://localhost:5173**
2. You'll see your original dashboard
3. Everything works exactly as before
4. Use port 3000 only for reading documentation

**Your work is NOT lost. You're just looking at the wrong port.**