Understanding Protection States
Git tracks what changed. SnapBack understands who changed it and why.
Protection states capture rich context—cursor position, open files, AI tool metadata—giving you complete visibility into your development timeline.
In 2 minutes, you’ll experience SnapBack’s intelligence layer and understand why developers call it essential for AI-assisted coding.
What you’ll learn:
- How protection states capture context beyond just code
- How to navigate your development timeline
- How to explore changes with full AI attribution
What is a Protection State?
A protection state is more than a snapshot—it’s a rich capture of your development context:
📄 Code State
- • File contents at that moment
- • Cursor position and selection
- • Open files in your workspace
🤖 AI Context
- • Which AI tool made the change
- • AI contribution percentage
- • Detection confidence score
📊 Risk Intelligence
- • Pattern-based risk scoring
- • Historical file fragility
- • Detected issues (secrets, mocks)
🕐 Timeline Context
- • Session grouping
- • Time since last commit
- • Related changes across files
Try It: Your First Protection State
Create a Test File
In VS Code, create a new file called test-snapback.js:
// A simple shopping cart calculator
function calculateTotal(items) {
let total = 0;
for (const item of items) {
total += item.price * item.quantity;
}
return total;
}
// Test data
const cart = [
{ name: "Laptop", price: 999, quantity: 1 },
{ name: "Mouse", price: 25, quantity: 2 },
{ name: "Keyboard", price: 75, quantity: 1 }
];
console.log(`Total: $${calculateTotal(cart)}`);
// Expected: $1124Save the file. SnapBack just created your first protection state.
In the SnapBack sidebar:
📁 test-snapback.js
└── Just now (protection state created)Simulate an AI Change
Now imagine your AI assistant “optimized” the code. Replace the content with:
// "Refactored" by AI (has a subtle bug!)
const calculateTotal = (items) =>
items.reduce((acc, item) => acc + item.price * item.qty, 0);
// Test data
const cart = [
{ name: "Laptop", price: 999, quantity: 1 },
{ name: "Mouse", price: 25, quantity: 2 },
{ name: "Keyboard", price: 75, quantity: 1 }
];
console.log(`Total: $${calculateTotal(cart)}`);
// Expected: $1124
// Actual: $0 (AI renamed 'quantity' to 'qty')Save the file. SnapBack captured this change with AI attribution.
In the sidebar:
📁 test-snapback.js
└── Just now (AI-detected change ⚠️)
└── 30 seconds ago (your original)Notice the AI detection badge. SnapBack recognized the AI-generated pattern.
Navigate Your Timeline
Time to explore your development timeline:
-
Open the SnapBack sidebar
- Click the 🧢 SnapBack icon in VS Code’s activity bar
-
View your protection states
📁 test-snapback.js ├── Just now (AI-detected ⚠️) ← Current state └── 30 seconds ago ✓ ← Your original -
Click the earlier state to see the context view
- Side-by-side diff showing exactly what changed
- AI tool attribution (which assistant made the change)
- Risk indicators and pattern analysis
-
Navigate back by clicking “Apply State” or pressing
⌘+Enter- Your file returns to the selected state
- The AI-changed version remains in your timeline for reference
Done. You’ve navigated your development timeline with full context.
What Makes This Different from Git?
Git History
- • Tracks commits you explicitly make
- • Knows what changed (diffs)
- • Linear history
- • No AI awareness
SnapBack Timeline
- • Automatic protection on every save
- • Knows who changed it (AI vs human)
- • Graph-based timeline with sessions
- • Rich context (cursor, open files, AI metadata)
They work together. Use Git for version control and collaboration. Use SnapBack for understanding what your AI assistants are doing between commits.
Real-World Scenarios
Scenario 1: Multi-File AI Refactoring
Claude suggests: "Refactor this component library"
You accept it.
Changes:
├── Button.tsx (styling changes)
├── Input.tsx (API changes)
├── Form.tsx (prop renames)
└── utils/validation.ts (logic changes)With SnapBack: Navigate to the protection state before the refactor. Explore each file’s changes with full context. Apply only the changes you want to keep.
Scenario 2: Understanding AI Decisions
Copilot suggested converting a function to async.
Tests are failing. Why did it make this change?With SnapBack: The protection state shows Copilot’s contribution, the exact diff, and pattern analysis explaining what changed and why it might be risky.
Scenario 3: Comparing AI Tool Behavior
You use both Cursor and Copilot.
Which one works better for your codebase?With SnapBack: Filter protection states by AI tool. See which assistant causes more issues in specific files. Pattern learning tracks tool-specific risks over time.
Exploring Protection States
The Context View
When you select a protection state, SnapBack shows:
| Section | Information |
|---|---|
| Diff View | Side-by-side comparison of changes |
| AI Attribution | Which tool made the change, confidence score |
| Risk Analysis | Detected issues (secrets, mocks, phantom deps) |
| Session Context | Related changes in the same session |
| Timeline Position | Where this state fits in your development history |
Keyboard Shortcuts
| Action | Mac | Windows/Linux |
|---|---|---|
| Open SnapBack sidebar | ⌘+⇧+S | Ctrl+Shift+S |
| Navigate to state | ⌘+Enter | Ctrl+Enter |
| Toggle context view | ⌘+\ | Ctrl+\ |
| Compare with current | ⌘+Shift+C | Ctrl+Shift+C |
What’s Next?
🧠 How SnapBack Works
Understand the intelligence layer: detection, context capture, and pattern learning.
📈 Pattern Learning
How SnapBack learns your codebase risks and prevents repeated issues.
You’ve experienced SnapBack’s intelligence layer.
Protection states give you complete visibility into your AI-assisted development. Navigate your timeline, understand AI behavior, and work with confidence.