Add functionality to query DB through settings
This commit is contained in:
@@ -205,3 +205,83 @@ def get_database_schema():
|
||||
})
|
||||
|
||||
return schema_data
|
||||
|
||||
@settings.route("/execute_query", methods=["POST"])
|
||||
@login_required
|
||||
def execute_query():
|
||||
"""Execute a user-scoped SQL query"""
|
||||
query = request.json.get('query', '').strip()
|
||||
|
||||
if not query:
|
||||
return {"error": "No query provided"}, 400
|
||||
|
||||
# Basic validation - must be SELECT only
|
||||
query_upper = query.upper()
|
||||
if not query_upper.startswith('SELECT'):
|
||||
return {"error": "Only SELECT queries are allowed"}, 400
|
||||
|
||||
# Check for dangerous keywords
|
||||
dangerous_keywords = ['DROP', 'DELETE', 'INSERT', 'UPDATE', 'ALTER', 'CREATE', 'TRUNCATE', 'GRANT', 'REVOKE']
|
||||
for keyword in dangerous_keywords:
|
||||
if keyword in query_upper:
|
||||
return {"error": f"Keyword '{keyword}' is not allowed"}, 400
|
||||
|
||||
user_id = current_user.id
|
||||
|
||||
# List of tables that have user_id column
|
||||
user_scoped_tables = [
|
||||
'http_functions', 'timer_functions', 'shared_environments',
|
||||
'api_keys', 'http_function_invocations', 'timer_function_invocations'
|
||||
]
|
||||
|
||||
# Automatically add user_id filter if querying user-scoped tables
|
||||
modified_query = query
|
||||
for table in user_scoped_tables:
|
||||
if table in query.lower():
|
||||
# Add WHERE clause if not present
|
||||
if 'WHERE' not in query_upper:
|
||||
modified_query = f"{query} WHERE {table}.user_id = {user_id}"
|
||||
# Append to existing WHERE clause
|
||||
elif f'{table}.user_id' not in query.lower() and 'user_id' not in query.lower():
|
||||
modified_query = f"{query} AND {table}.user_id = {user_id}"
|
||||
break
|
||||
|
||||
# Limit results to prevent massive queries
|
||||
if 'LIMIT' not in query_upper:
|
||||
modified_query = f"{modified_query} LIMIT 100"
|
||||
|
||||
try:
|
||||
results = db.execute(modified_query)
|
||||
|
||||
if not results:
|
||||
return {
|
||||
"columns": [],
|
||||
"rows": [],
|
||||
"row_count": 0,
|
||||
"message": "Query executed successfully, but returned no results."
|
||||
}
|
||||
|
||||
# Convert results to JSON-serializable format
|
||||
columns = list(results[0].keys()) if results else []
|
||||
rows = []
|
||||
|
||||
for row in results:
|
||||
row_data = []
|
||||
for col in columns:
|
||||
value = row[col]
|
||||
# Convert datetime to string
|
||||
if hasattr(value, 'isoformat'):
|
||||
value = value.isoformat()
|
||||
row_data.append(value)
|
||||
rows.append(row_data)
|
||||
|
||||
return {
|
||||
"columns": columns,
|
||||
"rows": rows,
|
||||
"row_count": len(rows),
|
||||
"message": f"Query executed successfully. {len(rows)} row(s) returned.",
|
||||
"query_executed": modified_query
|
||||
}
|
||||
|
||||
except Exception as e:
|
||||
return {"error": f"Query execution failed: {str(e)}"}, 500
|
||||
|
||||
@@ -23,8 +23,7 @@
|
||||
|
||||
<div class="mb-6">
|
||||
<h1 class="text-2xl font-bold text-gray-900 dark:text-white mb-2">Database Schema</h1>
|
||||
<p class="text-gray-600 dark:text-gray-400">Visual representation of your database structure with tables and
|
||||
relationships.</p>
|
||||
<p class="text-gray-600 dark:text-gray-400">Explore your database structure and run queries on your data.</p>
|
||||
</div>
|
||||
|
||||
<!-- ERD Diagram -->
|
||||
@@ -42,13 +41,60 @@ erDiagram
|
||||
{% endfor %}
|
||||
{% for table in schema_info %}
|
||||
{% for fk in table.foreign_keys %}
|
||||
{{ table.table_name|upper }} }|--|| {{ fk.foreign_table_name|upper }} : "references"
|
||||
{{ table.table_name|upper }} }|--|| {{ fk.foreign_table_name|upper }} : "{{ fk.column_name }}"
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
</pre>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- SQL Query Explorer -->
|
||||
<div class="bg-white dark:bg-gray-800 rounded-lg shadow p-6 mb-6">
|
||||
<h2 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">SQL Query Explorer</h2>
|
||||
<p class="text-sm text-gray-600 dark:text-gray-400 mb-4">
|
||||
Run SELECT queries on your data. Queries are automatically scoped to your user account for security.
|
||||
</p>
|
||||
|
||||
<div class="mb-4">
|
||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">SQL Query</label>
|
||||
<div id="sql-editor" class="border border-gray-300 dark:border-gray-600 rounded" style="height: 150px;">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center justify-between mb-4">
|
||||
<button id="run-query-btn"
|
||||
class="px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors flex items-center">
|
||||
<svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z" />
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
||||
d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
||||
Run Query
|
||||
</button>
|
||||
<button id="clear-query-btn"
|
||||
class="px-4 py-2 text-gray-700 dark:text-gray-300 border border-gray-300 dark:border-gray-600 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors">
|
||||
Clear
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div id="query-message" class="hidden mb-4 p-3 rounded-lg"></div>
|
||||
|
||||
<div id="query-results" class="hidden">
|
||||
<h3 class="text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Results</h3>
|
||||
<div class="overflow-x-auto border border-gray-200 dark:border-gray-700 rounded-lg max-h-96">
|
||||
<table id="results-table" class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
|
||||
<thead class="bg-gray-50 dark:bg-gray-700 sticky top-0">
|
||||
<tr id="results-header"></tr>
|
||||
</thead>
|
||||
<tbody id="results-body"
|
||||
class="bg-white dark:bg-gray-800 divide-y divide-gray-200 dark:divide-gray-700">
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Tables Overview -->
|
||||
<div class="bg-white dark:bg-gray-800 rounded-lg shadow p-6">
|
||||
<h2 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">Tables Overview</h2>
|
||||
@@ -115,6 +161,130 @@ erDiagram
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Ace Editor -->
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.32.0/ace.js"></script>
|
||||
|
||||
<!-- SQL Query Interface Script -->
|
||||
<script>
|
||||
// Initialize Ace Editor for SQL
|
||||
const sqlEditor = ace.edit("sql-editor");
|
||||
sqlEditor.setTheme("ace/theme/monokai");
|
||||
sqlEditor.session.setMode("ace/mode/sql");
|
||||
sqlEditor.setOptions({
|
||||
fontSize: "14px",
|
||||
showPrintMargin: false,
|
||||
showGutter: true,
|
||||
highlightActiveLine: true,
|
||||
enableLiveAutocompletion: true
|
||||
});
|
||||
|
||||
// Set default query
|
||||
sqlEditor.setValue(`SELECT * FROM http_functions`, -1);
|
||||
|
||||
// Run query button
|
||||
document.getElementById('run-query-btn').addEventListener('click', async () => {
|
||||
const query = sqlEditor.getValue().trim();
|
||||
const messageDiv = document.getElementById('query-message');
|
||||
const resultsDiv = document.getElementById('query-results');
|
||||
const runBtn = document.getElementById('run-query-btn');
|
||||
|
||||
if (!query) {
|
||||
showMessage('Please enter a SQL query', 'error');
|
||||
return;
|
||||
}
|
||||
|
||||
// Disable button and show loading
|
||||
runBtn.disabled = true;
|
||||
runBtn.innerHTML = '<svg class="w-4 h-4 mr-2 animate-spin" fill="none" stroke="currentColor" viewBox="0 0 24 24"><circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle><path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path></svg>Running...';
|
||||
|
||||
try {
|
||||
const response = await fetch('{{ url_for("settings.execute_query") }}', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({ query })
|
||||
});
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
if (!response.ok) {
|
||||
showMessage(data.error || 'Query failed', 'error');
|
||||
resultsDiv.classList.add('hidden');
|
||||
} else {
|
||||
showMessage(data.message, 'success');
|
||||
displayResults(data);
|
||||
}
|
||||
} catch (error) {
|
||||
showMessage('Error executing query: ' + error.message, 'error');
|
||||
resultsDiv.classList.add('hidden');
|
||||
} finally {
|
||||
// Re-enable button
|
||||
runBtn.disabled = false;
|
||||
runBtn.innerHTML = '<svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z"/><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>Run Query';
|
||||
}
|
||||
});
|
||||
|
||||
// Clear button
|
||||
document.getElementById('clear-query-btn').addEventListener('click', () => {
|
||||
sqlEditor.setValue('', -1);
|
||||
document.getElementById('query-message').classList.add('hidden');
|
||||
document.getElementById('query-results').classList.add('hidden');
|
||||
});
|
||||
|
||||
function showMessage(message, type) {
|
||||
const messageDiv = document.getElementById('query-message');
|
||||
messageDiv.classList.remove('hidden', 'bg-green-50', 'bg-red-50', 'text-green-700', 'text-red-700',
|
||||
'dark:bg-green-900/20', 'dark:bg-red-900/20', 'dark:text-green-300', 'dark:text-red-300');
|
||||
|
||||
if (type === 'success') {
|
||||
messageDiv.classList.add('bg-green-50', 'text-green-700', 'dark:bg-green-900/20', 'dark:text-green-300');
|
||||
} else {
|
||||
messageDiv.classList.add('bg-red-50', 'text-red-700', 'dark:bg-red-900/20', 'dark:text-red-300');
|
||||
}
|
||||
|
||||
messageDiv.textContent = message;
|
||||
}
|
||||
|
||||
function displayResults(data) {
|
||||
const resultsDiv = document.getElementById('query-results');
|
||||
const headerRow = document.getElementById('results-header');
|
||||
const tbody = document.getElementById('results-body');
|
||||
|
||||
// Clear previous results
|
||||
headerRow.innerHTML = '';
|
||||
tbody.innerHTML = '';
|
||||
|
||||
if (data.row_count === 0) {
|
||||
resultsDiv.classList.add('hidden');
|
||||
return;
|
||||
}
|
||||
|
||||
// Add column headers
|
||||
data.columns.forEach(col => {
|
||||
const th = document.createElement('th');
|
||||
th.className = 'px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-300 uppercase tracking-wider';
|
||||
th.textContent = col;
|
||||
headerRow.appendChild(th);
|
||||
});
|
||||
|
||||
// Add rows
|
||||
data.rows.forEach(row => {
|
||||
const tr = document.createElement('tr');
|
||||
row.forEach(cell => {
|
||||
const td = document.createElement('td');
|
||||
td.className = 'px-6 py-4 whitespace-nowrap text-sm text-gray-900 dark:text-gray-300';
|
||||
td.textContent = cell === null ? 'NULL' : cell;
|
||||
tr.appendChild(td);
|
||||
});
|
||||
tbody.appendChild(tr);
|
||||
});
|
||||
|
||||
resultsDiv.classList.remove('hidden');
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- Mermaid Diagram Script -->
|
||||
<script type="module">
|
||||
// Dynamically import mermaid
|
||||
const mermaid = await import('https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.esm.min.mjs');
|
||||
|
||||
Reference in New Issue
Block a user