Style query operations on create query

Made it consistent with the SQL write page.

datasette/templates/_execute_write_analysis_styles.html

@@ -0,0 +1,37 @@
+<style>
+.execute-write-analysis {
+    border-collapse: collapse;
+    font-size: 0.9rem;
+    margin: 0.25rem 0 1rem;
+    min-width: 44rem;
+}
+.execute-write-analysis th,
+.execute-write-analysis td {
+    border-bottom: 1px solid #d7dde5;
+    padding: 0.45rem 0.7rem;
+    text-align: left;
+    vertical-align: top;
+}
+.execute-write-analysis th {
+    background-color: #edf6fb;
+    border-top: 1px solid #d7dde5;
+    color: #39445a;
+    font-weight: 700;
+}
+.execute-write-analysis tbody tr:nth-child(even) {
+    background-color: rgba(39, 104, 144, 0.05);
+}
+.execute-write-analysis code {
+    background: transparent;
+    font-size: 0.9em;
+    white-space: nowrap;
+}
+.execute-write-analysis-allowed {
+    color: #267a3e;
+    font-weight: 700;
+}
+.execute-write-analysis-denied {
+    color: #b00020;
+    font-weight: 700;
+}
+</style>

datasette/templates/execute_write.html

@@ -40,42 +40,8 @@
     border-radius: 0.25rem;
     min-width: 13rem;
 }
-.execute-write-analysis {
-    border-collapse: collapse;
-    font-size: 0.9rem;
-    margin: 0.25rem 0 1rem;
-    min-width: 44rem;
-}
-.execute-write-analysis th,
-.execute-write-analysis td {
-    border-bottom: 1px solid #d7dde5;
-    padding: 0.45rem 0.7rem;
-    text-align: left;
-    vertical-align: top;
-}
-.execute-write-analysis th {
-    background-color: #edf6fb;
-    border-top: 1px solid #d7dde5;
-    color: #39445a;
-    font-weight: 700;
-}
-.execute-write-analysis tbody tr:nth-child(even) {
-    background-color: rgba(39, 104, 144, 0.05);
-}
-.execute-write-analysis code {
-    background: transparent;
-    font-size: 0.9em;
-    white-space: nowrap;
-}
-.execute-write-analysis-allowed {
-    color: #267a3e;
-    font-weight: 700;
-}
-.execute-write-analysis-denied {
-    color: #b00020;
-    font-weight: 700;
-}
 </style>
+{% include "_execute_write_analysis_styles.html" %}
 {% include "_sql_parameter_styles.html" %}
 {% endblock %}
 

datasette/templates/query_create.html

@@ -5,6 +5,7 @@
 {% block extra_head %}
 {{- super() -}}
 {% include "_codemirror.html" %}
+{% include "_execute_write_analysis_styles.html" %}
 {% endblock %}
 
 {% block body_class %}query-create db-{{ database|to_css_class }}{% endblock %}
@@ -32,30 +33,28 @@
         <p><a href="{{ urls.database(database) }}/-/execute-write?{{ {'sql': sql}|urlencode|safe }}">Execute write SQL</a></p>
     {% endif %}
 
-    <h2>Analysis</h2>
+    <h2>Query operations</h2>
     {% if analysis_error %}
         <p class="message-error">{{ analysis_error }}</p>
     {% elif analysis_rows %}
-        <div class="table-wrapper"><table>
+        <div class="table-wrapper"><table class="execute-write-analysis">
             <thead>
                 <tr>
                     <th scope="col">Operation</th>
                     <th scope="col">Database</th>
                     <th scope="col">Table</th>
-                    <th scope="col">required permission</th>
+                    <th scope="col">Required permission</th>
                     <th scope="col">Allowed</th>
-                    <th scope="col">Source</th>
                 </tr>
             </thead>
             <tbody>
                 {% for row in analysis_rows %}
                     <tr>
-                        <td>{{ row.operation }}</td>
-                        <td>{{ row.database }}</td>
-                        <td>{{ row.table }}</td>
-                        <td>{{ row.required_permission }}</td>
-                        <td>{% if row.allowed is none %}{% elif row.allowed %}yes{% else %}no{% endif %}</td>
-                        <td>{{ row.source or "" }}</td>
+                        <td><code>{{ row.operation }}</code></td>
+                        <td><code>{{ row.database }}</code></td>
+                        <td><code>{{ row.table }}</code></td>
+                        <td>{% if row.required_permission %}<code>{{ row.required_permission }}</code>{% endif %}</td>
+                        <td>{% if row.allowed is none %}{% elif row.allowed %}<span class="execute-write-analysis-allowed">yes</span>{% else %}<span class="execute-write-analysis-denied">no</span>{% endif %}</td>
                     </tr>
                 {% endfor %}
             </tbody>

tests/test_queries.py

@@ -998,7 +998,11 @@ async def test_create_query_ui_and_arbitrary_sql_save_link():
     assert "Create query" in create_response.text
     assert "Read-only" in create_response.text
     assert "Writable" in create_response.text
-    assert "required permission" in create_response.text
+    assert "<h2>Query operations</h2>" in create_response.text
+    assert '<table class="execute-write-analysis">' in create_response.text
+    assert '<th scope="col">Required permission</th>' in create_response.text
+    assert '<th scope="col">Source</th>' not in create_response.text
+    assert "<td><code>read</code></td>" in create_response.text
     assert query_response.status_code == 200
     assert "Save query" in query_response.text
     assert "/data/-/queries/-/create?sql=select+%2A+from+dogs" in query_response.text