Step 1 – Open your rate‑limit data
First, grab your current usage and quota information directly from Perplexity.
- Make sure you are logged in to your Perplexity account in your browser.
- Open this link in a new tab:
Your browser will show a block of JSON text – this is your live rate‑limit data (how many messages, research runs, etc. you can use).
Select everything on that page (Ctrl/⌘ + A, then Ctrl/⌘ + C) to copy it.
Step 2 – Open your settings data
Next, fetch the details of your plan, file limits, connectors and preferences.
- Open this link in a new tab:
This page shows another JSON block containing your subscription details, file and page limits, and connector configuration.
Again, select all text on the page and copy it (Ctrl/⌘ + A, then Ctrl/⌘ + C).
Step 3 – Paste your data into the dashboard
You now have two JSON blocks: one for your rate limits and one for your account settings.
- Return to this page.
- Paste the rate‑limit JSON into the first input field.
- Paste the settings JSON into the second input field.
- Click “Visualize My Limits” to turn your raw data into a clean, interactive overview of your usage, quotas and connectors.
Your data is only used in your browser for visualization. You stay in full control of what you paste and share.
:root {
–bg-primary: #0a0a0f;
–bg-secondary: #12121a;
–bg-card: #1a1a24;
–bg-card-hover: #222230;
–text-primary: #ffffff;
–text-secondary: #a0a0b0;
–text-muted: #6b6b7b;
–accent-primary: #6366f1;
–accent-secondary: #8b5cf6;
–accent-success: #10b981;
–accent-warning: #f59e0b;
–accent-danger: #ef4444;
–accent-info: #3b82f6;
–border-color: #2a2a3a;
–shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
–shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, 0.4), 0 10px 10px -5px rgba(0, 0, 0, 0.3);
–radius: 12px;
–radius-sm: 8px;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: ‘Inter’, -apple-system, BlinkMacSystemFont, sans-serif;
background: var(–bg-primary);
color: var(–text-primary);
min-height: 100vh;
line-height: 1.6;
}
.container {
max-width: 1400px;
margin: 0 auto;
padding: 2rem;
}
/* Header */
.header {
text-align: center;
margin-bottom: 3rem;
padding: 2rem 0;
}
.header h1 {
font-size: 2.5rem;
font-weight: 700;
background: linear-gradient(135deg, var(–accent-primary), var(–accent-secondary));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
margin-bottom: 0.5rem;
}
.header p {
color: var(–text-secondary);
font-size: 1.1rem;
}
/* Input Section */
.input-section {
background: var(–bg-card);
border-radius: var(–radius);
padding: 2rem;
margin-bottom: 2rem;
border: 1px solid var(–border-color);
}
.input-header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 1rem;
}
.input-header h2 {
font-size: 1.25rem;
font-weight: 600;
display: flex;
align-items: center;
gap: 0.5rem;
}
.input-header h2::before {
content: “📋”;
}
.btn-group {
display: flex;
gap: 0.5rem;
}
.btn {
padding: 0.5rem 1rem;
border-radius: var(–radius-sm);
border: none;
font-size: 0.875rem;
font-weight: 500;
cursor: pointer;
transition: all 0.2s ease;
}
.btn-primary {
background: linear-gradient(135deg, var(–accent-primary), var(–accent-secondary));
color: white;
}
.btn-primary:hover {
transform: translateY(-1px);
box-shadow: 0 4px 12px rgba(99, 102, 241, 0.4);
}
.btn-secondary {
background: var(–bg-secondary);
color: var(–text-primary);
border: 1px solid var(–border-color);
}
.btn-secondary:hover {
background: var(–bg-card-hover);
}
.json-input {
width: 100%;
min-height: 200px;
background: var(–bg-secondary);
border: 1px solid var(–border-color);
border-radius: var(–radius-sm);
padding: 1rem;
color: var(–text-primary);
font-family: ‘JetBrains Mono’, ‘Fira Code’, monospace;
font-size: 0.875rem;
resize: vertical;
transition: border-color 0.2s ease;
}
.json-input:focus {
outline: none;
border-color: var(–accent-primary);
}
.json-input::placeholder {
color: var(–text-muted);
}
/* Dashboard Grid */
.dashboard {
display: none;
animation: fadeIn 0.5s ease;
}
.dashboard.active {
display: block;
}
@keyframes fadeIn {
from { opacity: 0; transform: translateY(20px); }
to { opacity: 1; transform: translateY(0); }
}
/* Section Headers */
.section-header {
display: flex;
align-items: center;
gap: 0.75rem;
margin: 2rem 0 1rem 0;
padding-bottom: 0.75rem;
border-bottom: 1px solid var(–border-color);
}
.section-header h2 {
font-size: 1.5rem;
font-weight: 600;
}
.section-icon {
width: 40px;
height: 40px;
border-radius: var(–radius-sm);
display: flex;
align-items: center;
justify-content: center;
font-size: 1.25rem;
}
.icon-purple { background: rgba(99, 102, 241, 0.2); }
.icon-green { background: rgba(16, 185, 129, 0.2); }
.icon-blue { background: rgba(59, 130, 246, 0.2); }
.icon-orange { background: rgba(245, 158, 11, 0.2); }
.icon-red { background: rgba(239, 68, 68, 0.2); }
/* Cards Grid */
.cards-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
gap: 1.5rem;
margin-bottom: 2rem;
}
.card {
background: var(–bg-card);
border-radius: var(–radius);
padding: 1.5rem;
border: 1px solid var(–border-color);
transition: all 0.3s ease;
position: relative;
overflow: hidden;
}
.card::before {
content: ”;
position: absolute;
top: 0;
left: 0;
right: 0;
height: 3px;
background: linear-gradient(90deg, var(–accent-primary), var(–accent-secondary));
opacity: 0;
transition: opacity 0.3s ease;
}
.card:hover {
transform: translateY(-4px);
box-shadow: var(–shadow-lg);
border-color: var(–accent-primary);
}
.card:hover::before {
opacity: 1;
}
.card-header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 1rem;
}
.card-title {
font-size: 0.875rem;
font-weight: 500;
color: var(–text-secondary);
text-transform: uppercase;
letter-spacing: 0.05em;
}
.card-badge {
padding: 0.25rem 0.75rem;
border-radius: 9999px;
font-size: 0.75rem;
font-weight: 600;
}
.badge-success {
background: rgba(16, 185, 129, 0.2);
color: var(–accent-success);
}
.badge-warning {
background: rgba(245, 158, 11, 0.2);
color: var(–accent-warning);
}
.badge-danger {
background: rgba(239, 68, 68, 0.2);
color: var(–accent-danger);
}
.badge-info {
background: rgba(59, 130, 246, 0.2);
color: var(–accent-info);
}
.card-value {
font-size: 2rem;
font-weight: 700;
margin-bottom: 0.5rem;
}
.card-description {
font-size: 0.875rem;
color: var(–text-muted);
}
/* Progress Bar */
.progress-container {
margin-top: 1rem;
}
.progress-header {
display: flex;
justify-content: space-between;
font-size: 0.75rem;
color: var(–text-muted);
margin-bottom: 0.5rem;
}
.progress-bar {
height: 8px;
background: var(–bg-secondary);
border-radius: 9999px;
overflow: hidden;
}
.progress-fill {
height: 100%;
border-radius: 9999px;
transition: width 0.5s ease;
}
.progress-success { background: linear-gradient(90deg, var(–accent-success), #34d399); }
.progress-warning { background: linear-gradient(90deg, var(–accent-warning), #fbbf24); }
.progress-danger { background: linear-gradient(90deg, var(–accent-danger), #f87171); }
.progress-info { background: linear-gradient(90deg, var(–accent-info), #60a5fa); }
/* Sources Table */
.sources-table {
width: 100%;
border-collapse: collapse;
background: var(–bg-card);
border-radius: var(–radius);
overflow: hidden;
border: 1px solid var(–border-color);
}
.sources-table th,
.sources-table td {
padding: 1rem 1.5rem;
text-align: left;
}
.sources-table th {
background: var(–bg-secondary);
font-weight: 600;
font-size: 0.875rem;
color: var(–text-secondary);
text-transform: uppercase;
letter-spacing: 0.05em;
}
.sources-table tr {
border-bottom: 1px solid var(–border-color);
}
.sources-table tr:last-child {
border-bottom: none;
}
.sources-table td {
font-size: 0.875rem;
}
.source-name {
display: flex;
align-items: center;
gap: 0.75rem;
}
.source-icon {
width: 32px;
height: 32px;
border-radius: var(–radius-sm);
background: var(–bg-secondary);
display: flex;
align-items: center;
justify-content: center;
font-size: 1rem;
}
.limit-value {
font-weight: 600;
}
.limit-unlimited {
color: var(–accent-success);
}
.limit-zero {
color: var(–accent-danger);
}
.limit-normal {
color: var(–text-primary);
}
/* Connectors Grid */
.connectors-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 1rem;
}
.connector-card {
background: var(–bg-card);
border-radius: var(–radius-sm);
padding: 1rem;
border: 1px solid var(–border-color);
display: flex;
align-items: center;
gap: 1rem;
}
.connector-status {
width: 12px;
height: 12px;
border-radius: 50%;
flex-shrink: 0;
}
.status-connected {
background: var(–accent-success);
box-shadow: 0 0 8px var(–accent-success);
}
.status-disconnected {
background: var(–text-muted);
}
.connector-info {
flex: 1;
}
.connector-name {
font-weight: 500;
font-size: 0.875rem;
}
.connector-type {
font-size: 0.75rem;
color: var(–text-muted);
}
/* Error Message */
.error-message {
background: rgba(239, 68, 68, 0.1);
border: 1px solid var(–accent-danger);
border-radius: var(–radius-sm);
padding: 1rem;
margin-top: 1rem;
color: var(–accent-danger);
display: none;
}
.error-message.active {
display: block;
}
/* Empty State */
.empty-state {
text-align: center;
padding: 4rem 2rem;
color: var(–text-muted);
}
.empty-state-icon {
font-size: 4rem;
margin-bottom: 1rem;
opacity: 0.5;
}
/* Responsive */
@media (max-width: 768px) {
.container {
padding: 1rem;
}
.header h1 {
font-size: 1.75rem;
}
.cards-grid {
grid-template-columns: 1fr;
}
.sources-table {
font-size: 0.75rem;
}
.sources-table th,
.sources-table td {
padding: 0.75rem;
}
.input-header {
flex-direction: column;
gap: 1rem;
align-items: flex-start;
}
}
/* Animations */
@keyframes pulse {
0%, 100% { opacity: 1; }
50% { opacity: 0.5; }
}
.pulse {
animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
/* Scrollbar */
::-webkit-scrollbar {
width: 8px;
height: 8px;
}
::-webkit-scrollbar-track {
background: var(–bg-secondary);
}
::-webkit-scrollbar-thumb {
background: var(–border-color);
border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
background: var(–text-muted);
}
| Source |
Monthly Limit |
Remaining |
Status |
📊
No Data to Display
Paste your JSON data above and click “Parse Data” to visualize your limits
// Example data
const example1 = `{“model_specific_limits”:{},”remaining_agentic_research”:0,”remaining_labs”:24,”remaining_pro”:600,”remaining_research”:20,”sources”:{“source_to_limit”:{“asana_mcp_merge”:{“monthly_limit”:null,”remaining”:null},”box”:{“monthly_limit”:0,”remaining”:0},”cbinsights_mcp_cashmere”:{“monthly_limit”:5,”remaining”:5},”confluence_mcp_merge”:{“monthly_limit”:null,”remaining”:null},”crunchbase”:{“monthly_limit”:0,”remaining”:0},”dropbox”:{“monthly_limit”:null,”remaining”:null},”factset”:{“monthly_limit”:0,”remaining”:0},”gcal”:{“monthly_limit”:null,”remaining”:null},”github_mcp_direct”:{“monthly_limit”:null,”remaining”:null},”google_drive”:{“monthly_limit”:null,”remaining”:null},”jira_mcp_merge”:{“monthly_limit”:null,”remaining”:null},”linear_alt”:{“monthly_limit”:null,”remaining”:null},”microsoft_teams_mcp_merge”:{“monthly_limit”:null,”remaining”:null},”notion_mcp”:{“monthly_limit”:null,”remaining”:null},”onedrive”:{“monthly_limit”:0,”remaining”:0},”org”:{“monthly_limit”:0,”remaining”:0},”outlook”:{“monthly_limit”:null,”remaining”:null},”pitchbook_mcp_cashmere”:{“monthly_limit”:5,”remaining”:5},”scholar”:{“monthly_limit”:null,”remaining”:null},”sharepoint”:{“monthly_limit”:0,”remaining”:0},”slack_direct”:{“monthly_limit”:null,”remaining”:null},”social”:{“monthly_limit”:null,”remaining”:null},”statista_mcp_cashmere”:{“monthly_limit”:5,”remaining”:5},”web”:{“monthly_limit”:null,”remaining”:null},”wiley_mcp_cashmere”:{“monthly_limit”:5,”remaining”:5}}}}`;
const example2 = `{“pages_limit”:100,”upload_limit”:50,”create_limit”:99,”article_image_upload_limit”:500,”max_files_per_user”:500,”max_files_per_repository”:50,”connector_limits”:{“repo_type_limits”:{“COLLECTION”:{“max_files”:50,”max_folders”:50},”HEALTH”:{“max_files”:200,”max_folders”:200}},”global_file_count”:500,”max_file_size_mb”:50,”max_attachment_file_size_mb”:50,”daily_attachment_limit”:500,”weekly_attachment_limit”:null,”daily_attachment_limit_non_priority_country”:null},”sources”:{“source_to_limit”:{“web”:{“monthly_limit”:null,”remaining”:null},”scholar”:{“monthly_limit”:null,”remaining”:null},”social”:{“monthly_limit”:null,”remaining”:null},”google_drive”:{“monthly_limit”:null,”remaining”:null},”gcal”:{“monthly_limit”:null,”remaining”:null},”dropbox”:{“monthly_limit”:null,”remaining”:null},”notion_mcp”:{“monthly_limit”:null,”remaining”:null},”outlook”:{“monthly_limit”:null,”remaining”:null},”linear_alt”:{“monthly_limit”:null,”remaining”:null},”github_mcp_direct”:{“monthly_limit”:null,”remaining”:null},”asana_mcp_merge”:{“monthly_limit”:null,”remaining”:null},”slack_direct”:{“monthly_limit”:null,”remaining”:null},”jira_mcp_merge”:{“monthly_limit”:null,”remaining”:null},”confluence_mcp_merge”:{“monthly_limit”:null,”remaining”:null},”microsoft_teams_mcp_merge”:{“monthly_limit”:null,”remaining”:null},”wiley_mcp_cashmere”:{“monthly_limit”:5,”remaining”:5},”cbinsights_mcp_cashmere”:{“monthly_limit”:5,”remaining”:5},”pitchbook_mcp_cashmere”:{“monthly_limit”:5,”remaining”:5},”statista_mcp_cashmere”:{“monthly_limit”:5,”remaining”:5}}},”has_ai_profile”:false,”referral_code”:”Q7N0LPC8″,”referral_num_success”:0,”referral_num_coupons”:0,”stripe_status”:”active”,”revenuecat_status”:”none”,”revenuecat_source”:”none”,”subscription_status”:”active”,”subscription_source”:”stripe”,”subscription_tier”:”yearly”,”coupon_metadata”:{“name”:”Deutsche Telekom HR”,”logo_image_url”:null,”logo_dark_image_url”:null,”accent_color”:null,”expires_at”:”2026-01-15T00:00:00″,”coupon_duration”:null,”coupon_duration_days”:null,”coupon_amount”:null,”coupon_percent”:null,”coupon_id”:”yglW31iG”,”promo_code_id”:”promo_1R1CDbGZwjqPfxkZrmz5rHc3″,”default_locale”:null,”has_custom_notifications”:false},”default_model”:”turbo”,”default_image_generation_model”:”gemini-flash”,”default_video_generation_model”:”default”,”query_count”:59,”query_count_copilot”:54,”query_count_mobile”:0,”disable_training”:false,”is_sidebar_collapsed”:null,”default_copilot”:null,”notif_status”:”daily”,”email_status”:”daily”,”time_zone”:”Europe/Berlin”,”device_language”:”en-US”,”discover_homepage_enabled”:false,”always_allow_browser_agent”:false,”has_accepted_api_terms”:false,”has_data_retention_warning”:false,”is_verified”:false,”allow_article_creation”:true,”connectors”:{“connectors”:[{“name”:”google_drive”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”google_drive”,”connection_type”:”GOOGLE_DRIVE”,”capabilities”:{“direct_api_search”:true,”high_precision_search”:true,”file_upload”:true},”disabled_capabilities”:[]},{“name”:”gcal”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”gcal”,”connection_type”:”GCAL”,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”dropbox”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”dropbox”,”connection_type”:”DROPBOX”,”capabilities”:{“direct_api_search”:true,”high_precision_search”:true,”file_upload”:true},”disabled_capabilities”:[]},{“name”:”edgar”,”auth_type”:”none”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”edgar”,”connection_type”:null,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”outlook”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”outlook”,”connection_type”:”OUTLOOK”,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”linear_alt”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”linear_alt”,”connection_type”:”LINEAR_ALT”,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”notion_mcp”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”notion_mcp”,”connection_type”:”NOTION_MCP”,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”github_mcp_direct”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”github_mcp_direct”,”connection_type”:”GITHUB_MCP_DIRECT”,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”asana_mcp_merge”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”asana_mcp_merge”,”connection_type”:”ASANA_MCP_MERGE”,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”slack_direct”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”slack_direct”,”connection_type”:”SLACK_DIRECT”,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”jira_mcp_merge”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”jira_mcp_merge”,”connection_type”:”JIRA_MCP_MERGE”,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”confluence_mcp_merge”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”confluence_mcp_merge”,”connection_type”:”CONFLUENCE_MCP_MERGE”,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”microsoft_teams_mcp_merge”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”microsoft_teams_mcp_merge”,”connection_type”:”MICROSOFT_TEAMS_MCP_MERGE”,”capabilities”:{},”disabled_capabilities”:[]}]}}`;
// Source icons mapping
const sourceIcons = {
web: ‘🌐’,
scholar: ‘🎓’,
social: ‘💬’,
google_drive: ‘📁’,
gcal: ‘📅’,
dropbox: ‘📦’,
notion_mcp: ‘📝’,
outlook: ‘📧’,
linear_alt: ‘📊’,
github_mcp_direct: ‘💻’,
asana_mcp_merge: ‘✅’,
slack_direct: ‘💬’,
jira_mcp_merge: ‘📋’,
confluence_mcp_merge: ‘📚’,
microsoft_teams_mcp_merge: ‘👥’,
wiley_mcp_cashmere: ‘📖’,
cbinsights_mcp_cashmere: ‘💡’,
pitchbook_mcp_cashmere: ‘💰’,
statista_mcp_cashmere: ‘📈’,
box: ‘📦’,
crunchbase: ‘🏢’,
factset: ‘📊’,
onedrive: ‘☁️’,
org: ‘🏛️’,
sharepoint: ‘📑’,
edgar: ‘⚖️’
};
// Connector icons
const connectorIcons = {
google_drive: ‘📁’,
gcal: ‘📅’,
dropbox: ‘📦’,
edgar: ‘⚖️’,
outlook: ‘📧’,
linear_alt: ‘📊’,
notion_mcp: ‘📝’,
github_mcp_direct: ‘💻’,
asana_mcp_merge: ‘✅’,
slack_direct: ‘💬’,
jira_mcp_merge: ‘📋’,
confluence_mcp_merge: ‘📚’,
microsoft_teams_mcp_merge: ‘👥’
};
function loadExample(num) {
document.getElementById(‘jsonInput’).value = num === 1 ? example1 : example2;
parseJSON();
}
function clearData() {
document.getElementById(‘jsonInput’).value = ”;
document.getElementById(‘dashboard’).classList.remove(‘active’);
document.getElementById(’emptyState’).style.display = ‘block’;
hideError();
}
function showError(message) {
const errorEl = document.getElementById(‘errorMessage’);
errorEl.textContent = message;
errorEl.classList.add(‘active’);
}
function hideError() {
document.getElementById(‘errorMessage’).classList.remove(‘active’);
}
function parseJSON() {
const input = document.getElementById(‘jsonInput’).value.trim();
if (!input) {
showError(‘Please enter JSON data’);
return;
}
try {
const data = JSON.parse(input);
hideError();
renderDashboard(data);
} catch (e) {
showError(‘Invalid JSON: ‘ + e.message);
}
}
function renderDashboard(data) {
document.getElementById(’emptyState’).style.display = ‘none’;
document.getElementById(‘dashboard’).classList.add(‘active’);
renderQueryLimits(data);
renderContentLimits(data);
renderConnectorLimits(data);
renderSources(data);
renderConnectors(data);
renderAccountInfo(data);
}
function createCard(title, value, description, badge = null, progress = null) {
let badgeHtml = ”;
if (badge) {
badgeHtml = `
${badge.text}`;
}
let progressHtml = ”;
if (progress) {
const percentage = Math.min(100, (progress.current / progress.max) * 100);
const progressClass = percentage > 90 ? ‘danger’ : percentage > 70 ? ‘warning’ : ‘success’;
progressHtml = `
`;
}
return `
${value}
${description}
${progressHtml}
`;
}
function renderQueryLimits(data) {
const container = document.getElementById(‘queryLimits’);
let html = ”;
if (data.remaining_pro !== undefined) {
html += createCard(
‘Pro Queries’,
data.remaining_pro,
‘Remaining professional queries’,
data.remaining_pro > 100 ? { type: ‘success’, text: ‘Good’ } :
data.remaining_pro > 50 ? { type: ‘warning’, text: ‘Low’ } : { type: ‘danger’, text: ‘Critical’ }
);
}
if (data.remaining_research !== undefined) {
html += createCard(
‘Research Queries’,
data.remaining_research,
‘Remaining research queries’,
data.remaining_research > 10 ? { type: ‘success’, text: ‘Good’ } :
data.remaining_research > 5 ? { type: ‘warning’, text: ‘Low’ } : { type: ‘danger’, text: ‘Critical’ }
);
}
if (data.remaining_agentic_research !== undefined) {
html += createCard(
‘Agentic Research’,
data.remaining_agentic_research,
‘Remaining agentic research queries’,
data.remaining_agentic_research > 0 ? { type: ‘success’, text: ‘Available’ } : { type: ‘danger’, text: ‘Depleted’ }
);
}
if (data.remaining_labs !== undefined) {
html += createCard(
‘Labs Queries’,
data.remaining_labs,
‘Remaining labs/experimental queries’,
data.remaining_labs > 10 ? { type: ‘success’, text: ‘Good’ } :
data.remaining_labs > 5 ? { type: ‘warning’, text: ‘Low’ } : { type: ‘danger’, text: ‘Critical’ }
);
}
if (data.query_count !== undefined) {
html += createCard(
‘Total Queries’,
data.query_count,
‘Total queries made this period’
);
}
if (data.query_count_copilot !== undefined) {
html += createCard(
‘Copilot Queries’,
data.query_count_copilot,
‘Queries made via Copilot’
);
}
container.innerHTML = html || ‘
No query limit data available
‘;
}
function renderContentLimits(data) {
const container = document.getElementById(‘contentLimits’);
let html = ”;
if (data.pages_limit !== undefined) {
html += createCard(
‘Pages Limit’,
data.pages_limit,
‘Maximum pages allowed’
);
}
if (data.upload_limit !== undefined) {
html += createCard(
‘Upload Limit’,
data.upload_limit,
‘Maximum uploads allowed’
);
}
if (data.create_limit !== undefined) {
html += createCard(
‘Create Limit’,
data.create_limit,
‘Maximum creations allowed’
);
}
if (data.article_image_upload_limit !== undefined) {
html += createCard(
‘Image Upload Limit’,
data.article_image_upload_limit,
‘Maximum article image uploads’
);
}
container.innerHTML = html || ‘
No content limit data available
‘;
}
function renderConnectorLimits(data) {
const container = document.getElementById(‘connectorLimits’);
let html = ”;
if (data.max_files_per_user !== undefined) {
html += createCard(
‘Files Per User’,
data.max_files_per_user,
‘Maximum files per user’
);
}
if (data.max_files_per_repository !== undefined) {
html += createCard(
‘Files Per Repository’,
data.max_files_per_repository,
‘Maximum files per repository’
);
}
if (data.connector_limits) {
const cl = data.connector_limits;
if (cl.max_file_size_mb !== undefined) {
html += createCard(
‘Max File Size’,
cl.max_file_size_mb + ‘ MB’,
‘Maximum file upload size’
);
}
if (cl.max_attachment_file_size_mb !== undefined) {
html += createCard(
‘Max Attachment Size’,
cl.max_attachment_file_size_mb + ‘ MB’,
‘Maximum attachment size’
);
}
if (cl.daily_attachment_limit !== undefined) {
html += createCard(
‘Daily Attachments’,
cl.daily_attachment_limit,
‘Daily attachment limit’
);
}
if (cl.global_file_count !== undefined) {
html += createCard(
‘Global File Count’,
cl.global_file_count,
‘Total global file limit’
);
}
}
container.innerHTML = html || ‘
No connector limit data available
‘;
}
function renderSources(data) {
const tbody = document.getElementById(‘sourcesTableBody’);
let html = ”;
const sources = data.sources?.source_to_limit || {};
Object.entries(sources).forEach(([name, limits]) => {
const icon = sourceIcons[name] || ‘🔌’;
const displayName = name.replace(/_/g, ‘ ‘).replace(/bw/g, l => l.toUpperCase());
let limitClass = ‘limit-normal’;
let limitText = limits.monthly_limit === null ? ‘Unlimited’ : limits.monthly_limit;
if (limits.monthly_limit === null) limitClass = ‘limit-unlimited’;
if (limits.monthly_limit === 0) limitClass = ‘limit-zero’;
let remainingClass = ‘limit-normal’;
let remainingText = limits.remaining === null ? ‘Unlimited’ : limits.remaining;
if (limits.remaining === null) remainingClass = ‘limit-unlimited’;
if (limits.remaining === 0) remainingClass = ‘limit-zero’;
let statusBadge = ”;
if (limits.remaining === null && limits.monthly_limit === null) {
statusBadge = ‘
Unlimited‘;
} else if (limits.remaining === 0) {
statusBadge = ‘
Depleted‘;
} else if (limits.remaining !== null && limits.monthly_limit !== null) {
const pct = (limits.remaining / limits.monthly_limit) * 100;
if (pct > 50) {
statusBadge = ‘
Good‘;
} else if (pct > 25) {
statusBadge = ‘
Low‘;
} else {
statusBadge = ‘
Critical‘;
}
} else {
statusBadge = ‘
N/A‘;
}
html += `
|
|
${limitText} |
${remainingText} |
${statusBadge} |
`;
});
tbody.innerHTML = html || ‘
| No source data available |
‘;
}
function renderConnectors(data) {
const container = document.getElementById(‘connectorsGrid’);
let html = ”;
const connectors = data.connectors?.connectors || [];
connectors.forEach(connector => {
const icon = connectorIcons[connector.name] || ‘🔌’;
const displayName = connector.name.replace(/_/g, ‘ ‘).replace(/bw/g, l => l.toUpperCase());
const statusClass = connector.connected ? ‘status-connected’ : ‘status-disconnected’;
const statusText = connector.connected ? ‘Connected’ : ‘Disconnected’;
html += `
${icon}
${displayName}
${statusText}
`;
});
container.innerHTML = html || ‘
No connector data available
‘;
}
function renderAccountInfo(data) {
const container = document.getElementById(‘accountInfo’);
let html = ”;
if (data.subscription_tier) {
html += createCard(
‘Subscription Tier’,
data.subscription_tier.charAt(0).toUpperCase() + data.subscription_tier.slice(1),
‘Your current subscription plan’,
{ type: ‘success’, text: data.subscription_status === ‘active’ ? ‘Active’ : ‘Inactive’ }
);
}
if (data.subscription_source) {
html += createCard(
‘Payment Source’,
data.subscription_source.charAt(0).toUpperCase() + data.subscription_source.slice(1),
‘Your payment provider’
);
}
if (data.referral_code) {
html += createCard(
‘Referral Code’,
data.referral_code,
‘Share with friends’
);
}
if (data.default_model) {
html += createCard(
‘Default Model’,
data.default_model.charAt(0).toUpperCase() + data.default_model.slice(1),
‘Your preferred AI model’
);
}
if (data.time_zone) {
html += createCard(
‘Time Zone’,
data.time_zone,
‘Your local timezone’
);
}
if (data.coupon_metadata?.name) {
html += createCard(
‘Coupon’,
data.coupon_metadata.name,
‘Applied coupon’,
data.coupon_metadata.expires_at ? {
type: new Date(data.coupon_metadata.expires_at) > new Date() ? ‘success’ : ‘danger’,
text: new Date(data.coupon_metadata.expires_at) > new Date() ? ‘Valid’ : ‘Expired’
} : null
);
}
container.innerHTML = html || ‘
No account information available
‘;
}
// Auto-parse on paste
document.getElementById(‘jsonInput’).addEventListener(‘paste’, function(e) {
setTimeout(() => parseJSON(), 100);
});