# Flow Table Extractor
**For Chrome Users**
This step-by-step guide shows you how to install and use the Flow Table Extractor extension.
---
## ๐ฅ Installation (One-Time Setup)
### Step 1: Download the Extension
1. Download `flow-table-extractor.zip`
2. Unzip the file to a folder on your computer
3. Remember where you saved it!
### Step 2: Install in Chrome
**Open Chrome Extensions Page:**
1. Open Chrome browser
2. Type in address bar: `chrome://extensions/`
3. Press Enter
!\[Extensions Page\](Or navigate: Menu (โฎ) โ Extensions โ Manage Extensions)
**Enable Developer Mode:**
1. Look at the top-right corner
2. Find the toggle switch "Developer mode"
3. Turn it ON (it should turn blue)
**Load the Extension:**
1. Click "Load unpacked" button (top-left)
2. Navigate to the `flow-table-extractor` folder you unzipped
3. Click "Select Folder"
**Success!**
You should see the Flow Table Extractor card appear:
- Green "FT" icon
- Name: "Flow Table Extractor"
- Status: ON (blue toggle)
### Step 3: Pin the Extension (Recommended)
1. Click the puzzle piece icon (๐งฉ) in Chrome toolbar
2. Find "Flow Table Extractor"
3. Click the pin icon (๐) next to it
4. The green "FT" icon will now appear in your toolbar
---
## โ๏ธ Configuration (One-Time Setup)
### Step 4: Configure Your Credentials
**Open the Extension:**
1. Click the green "FT" icon in your Chrome toolbar
2. The Flow Table Extractor popup opens
**Configure Credentials:**
1. Click the button: **"Configure Flow Credentials"**
2. A form appears with three fields
**Fill in the Form:**
```
โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ
โ Flow Username: โ
โ [your-flow-username____________] โ
โ โ
โ Flow Password: โ
โ [โขโขโขโขโขโขโขโขโขโขโขโขโขโขโขโขโขโขโขโขโขโขโขโขโขโข] โ
โ โ
โ Claude API Key (optional): โ
โ [sk-ant-api-key-here__________] โ
โ For smart table parsing... โ
โ โ
โ [Save All Credentials] โ
โ [Cancel] โ
โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ
```
**Field 1: Flow Username**
- Enter your Flow Immersive username
- Use your USERNAME, not email
- Example: `john` (not `john@company.com`)
**Field 2: Flow Password**
- Enter your Flow Immersive password
- This is the password you use to login at a.flow.gl
**Field 3: Claude API Key (Optional)**
- Leave blank if you don't have one
- Or enter your Claude API key for smart table parsing
- Example: `sk-ant-api03-abc123...`
- Get one at: [https://console.anthropic.com/](https://console.anthropic.com/)
**Save:**
1. Click **"Save All Credentials"**
2. You should see: "โ All credentials saved securely!"
3. Credentials are saved and you'll never need to enter them again!
### What is Claude API Key?
**Claude AI** helps parse complex tables with:
- Multi-row headers
- Merged cells
- Nested structures
**Do you need it?**
- โ No - for simple tables (most tables)
- โ Yes - for Wikipedia-style complex tables
- โ Yes - for financial reports with grouped columns
**Cost:** ~$0.01-0.03 per table (1-3 cents)
**How to get one:**
1. Go to [https://console.anthropic.com/](https://console.anthropic.com/)
2. Sign up (free)
3. Go to "API Keys"
4. Click "Create Key"
5. Copy the key (starts with `sk-ant-`)
6. Paste into the extension
---
## ๐ Using the Extension
### Step 5: Navigate to a Page with Tables
**Examples of good pages:**
- Wikipedia data tables
- Financial reports
- Product comparison pages
- Any page with HTML tables
**Example:**
1. Go to Wikipedia
2. Search for "List of countries by population"
3. You'll see tables with data
### Step 6: Open the Extension
Click the green **"FT"** icon in your toolbar.
The popup shows:
```
โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ
โ [FLOW] Table Extractor [๐ Docs] โ
โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโค
โ โ
โ Select Table: [Table 1: Country... โผ] โ
โ 3 table(s) found โ
โ โ
โ Dataset Title: [My Dataset_______] โ
โ โ
โ โ Use Claude AI for smart parsing โ
โ โ
โ [Extract & Upload to Flow] โ
โ [Configure Flow Credentials] โ
โ โ
โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโค
โ Flow Immersive, Inc. โ
โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ
```
### Step 7: Select a Table
**Table Dropdown:**
- Shows all tables found on the page
- Preview format: "Table 1: FirstColumn, SecondColumn... (X rows)"
- Click dropdown to see all available tables
- Select the table you want to extract
**No tables found?**
- The page doesn't have HTML `` elements
- Try a different page
### Step 8: Enter Dataset Title
**In the "Dataset Title" field:**
- Enter a descriptive name for your data
- Examples:
- `Country Population 2024`
- `Q4 Sales Data`
- `Product Comparison`
- Make it clear and memorable!
**Version Control:**
- If you use the same title again, Flow creates a new version
- Useful for tracking changes over time
### Step 9: Choose Parsing Mode (Optional)
**Checkbox: "Use Claude AI for smart table parsing"**
**When to check this box:**
- โ๏ธ Table has multi-row headers
- โ๏ธ Table has merged cells
- โ๏ธ Complex Wikipedia-style tables
- โ๏ธ Financial reports with nested columns
**When to leave unchecked:**
- โ Simple tables (one header row)
- โ You don't have a Claude API key
- โ You want fastest extraction
**Example tables that need Claude:**
```
Simple table (no Claude needed):
โโโโโโโโโโโโฌโโโโโโโโโโโฌโโโโโโโโโโโ
โ Country โ Populationโ Area โ
โโโโโโโโโโโโผโโโโโโโโโโโผโโโโโโโโโโโค
โ USA โ 331M โ 9.8M โ
โโโโโโโโโโโโดโโโโโโโโโโโดโโโโโโโโโโโ
Complex table (use Claude):
โโโโโโโโโโโโฌโโโโโโโโโโโโโโโโโโโโโโโ
โ Country โ Statistics โ
โ โโโโโโโโโโโโฌโโโโโโโโโโโโค
โ โ 2023 โ 2024 โ
โ โโโโโโฌโโโโโโผโโโโโฌโโโโโโโค
โ โPop โArea โPop โArea โ
โโโโโโโโโโโโผโโโโโผโโโโโโผโโโโโผโโโโโโโค
โ USA โ331Mโ9.8M โ334Mโ9.8M โ
โโโโโโโโโโโโดโโโโโดโโโโโโดโโโโโดโโโโโโโ
```
### Step 10: Extract!
Click the big green button: **"Extract & Upload to Flow"**
**What happens:**
**Status message appears:**
- Without Claude: "Uploading to Flow..."
- With Claude: "Analyzing table with Claude AI..."
**Processing time:**
- Simple tables: 2-5 seconds
- With Claude AI: 5-10 seconds
**Success message:**
```
โ Success! Uploaded 150 rows to Flow
dataset "Country Population 2024"
```
**Error message (if something goes wrong):**
```
๐ Flow Authentication Failed
Details: Invalid username or password.
๐ก Suggestion: Update your Flow credentials
in "Configure Flow Credentials".
```
### Step 11: View in Flow
1. Go to Flow Immersive (a.flow.gl)
2. Navigate to a Flow and your datasets via the Manage Datasets button
3. Find the dataset by the title you entered
---
## ๐ก Tips & Tricks
### Tip 1: Test Your Credentials
If you're getting authentication errors:
**Quick Test:**
1. Go to a.flow.gl
2. Try logging in with your credentials
3. If it works there but not in the extension:
- Make sure you're using USERNAME (not email)
- Re-enter credentials in the extension
### Tip 2: Documentation Button
Click the blue **"๐ Docs"** button in the extension header to:
- Read detailed documentation
- See troubleshooting guides
- Learn advanced features
### Tip 3: Multiple Tables
If a page has many tables:
1. Extract them one at a time
2. Use different dataset titles
3. Or use the same title for versions
### Tip 4: Complex Tables
Wikipedia tables often have complex structures:
1. Check "Use Claude AI"
2. Takes a bit longer
3. Much better results!
**Example:** "List of largest companies" on Wikipedia
---
## ๐ง Troubleshooting
### Problem: "Cannot connect to backend server"
**Solution:** The backend server is hosted and should always be running. If you see this error:
1. Wait a moment and try again
2. Check your internet connection
3. Contact Flow if problem persists
### Problem: "Flow Authentication Failed"
**Cause:** Wrong username or password
**Solution:**
1. Click "Configure Flow Credentials"
2. Make sure you're using:
- USERNAME (not email)
- Correct password
3. Test login at flowimmersive.com first
4. Re-enter credentials and save
### Problem: Claude AI checkbox is grayed out
**Cause:** No Claude API key configured
**Solution:**
1. Click "Configure Flow Credentials"
2. Add your Claude API key
3. Save
4. Checkbox will become available
### Problem: Upload is slow
**Normal speeds:**
- Simple tables: 2-5 seconds
- Claude AI parsing: 5-10 seconds
- Very large tables: up to 30 seconds
**If slower:**
- Check your internet connection
- Wait for timeout message
- Try again
---
## ๐ Common Workflows
### Workflow 1: Quick Wikipedia Data Extract
1. Go to Wikipedia article with data
2. Click "FT" icon
3. Select table from dropdown
4. Enter title: `Wikipedia - [Topic Name]`
5. Leave Claude unchecked (try it first)
6. Click "Extract & Upload to Flow"
7. If table looks messy in Flow:
- Try again with "Use Claude AI" checked
### Workflow 2: Complex Financial Table
1. Navigate to financial report website
2. Find the data table
3. Click "FT" icon
4. Select table
5. Enter title: `Q4 2024 Financial Report`
6. โ Check "Use Claude AI" (complex table!)
7. Click "Extract & Upload to Flow"
8. Wait 5-10 seconds
9. View perfectly formatted data in Flow!
### Workflow 3: Regular Data Updates
Same dataset, multiple versions:
1. Extract table from website
2. Use same dataset title each time
3. Example: `Weekly Sales Report`
4. Flow creates new version automatically
5. Track changes over time!
---
## โ
Setup Checklist
Before using the extension:
- [ ] Downloaded and unzipped extension
- [ ] Installed in Chrome (chrome://extensions/)
- [ ] Enabled Developer mode
- [ ] Pinned extension to toolbar
- [ ] Configured Flow credentials
- [ ] (Optional) Added Claude API key
- [ ] Tested on a simple table
**You're ready to extract tables!** ๐
---
## ๐ Pro User Tips
### Dataset Organization
Use consistent naming:
- `Company - Data Type - Date`
- Example: `Acme Corp - Sales - 2024-Q4`
### Claude AI Usage
Save money:
1. Try without Claude first
2. If table is messy โ Use Claude
3. Simple tables don't need it!
### Version Control
Track data over time:
1. Use same title weekly/monthly
2. Flow creates versions automatically
3. Compare changes in Flow
---
**Happy Table Extracting!** ๐โจ