]> git.openstreetmap.org Git - nominatim-ui.git/blob - src/components/LastUpdated.svelte
Merge remote-tracking branch 'upstream/master'
[nominatim-ui.git] / src / components / LastUpdated.svelte
1 <script>
2   import PageLink from './PageLink.svelte';
3   import * as timeago from 'timeago.js';
4   import { last_api_request_url_store } from '../lib/stores.js';
5   import { fetch_from_api } from '../lib/api_utils.js';
6
7   let last_updated_date;
8   let last_api_request_url;
9   let fetch_running = false; // prevent multiple parallel fetch runs
10
11   last_api_request_url_store.subscribe(url => {
12     last_api_request_url = url;
13
14     if (last_api_request_url) {
15       last_api_request_url = new URL(last_api_request_url, window.location.origin);
16       last_api_request_url.searchParams.delete('polygon_geojson');
17       last_api_request_url = last_api_request_url.toString();
18     }
19
20     if (fetch_running || last_updated_date) return;
21
22     fetch_running = true;
23
24     fetch_from_api('status', { format: 'json' }, function (data) {
25       last_updated_date = data.data_updated;
26       fetch_running = false;
27     });
28   });
29 </script>
30
31 <style>
32   #last-updated {
33     position: relative;
34     font-size: 0.8rem;
35     font-style: italic;
36   }
37   #loading {
38     display: none;
39     position: absolute;
40     padding: 0.5em 1em;
41     top: 0;
42     left: 0;
43     width: 100%;
44     background-color: #eee;
45     z-index: 100;
46   }
47 </style>
48
49 <div id="last-updated" class="container-fluid py-2 px-4 mb-3">
50   <div id="loading" class="py-2 px-4">
51     <div class="spinner-border spinner-border-sm text-primary me-1" role="status"></div>
52     Loading data from API ...
53   </div>
54   <div class="row">
55     <div class="col-sm-6">
56       {#if last_api_request_url}
57         <div id="api-request">
58           Data from <a href="{last_api_request_url}">API request</a>
59           <span id="api-request-debug">
60             (<a href="{last_api_request_url}&debug=1">debug output</a>)
61           </span>
62         </div>
63       {/if}
64     </div>
65     <div class="col-sm-6 text-end">
66       {#if last_updated_date}
67         Data last updated:
68         <abbr id="data-date" title="{last_updated_date} (UTC timezone)">{timeago.format(new Date(last_updated_date))}</abbr>
69       {/if}
70       (<PageLink page="status">Details</PageLink>)
71     </div>
72   </div>
73 </div>