Column headers now link to sort/desc sort - refs #189

datasette/app.py

@@ -802,6 +802,12 @@ class TableView(RowTableShared):
                 'display_columns': display_columns,
                 'filter_columns': filter_columns,
                 'display_rows': display_rows,
+                'path_with_added_args': path_with_added_args,
+                'request': request,
+                'enumerate': enumerate,
+                'sort': sort,
+                'sort_desc': sort_desc,
+                'disable_sort': is_view,
                 'custom_rows_and_columns_templates': [
                     '_rows_and_columns-{}-{}.html'.format(to_css_class(name), to_css_class(table)),
                     '_rows_and_columns-table-{}-{}.html'.format(to_css_class(name), to_css_class(table)),
@@ -876,6 +882,8 @@ class RowView(RowTableShared):
                     '_rows_and_columns-row-{}-{}.html'.format(to_css_class(name), to_css_class(table)),
                     '_rows_and_columns.html',
                 ],
+                'disable_sort': True,
+                'enumerate': enumerate,
                 'metadata': self.ds.metadata.get(
                     'databases', {}
                 ).get(name, {}).get('tables', {}).get(table, {}),

datasette/templates/_rows_and_columns.html

@@ -1,7 +1,19 @@
 <table>
     <thead>
         <tr>
-            {% for column in display_columns %}<th scope="col">{{ column }}</th>{% endfor %}
+            {% for i, column in enumerate(display_columns) %}
+                <th scope="col">
+                    {% if i == 0 or disable_sort %}
+                        {{ column }}
+                    {% else %}
+                        {% if column == sort %}
+                            <a href="{{ path_with_added_args(request, {'_sort_desc': column, '_sort': None, '_next': None}) }}" rel="nofollow">{{ column }}&nbsp;▼</a>
+                        {% else %}
+                            <a href="{{ path_with_added_args(request, {'_sort': column, '_sort_desc': None, '_next': None}) }}" rel="nofollow">{{ column }}{% if column == sort_desc %}&nbsp;▲{% endif %}</a>
+                        {% endif %}
+                    {% endif %}
+                </th>
+            {% endfor %}
         </tr>
     </thead>
     <tbody>

tests/test_html.py

@@ -157,9 +157,15 @@ def test_css_classes_on_body(app_client, path, expected_classes):
 def test_table_html_simple_primary_key(app_client):
     response = app_client.get('/test_tables/simple_primary_key', gather_request=False)
     table = Soup(response.body, 'html.parser').find('table')
-    assert [
+    ths = table.findAll('th')
-        'Link', 'pk', 'content'
+    assert 'Link' == ths[0].string.strip()
-    ] == [th.string for th in table.select('thead th')]
+    for expected_col, th in zip(('pk', 'content'), ths[1:]):
+        a = th.find('a')
+        assert expected_col == a.string
+        assert a['href'].endswith('/simple_primary_key?_sort={}'.format(
+            expected_col
+        ))
+        assert ['nofollow'] == a['rel']
     assert [
         [
             '<td><a href="/test_tables/simple_primary_key/1">1</a></td>',
@@ -182,7 +188,7 @@ def test_row_html_simple_primary_key(app_client):
     table = Soup(response.body, 'html.parser').find('table')
     assert [
         'pk', 'content'
-    ] == [th.string for th in table.select('thead th')]
+    ] == [th.string.strip() for th in table.select('thead th')]
     assert [
         [
             '<td>1</td>',
@@ -194,9 +200,14 @@ def test_row_html_simple_primary_key(app_client):
 def test_table_html_no_primary_key(app_client):
     response = app_client.get('/test_tables/no_primary_key', gather_request=False)
     table = Soup(response.body, 'html.parser').find('table')
-    assert [
+    ths = table.findAll('th')
-        'Link', 'rowid', 'content', 'a', 'b', 'c'
+    assert 'Link' == ths[0].string.strip()
-    ] == [th.string for th in table.select('thead th')]
+    for expected_col, th in zip(('rowid', 'content', 'a', 'b', 'c'), ths[1:]):
+        a = th.find('a')
+        assert expected_col == a.string
+        assert a['href'].endswith('/no_primary_key?_sort={}'.format(
+            expected_col
+        ))
     expected = [
         [
             '<td><a href="/test_tables/no_primary_key/{}">{}</a></td>'.format(i, i),
@@ -215,7 +226,7 @@ def test_row_html_no_primary_key(app_client):
     table = Soup(response.body, 'html.parser').find('table')
     assert [
         'rowid', 'content', 'a', 'b', 'c'
-    ] == [th.string for th in table.select('thead th')]
+    ] == [th.string.strip() for th in table.select('thead th')]
     expected = [
         [
             '<td>1</td>',
@@ -231,9 +242,14 @@ def test_row_html_no_primary_key(app_client):
 def test_table_html_compound_primary_key(app_client):
     response = app_client.get('/test_tables/compound_primary_key', gather_request=False)
     table = Soup(response.body, 'html.parser').find('table')
-    assert [
+    ths = table.findAll('th')
-        'Link', 'pk1', 'pk2', 'content'
+    assert 'Link' == ths[0].string.strip()
-    ] == [th.string for th in table.select('thead th')]
+    for expected_col, th in zip(('pk1', 'pk2', 'content'), ths[1:]):
+        a = th.find('a')
+        assert expected_col == a.string
+        assert a['href'].endswith('/compound_primary_key?_sort={}'.format(
+            expected_col
+        ))
     expected = [
         [
             '<td><a href="/test_tables/compound_primary_key/a,b">a,b</a></td>',
@@ -250,7 +266,7 @@ def test_row_html_compound_primary_key(app_client):
     table = Soup(response.body, 'html.parser').find('table')
     assert [
         'pk1', 'pk2', 'content'
-    ] == [th.string for th in table.select('thead th')]
+    ] == [th.string.strip() for th in table.select('thead th')]
     expected = [
         [
             '<td>a</td>',
@@ -266,7 +282,7 @@ def test_view_html(app_client):
     table = Soup(response.body, 'html.parser').find('table')
     assert [
         'content', 'upper_content'
-    ] == [th.string for th in table.select('thead th')]
+    ] == [th.string.strip() for th in table.select('thead th')]
     expected = [
         [
             '<td>hello</td>',