src/components/ReverseLink.svelte

   1 <script>
   2 import { appState } from '../state/AppState.svelte.js';
   3
   4 let {
   5   lat = null,
   6   lon = null,
   7   zoom = null,
   8   text,
   9   extra_classes = ''
  10 } = $props();
  11
  12 const params = $derived.by(() => {
  13   const new_params = {};
  14
  15   if (lat && lon) {
  16     new_params.lat = lat;
  17     new_params.lon = lon;
  18
  19     if (zoom) {
  20       new_params.set('zoom', zoom);
  21     }
  22   }
  23
  24   return new URLSearchParams(new_params);
  25 });
  26
  27 const href = $derived.by(() => {
  28   let param_str = params.toString();
  29   return 'reverse.html' + (param_str ? '?' : '') + param_str;
  30 });
  31
  32 function onClick(e) {
  33   e.preventDefault();
  34   e.stopPropagation();
  35   appState.refreshPage('reverse', params);
  36 }
  37
  38 </script>
  39
  40 <a onclick={onClick} href={href} class={extra_classes}>{text}</a>