upgrade Bootstrap 4 => 5, remove jquery (#146)

[nominatim-ui.git] / src / components / LastUpdated.svelte

diff --git a/src/components/LastUpdated.svelte b/src/components/LastUpdated.svelte
index 3f914cebffe9faa546097f8dbb643f5f50ebcb0d..08be5d9aa54b3b51692c5166958ba65a4441c350 100644 (file)
--- a/src/components/LastUpdated.svelte
+++ b/src/components/LastUpdated.svelte
@@ -1,15 +1,29 @@
 <script>
+  import PageLink from './PageLink.svelte';
   import * as timeago from 'timeago.js';
   import { last_api_request_url_store } from '../lib/stores.js';
   import { fetch_from_api } from '../lib/api_utils.js';
 
   let last_updated_date;
   let last_api_request_url;
+  let fetch_running = false; // prevent multiple parallel fetch runs
 
   last_api_request_url_store.subscribe(url => {
     last_api_request_url = url;
+
+    if (last_api_request_url) {
+      last_api_request_url = new URL(last_api_request_url, window.location.origin);
+      last_api_request_url.searchParams.delete('polygon_geojson');
+      last_api_request_url = last_api_request_url.toString();
+    }
+
+    if (fetch_running || last_updated_date) return;
+
+    fetch_running = true;
+
     fetch_from_api('status', { format: 'json' }, function (data) {
       last_updated_date = data.data_updated;
+      fetch_running = false;
     });
   });
 </script>
@@ -34,7 +48,7 @@
 
 <div id="last-updated" class="container-fluid py-2 px-4 mb-3">
   <div id="loading" class="py-2 px-4">
-    <div class="spinner-border spinner-border-sm text-primary mr-1" role="status"></div>
+    <div class="spinner-border spinner-border-sm text-primary me-1" role="status"></div>
     Loading data from API ...
   </div>
   <div class="row">
@@ -48,11 +62,12 @@
         </div>
       {/if}
     </div>
-    <div class="col-sm-6 text-right">
+    <div class="col-sm-6 text-end">
       {#if last_updated_date}
         Data last updated:
         <abbr id="data-date" title="{last_updated_date} (UTC timezone)">{timeago.format(new Date(last_updated_date))}</abbr>
       {/if}
+      (<PageLink page="status">Details</PageLink>)
     </div>
   </div>
 </div>