|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>Duplicate Detection API Tester</title> |
|
|
<style> |
|
|
body { |
|
|
font-family: Arial, sans-serif; |
|
|
max-width: 1200px; |
|
|
margin: 0 auto; |
|
|
padding: 20px; |
|
|
background-color: #f5f5f5; |
|
|
} |
|
|
.container { |
|
|
background: white; |
|
|
padding: 30px; |
|
|
border-radius: 8px; |
|
|
box-shadow: 0 2px 4px rgba(0,0,0,0.1); |
|
|
margin-bottom: 20px; |
|
|
} |
|
|
h1 { |
|
|
color: #333; |
|
|
border-bottom: 3px solid #4CAF50; |
|
|
padding-bottom: 10px; |
|
|
} |
|
|
h2 { |
|
|
color: #555; |
|
|
margin-top: 0; |
|
|
} |
|
|
.endpoint { |
|
|
background: #f9f9f9; |
|
|
padding: 15px; |
|
|
border-left: 4px solid #4CAF50; |
|
|
margin: 15px 0; |
|
|
border-radius: 4px; |
|
|
} |
|
|
.url { |
|
|
background: #e8f5e9; |
|
|
padding: 10px; |
|
|
border-radius: 4px; |
|
|
font-family: monospace; |
|
|
word-break: break-all; |
|
|
margin: 10px 0; |
|
|
} |
|
|
a { |
|
|
color: #4CAF50; |
|
|
text-decoration: none; |
|
|
font-weight: bold; |
|
|
} |
|
|
a:hover { |
|
|
text-decoration: underline; |
|
|
} |
|
|
button { |
|
|
background: #4CAF50; |
|
|
color: white; |
|
|
border: none; |
|
|
padding: 10px 20px; |
|
|
border-radius: 4px; |
|
|
cursor: pointer; |
|
|
font-size: 14px; |
|
|
margin: 5px; |
|
|
} |
|
|
button:hover { |
|
|
background: #45a049; |
|
|
} |
|
|
#result { |
|
|
background: #f5f5f5; |
|
|
padding: 15px; |
|
|
border-radius: 4px; |
|
|
margin-top: 15px; |
|
|
max-height: 500px; |
|
|
overflow-y: auto; |
|
|
font-family: monospace; |
|
|
font-size: 12px; |
|
|
white-space: pre-wrap; |
|
|
} |
|
|
.success { |
|
|
color: #4CAF50; |
|
|
font-weight: bold; |
|
|
} |
|
|
.error { |
|
|
color: #f44336; |
|
|
font-weight: bold; |
|
|
} |
|
|
.info { |
|
|
color: #2196F3; |
|
|
} |
|
|
.suggestion-item { |
|
|
background: white; |
|
|
padding: 10px; |
|
|
margin: 10px 0; |
|
|
border-radius: 4px; |
|
|
border-left: 3px solid #4CAF50; |
|
|
} |
|
|
.suggestion-item h4 { |
|
|
margin: 0 0 10px 0; |
|
|
color: #333; |
|
|
} |
|
|
.suggestion-item p { |
|
|
margin: 5px 0; |
|
|
color: #666; |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body> |
|
|
<div class="container"> |
|
|
<h1>🔍 Duplicate Detection API Tester</h1> |
|
|
<p class="info">Test the Duplicate Transaction Detection API directly from your browser</p> |
|
|
</div> |
|
|
|
|
|
<div class="container"> |
|
|
<h2>1. Health Check Endpoint</h2> |
|
|
<div class="endpoint"> |
|
|
<strong>Endpoint:</strong> GET /health |
|
|
<div class="url"> |
|
|
<a href="https://LogicGoInfotechSpaces-duplicate-transaction-detection.hf.space/health" target="_blank"> |
|
|
https://LogicGoInfotechSpaces-duplicate-transaction-detection.hf.space/health |
|
|
</a> |
|
|
</div> |
|
|
<button onclick="testHealth()">Test Health Endpoint</button> |
|
|
<div id="healthResult"></div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="container"> |
|
|
<h2>2. Suggestions Endpoint</h2> |
|
|
<div class="endpoint"> |
|
|
<strong>Endpoint:</strong> GET /suggestions |
|
|
<div class="url"> |
|
|
<a href="https://LogicGoInfotechSpaces-duplicate-transaction-detection.hf.space/suggestions?limit=5" target="_blank"> |
|
|
https://LogicGoInfotechSpaces-duplicate-transaction-detection.hf.space/suggestions?limit=5 |
|
|
</a> |
|
|
</div> |
|
|
<label> |
|
|
Limit: |
|
|
<input type="number" id="limitInput" value="5" min="1" max="500" style="width: 60px; padding: 5px;"> |
|
|
</label> |
|
|
<button onclick="testSuggestions()">Test Suggestions Endpoint</button> |
|
|
<div id="suggestionsResult"></div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="container"> |
|
|
<h2>3. Quick Links</h2> |
|
|
<div class="endpoint"> |
|
|
<p><strong>Direct Browser Links:</strong></p> |
|
|
<ul> |
|
|
<li> |
|
|
<a href="https://LogicGoInfotechSpaces-duplicate-transaction-detection.hf.space/health" target="_blank"> |
|
|
Health Check |
|
|
</a> |
|
|
</li> |
|
|
<li> |
|
|
<a href="https://LogicGoInfotechSpaces-duplicate-transaction-detection.hf.space/suggestions" target="_blank"> |
|
|
All Suggestions (default limit: 50) |
|
|
</a> |
|
|
</li> |
|
|
<li> |
|
|
<a href="https://LogicGoInfotechSpaces-duplicate-transaction-detection.hf.space/suggestions?limit=10" target="_blank"> |
|
|
10 Suggestions |
|
|
</a> |
|
|
</li> |
|
|
<li> |
|
|
<a href="https://LogicGoInfotechSpaces-duplicate-transaction-detection.hf.space/suggestions?limit=5" target="_blank"> |
|
|
5 Suggestions |
|
|
</a> |
|
|
</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<script> |
|
|
const BASE_URL = 'https://LogicGoInfotechSpaces-duplicate-transaction-detection.hf.space'; |
|
|
|
|
|
async function testHealth() { |
|
|
const resultDiv = document.getElementById('healthResult'); |
|
|
resultDiv.innerHTML = '<p class="info">Testing...</p>'; |
|
|
|
|
|
try { |
|
|
const response = await fetch(`${BASE_URL}/health`); |
|
|
const data = await response.json(); |
|
|
|
|
|
if (response.ok) { |
|
|
resultDiv.innerHTML = ` |
|
|
<div class="success">✓ Health Check Successful!</div> |
|
|
<div id="result">${JSON.stringify(data, null, 2)}</div> |
|
|
`; |
|
|
} else { |
|
|
resultDiv.innerHTML = ` |
|
|
<div class="error">✗ Error: ${response.status}</div> |
|
|
<div id="result">${JSON.stringify(data, null, 2)}</div> |
|
|
`; |
|
|
} |
|
|
} catch (error) { |
|
|
resultDiv.innerHTML = ` |
|
|
<div class="error">✗ Request Failed</div> |
|
|
<div id="result">Error: ${error.message}</div> |
|
|
`; |
|
|
} |
|
|
} |
|
|
|
|
|
async function testSuggestions() { |
|
|
const resultDiv = document.getElementById('suggestionsResult'); |
|
|
const limit = document.getElementById('limitInput').value; |
|
|
resultDiv.innerHTML = '<p class="info">Loading suggestions...</p>'; |
|
|
|
|
|
try { |
|
|
const response = await fetch(`${BASE_URL}/suggestions?limit=${limit}`); |
|
|
const data = await response.json(); |
|
|
|
|
|
if (response.ok) { |
|
|
let html = ` |
|
|
<div class="success">✓ Success! Found ${data.length} suggestions</div> |
|
|
`; |
|
|
|
|
|
if (data.length > 0) { |
|
|
html += '<h3>Sample Suggestions:</h3>'; |
|
|
data.slice(0, 3).forEach((suggestion, index) => { |
|
|
html += ` |
|
|
<div class="suggestion-item"> |
|
|
<h4>Suggestion ${index + 1}</h4> |
|
|
<p><strong>ID:</strong> ${suggestion._id}</p> |
|
|
<p><strong>Candidates:</strong> ${suggestion.candidate_ids.length} transaction(s)</p> |
|
|
<p><strong>Amount Delta:</strong> ${suggestion.details.amount_delta_pct.toFixed(2)}%</p> |
|
|
<p><strong>Time Delta:</strong> ${suggestion.details.time_delta_minutes.toFixed(2)} minutes</p> |
|
|
<p><strong>Merchant Match:</strong> ${suggestion.details.merchant_match_rule}</p> |
|
|
<p><strong>Status:</strong> ${suggestion.status}</p> |
|
|
<p><strong>Generated:</strong> ${suggestion.audit.generated_at}</p> |
|
|
</div> |
|
|
`; |
|
|
}); |
|
|
|
|
|
html += `<div id="result" style="margin-top: 15px;">${JSON.stringify(data, null, 2)}</div>`; |
|
|
} else { |
|
|
html += '<p class="info">No suggestions found yet. The scheduler may need more time.</p>'; |
|
|
} |
|
|
|
|
|
resultDiv.innerHTML = html; |
|
|
} else { |
|
|
resultDiv.innerHTML = ` |
|
|
<div class="error">✗ Error: ${response.status}</div> |
|
|
<div id="result">${JSON.stringify(data, null, 2)}</div> |
|
|
`; |
|
|
} |
|
|
} catch (error) { |
|
|
resultDiv.innerHTML = ` |
|
|
<div class="error">✗ Request Failed</div> |
|
|
<div id="result">Error: ${error.message}</div> |
|
|
`; |
|
|
} |
|
|
} |
|
|
</script> |
|
|
</body> |
|
|
</html> |
|
|
|
|
|
|
