commit a136e1b77303368a5e4abfbc9c4cd5470e0b6848
parent 94d23ef5f841859e9e2b0481ecdb6ad5ddb839a7
Author: Silas Brack <silasbrack@gmail.com>
Date: Sat, 4 Oct 2025 12:45:38 +0200
fix: settings tab loading
Diffstat:
4 files changed, 18 insertions(+), 14 deletions(-)
diff --git a/src/simple_web_app/app.py b/src/simple_web_app/app.py
@@ -140,9 +140,12 @@ async def search(request: Request):
async def open_settings(request: Request):
tab = request.query_params.get("tab", default="general")
- context = {"tab": tab}
- template = "settings_tab.html" if is_htmx_request(request) else "settings.html"
- return render(request, template, context=context)
+ return render(request, "settings.html", context={"tab": tab})
+
+
+async def open_settings_tab(request: Request):
+ tab = request.query_params.get("tab", default="general")
+ return render(request, "settings_tab.html" , context={"tab": tab})
class CacheControlMiddleware(BaseHTTPMiddleware):
@@ -176,6 +179,7 @@ routes = [
Route("/search", methods=["GET"], endpoint=open_search),
Route("/search", methods=["POST"], endpoint=search),
Route("/settings", methods=["GET"], endpoint=open_settings),
+ Route("/settings/tab", methods=["GET"], endpoint=open_settings_tab),
Mount("/static", StaticFiles(directory=STATIC_DIR), name="static"),
]
middleware = [
diff --git a/src/simple_web_app/templates/index.html b/src/simple_web_app/templates/index.html
@@ -8,9 +8,9 @@
<li><strong style="cursor: pointer;" data-tooltip="Choose another date" data-placement="bottom">Tuesday, September 30</strong></li>
</ul>
<ul>
- <li><a style="cursor: pointer;" data-tooltip="Search" hx-trigger="click, keyup[ctrlKey&&shiftKey&&key=='O']" hx-get="/search" hx-target="#modal-placeholder" hx-swap="innerHTML" preload class="secondary"><svg height="20pt" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><!--!Font Awesome Free v7.0.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M480 272C480 317.9 465.1 360.3 440 394.7L566.6 521.4C579.1 533.9 579.1 554.2 566.6 566.7C554.1 579.2 533.8 579.2 521.3 566.7L394.7 440C360.3 465.1 317.9 480 272 480C157.1 480 64 386.9 64 272C64 157.1 157.1 64 272 64C386.9 64 480 157.1 480 272zM272 416C351.5 416 416 351.5 416 272C416 192.5 351.5 128 272 128C192.5 128 128 192.5 128 272C128 351.5 192.5 416 272 416z"/></svg></a></li>
- <li><a data-tooltip="Change font size" class="secondary"><svg height="20pt" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><!--!Font Awesome Free v7.0.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M349.1 114.7C343.9 103.3 332.5 96 320 96C307.5 96 296.1 103.3 290.9 114.7L123.5 480L112 480C94.3 480 80 494.3 80 512C80 529.7 94.3 544 112 544L200 544C217.7 544 232 529.7 232 512C232 494.3 217.7 480 200 480L193.9 480L215.9 432L424.2 432L446.2 480L440.1 480C422.4 480 408.1 494.3 408.1 512C408.1 529.7 422.4 544 440.1 544L528.1 544C545.8 544 560.1 529.7 560.1 512C560.1 494.3 545.8 480 528.1 480L516.6 480L349.2 114.7zM394.8 368L245.2 368L320 204.8L394.8 368z"/></svg></a></li>
- <li><a style="cursor: pointer;" data-tooltip="Settings" hx-get="/settings" hx-target="#modal-placeholder" hx-swap="innerHTML" preload class="secondary"><svg height="20pt" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><!--!Font Awesome Free v7.0.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M259.1 73.5C262.1 58.7 275.2 48 290.4 48L350.2 48C365.4 48 378.5 58.7 381.5 73.5L396 143.5C410.1 149.5 423.3 157.2 435.3 166.3L503.1 143.8C517.5 139 533.3 145 540.9 158.2L570.8 210C578.4 223.2 575.7 239.8 564.3 249.9L511 297.3C511.9 304.7 512.3 312.3 512.3 320C512.3 327.7 511.8 335.3 511 342.7L564.4 390.2C575.8 400.3 578.4 417 570.9 430.1L541 481.9C533.4 495 517.6 501.1 503.2 496.3L435.4 473.8C423.3 482.9 410.1 490.5 396.1 496.6L381.7 566.5C378.6 581.4 365.5 592 350.4 592L290.6 592C275.4 592 262.3 581.3 259.3 566.5L244.9 496.6C230.8 490.6 217.7 482.9 205.6 473.8L137.5 496.3C123.1 501.1 107.3 495.1 99.7 481.9L69.8 430.1C62.2 416.9 64.9 400.3 76.3 390.2L129.7 342.7C128.8 335.3 128.4 327.7 128.4 320C128.4 312.3 128.9 304.7 129.7 297.3L76.3 249.8C64.9 239.7 62.3 223 69.8 209.9L99.7 158.1C107.3 144.9 123.1 138.9 137.5 143.7L205.3 166.2C217.4 157.1 230.6 149.5 244.6 143.4L259.1 73.5zM320.3 400C364.5 399.8 400.2 363.9 400 319.7C399.8 275.5 363.9 239.8 319.7 240C275.5 240.2 239.8 276.1 240 320.3C240.2 364.5 276.1 400.2 320.3 400z"/></svg></a></li>
+ <li><a id="search-btn" style="cursor: pointer;" data-tooltip="Search" hx-trigger="click, keyup[ctrlKey&&shiftKey&&key=='O']" hx-get="/search" hx-target="#modal-placeholder" hx-swap="innerHTML" preload class="secondary"><svg height="20pt" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><!--!Font Awesome Free v7.0.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M480 272C480 317.9 465.1 360.3 440 394.7L566.6 521.4C579.1 533.9 579.1 554.2 566.6 566.7C554.1 579.2 533.8 579.2 521.3 566.7L394.7 440C360.3 465.1 317.9 480 272 480C157.1 480 64 386.9 64 272C64 157.1 157.1 64 272 64C386.9 64 480 157.1 480 272zM272 416C351.5 416 416 351.5 416 272C416 192.5 351.5 128 272 128C192.5 128 128 192.5 128 272C128 351.5 192.5 416 272 416z"/></svg></a></li>
+ <li><a id="font-size-btn" data-tooltip="Change font size" class="secondary"><svg height="20pt" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><!--!Font Awesome Free v7.0.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M349.1 114.7C343.9 103.3 332.5 96 320 96C307.5 96 296.1 103.3 290.9 114.7L123.5 480L112 480C94.3 480 80 494.3 80 512C80 529.7 94.3 544 112 544L200 544C217.7 544 232 529.7 232 512C232 494.3 217.7 480 200 480L193.9 480L215.9 432L424.2 432L446.2 480L440.1 480C422.4 480 408.1 494.3 408.1 512C408.1 529.7 422.4 544 440.1 544L528.1 544C545.8 544 560.1 529.7 560.1 512C560.1 494.3 545.8 480 528.1 480L516.6 480L349.2 114.7zM394.8 368L245.2 368L320 204.8L394.8 368z"/></svg></a></li>
+ <li><a id="settings-btn" style="cursor: pointer;" data-tooltip="Settings" hx-get="/settings" hx-target="#modal-placeholder" hx-swap="innerHTML" preload class="secondary"><svg height="20pt" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><!--!Font Awesome Free v7.0.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M259.1 73.5C262.1 58.7 275.2 48 290.4 48L350.2 48C365.4 48 378.5 58.7 381.5 73.5L396 143.5C410.1 149.5 423.3 157.2 435.3 166.3L503.1 143.8C517.5 139 533.3 145 540.9 158.2L570.8 210C578.4 223.2 575.7 239.8 564.3 249.9L511 297.3C511.9 304.7 512.3 312.3 512.3 320C512.3 327.7 511.8 335.3 511 342.7L564.4 390.2C575.8 400.3 578.4 417 570.9 430.1L541 481.9C533.4 495 517.6 501.1 503.2 496.3L435.4 473.8C423.3 482.9 410.1 490.5 396.1 496.6L381.7 566.5C378.6 581.4 365.5 592 350.4 592L290.6 592C275.4 592 262.3 581.3 259.3 566.5L244.9 496.6C230.8 490.6 217.7 482.9 205.6 473.8L137.5 496.3C123.1 501.1 107.3 495.1 99.7 481.9L69.8 430.1C62.2 416.9 64.9 400.3 76.3 390.2L129.7 342.7C128.8 335.3 128.4 327.7 128.4 320C128.4 312.3 128.9 304.7 129.7 297.3L76.3 249.8C64.9 239.7 62.3 223 69.8 209.9L99.7 158.1C107.3 144.9 123.1 138.9 137.5 143.7L205.3 166.2C217.4 157.1 230.6 149.5 244.6 143.4L259.1 73.5zM320.3 400C364.5 399.8 400.2 363.9 400 319.7C399.8 275.5 363.9 239.8 319.7 240C275.5 240.2 239.8 276.1 240 320.3C240.2 364.5 276.1 400.2 320.3 400z"/></svg></a></li>
</ul>
</nav>
diff --git a/src/simple_web_app/templates/search.html b/src/simple_web_app/templates/search.html
@@ -1,4 +1,4 @@
-<div id="modal" class="modal-is-open modal-is-opening" _="on closeModal remove .modal-is-opening then wait 10 then add .modal-is-closing then wait for animationend then remove me">
+<div id="search-modal" class="modal-is-open modal-is-opening" _="on closeModal remove .modal-is-opening then wait 10 then add .modal-is-closing then wait for animationend then remove me">
<dialog _="on click if target is me then trigger closeModal" open>
<article>
<h3>
diff --git a/src/simple_web_app/templates/settings.html b/src/simple_web_app/templates/settings.html
@@ -1,16 +1,16 @@
-<div id="modal" class="modal-is-open modal-is-opening" _="on closeModal remove .modal-is-opening then wait 10 then add .modal-is-closing then wait for animationend then remove me">
+<div id="settings-modal" class="modal-is-open modal-is-opening" _="on closeModal remove .modal-is-opening then wait 10 then add .modal-is-closing then wait for animationend then remove me">
<dialog _="on click if target is me then trigger closeModal" open>
<article>
<div class="overflow-auto" style="text-wrap: nowrap;">
<nav>
<ul>
- <li><div hx-get="/settings?tab=general" hx-target="#settings-tab" hx-swap="innerHTML" preload style="cursor: pointer;">General</div></li>
- <li><div hx-get="/settings?tab=categories" hx-target="#settings-tab" hx-swap="innerHTML" preload style="cursor: pointer;">Categories</div></li>
- <li><div hx-get="/settings?tab=sections" hx-target="#settings-tab" hx-swap="innerHTML" preload style="cursor: pointer;">Sections</div></li>
- <li><div hx-get="/settings?tab=content-filter" hx-target="#settings-tab" hx-swap="innerHTML" preload style="cursor: pointer;">Content Filter</div></li>
- <li><div hx-get="/settings?tab=syncing" hx-target="#settings-tab" hx-swap="innerHTML" preload style="cursor: pointer;">Syncing</div></li>
- <li><div hx-get="/settings?tab=experimental" hx-target="#settings-tab" hx-swap="innerHTML" preload style="cursor: pointer;">Experimental</div></li>
+ <li><div id="general-tab" hx-get="/settings/tab?tab=general" hx-target="#settings-tab" hx-swap="innerHTML" preload style="cursor: pointer;">General</div></li>
+ <li><div id="categories-tab" hx-get="/settings/tab?tab=categories" hx-target="#settings-tab" hx-swap="innerHTML" preload style="cursor: pointer;">Categories</div></li>
+ <li><div id="sections-tab" hx-get="/settings/tab?tab=sections" hx-target="#settings-tab" hx-swap="innerHTML" preload style="cursor: pointer;">Sections</div></li>
+ <li><div id="content-filter-tab" hx-get="/settings/tab?tab=content-filter" hx-target="#settings-tab" hx-swap="innerHTML" preload style="cursor: pointer;">Content Filter</div></li>
+ <li><div id="syncing-tab" hx-get="/settings/tab?tab=syncing" hx-target="#settings-tab" hx-swap="innerHTML" preload style="cursor: pointer;">Syncing</div></li>
+ <li><div id="experimental-tab" hx-get="/settings/tab?tab=experimental" hx-target="#settings-tab" hx-swap="innerHTML" preload style="cursor: pointer;">Experimental</div></li>
</ul>
</nav>
</div>
