code cleanup

frontend/src/Components/CompanySelector.svelte

@@ -1,5 +1,6 @@
 <script>
     import {onMount} from 'svelte';
+
     import { api }   from '../urls.svelte.js';
     import {t}       from '../translations.svelte.js';
 

frontend/src/Components/EstimatedTask.svelte

@@ -1,7 +1,10 @@
 <script>
     import {t} from '../translations.svelte.js';
 
-    let { task, onSelect = (task) => {} } = $props();
+    let {
+        task,
+        onSelect = (task) => {}
+    } = $props();
 </script>
 
 <div>

frontend/src/routes/document/EstimateList.svelte

@@ -1,14 +1,21 @@
 <script>
-    import { t } from '../../translations.svelte.js';
     import { onMount } from 'svelte';
-    import EstimatedTask from '../../Components/EstimatedTask.svelte';
-    let { company_id, onSelect = (task) => {} } = $props();
 
-    let projects = $state(null);
+    import { api }     from '../../urls.svelte.js';
+    import { t }       from '../../translations.svelte.js';
+
+    import EstimatedTask from '../../Components/EstimatedTask.svelte';
+
+    let {
+        company_id,
+        onSelect = (task) => {}
+    } = $props();
+
     let error    = $state(null);
+    let projects = $state(null);
 
     async function loadItems(){
-        const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/task/estimated_times`;
+        const url  = api('task/estimated_times');
         let data   = { company_id: company_id };
         const resp = await fetch(url,{
             credentials: 'include',

frontend/src/routes/document/ItemList.svelte

@@ -1,15 +1,22 @@
 <script>
-    import { t } from '../../translations.svelte.js';
     import { onMount } from 'svelte';
+
+    import { api }     from '../../urls.svelte.js';
+    import { t }       from '../../translations.svelte.js';
+
     import Item        from '../../Components/Item.svelte';
-    let { company_id, onSelect = (item) => {} } = $props();
+
+    let {
+        company_id,
+        onSelect = (item) => {}
+    } = $props();
 
     let items = $state(null);
     let error = $state(null);
 
 
     async function loadItems(){
-        const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/items/list`;
+        const url  = api('items/list');
         let data   = { company_id: company_id };
         const resp = await fetch(url,{
             credentials: 'include',

frontend/src/routes/document/List.svelte

@@ -1,21 +1,24 @@
 <script>
-    import { useTinyRouter } from 'svelte-tiny-router';
     import { onMount }       from 'svelte';
+    import { useTinyRouter } from 'svelte-tiny-router';
+
+    import { api }           from '../../urls.svelte.js';
     import { t }             from '../../translations.svelte.js';
+
     import TypeSelector      from './TypeSelector.svelte';
 
 
 
     let error           = null;
     let companies       = {};
-    let documents = null;
-    let selected_company = null;
-    let router = useTinyRouter();
     let company_id      = +router.query.company_id;
+    let documents       = null;
+    let router          = useTinyRouter();
     let docType         = 0;
+    let selected_company = null;
 
     async function loadCompanies(){
-        const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/company/list`;
+        const url = api('company/list');
         const resp = await fetch(url,{ credentials: 'include'});
         if (resp.ok){
             companies = await resp.json();
@@ -37,7 +40,7 @@
     async function load(company){
         router.navigate(`/document?company_id=${company.id}`);
         selected_company = company;
-        const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/document/list`;
+        const url = api('document/list');
         const resp = await fetch(url,{
             credentials: 'include',
             method: 'POST',
@@ -60,7 +63,7 @@
 
     async function deleteDoc(ev,doc){
         if (confirm(t('really_delete',doc.number))){
-            const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/document/${doc.id}`;
+            const url  = api(`document/${doc.id}`;
             const resp = await fetch(url,{
                 credentials: 'include',
                 method: 'DELETE'

frontend/src/routes/document/Position.svelte

@@ -1,10 +1,19 @@
 <script>
-    import { useTinyRouter } from 'svelte-tiny-router';
     import { onMount }       from 'svelte';
+    import { useTinyRouter } from 'svelte-tiny-router';
+
     import LineEditor        from '../../Components/LineEditor.svelte';
     import MarkdownEditor    from '../../Components/MarkdownEditor.svelte';
     import PriceEditor       from '../../Components/PriceEditor.svelte';
-    var { currency, editable, pos = $bindable(null), submit = (key,newVal) => {}, movePos = (number,step) => {}, drop = (number) => {} } = $props();
+
+    var {
+        currency,
+        drop = (number) => {},
+        editable,
+        movePos = (number,step) => {},
+        pos     = $bindable(null),
+        submit  = (key,newVal) => {}
+    } = $props();
     let prefix = `pos.${pos.number}`
 
     function moveup(){

frontend/src/routes/document/PositionList.svelte

@@ -1,22 +1,29 @@
 <script>
-    import Position from './Position.svelte';
-    import { useTinyRouter } from 'svelte-tiny-router';
     import { onMount }       from 'svelte';
+    import { useTinyRouter } from 'svelte-tiny-router';
+
+    import { api  }          from '../../urls.svelte-js';
     import { t }             from '../../translations.svelte.js';
 
-    var { document = $bindable(null), submit = (key,newVal) => {}, error = $bindable(null) } = $props();
+    import Position          from './Position.svelte';
+
+    var {
+        document = $bindable(null),
+        error = $bindable(null)
+        submit = (key,newVal) => {},
+    } = $props();
 
     let editable = $derived(document.state == 1);
 
     async function updatePositions(resp){
         let json           = await resp.json();
         document.positions = {};
-        setTimeout(() => document.positions = json,100)
         error              = null;
+        setTimeout(() => document.positions = json,100)
     }
 
     async function movePos(number,step){
-        const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/document/${document.id}/position`;
+        const url = api(`document/${document.id}/position`;
         const resp = await fetch(url,{
             method     : 'PATCH',
             credentials: 'include',
@@ -32,7 +39,7 @@
     async function drop(number){
         let confirmed = confirm(t('confirm_deletion').replace('{pos}',document.positions[number].item));
         if (!confirmed) return;
-        const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/document/${document.id}/position`;
+        const url = api(`document/${document.id}/position`;
         const resp = await fetch(url,{
             method     : 'DELETE',
             credentials: 'include',

frontend/src/routes/document/PositionSelector.svelte

@@ -1,10 +1,15 @@
 <script>
     import { t }        from '../../translations.svelte.js';
+
     import EstimateList from './EstimateList.svelte';
     import ItemList     from './ItemList.svelte';
     import TimeList     from './TimeList.svelte';
 
-    let { close = () => {}, doc = $bindable({}), onSelect = (item) => {} } = $props();
+    let {
+        close = () => {},
+        doc = $bindable({}),
+        onSelect = (item) => {}
+    } = $props();
 
     let source = $state(0);
 

frontend/src/routes/document/Send.svelte

@@ -1,19 +1,20 @@
 <script>
     import { onMount }       from 'svelte';
-    import { t } from '../../translations.svelte.js';
     import { useTinyRouter } from 'svelte-tiny-router';
 
-    const router = useTinyRouter();
+    import { api }           from '../../urls.svelte.js';
+    import { t }             from '../../translations.svelte.js';
 
-    let { id } = $props();
+    let   content = $state(null);
-    let error = $state(null);
     let   doc     = $state(null);
     let   email   = $state(null);
-    let content = $state(null);
+    let   error   = $state(null);
+    const router  = useTinyRouter();
     let   subject = $state(null);
+    let { id }    = $props();
 
     async function loadDoc(){
-        let url = `${location.protocol}//${location.host.replace('5173','8080')}/api/document/${id}`;
+        let url  = api(`document/${id}`);
         let resp = await fetch(url,{credentials:'include'});
         if (resp.ok){
             doc     = await resp.json();
@@ -24,7 +25,7 @@
             error = await resp.text();
             return;
         }
-        url = `${location.protocol}//${location.host.replace('5173','8080')}/api/document/${id}/settings`;
+        url  = api(`document/${id}/settings`);
         resp = await fetch(url,{credentials:'include'});
         if (resp.ok){
             const settings = await resp.json();
@@ -36,7 +37,7 @@
 
     async function doSend(){
         var data = {email:email,subject:subject,content:content};
-        const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/document/${id}/send`;
+        const url  = api(`document/${id}/send`);
         const resp = await fetch(url,{
             credentials : 'include',
             method      : 'POST',

frontend/src/routes/document/StateSelector.svelte

@@ -1,14 +1,21 @@
 <script>
     import {onMount} from 'svelte';
+
+    import {api}     from '../../urls.svelte.js';
     import {t}       from '../../translations.svelte.js';
-    let { caption = t('select_state'), selected = $bindable(0), onchange = (val) => console.log('changed to '+val)} = $props();
+
+    let {
+        caption  = t('select_state'),
+        onchange = (val) => console.log('changed to '+val),
+        selected = $bindable(0)
+    } = $props();
 
     let message = $state(t('loading'));
     let states  = $state(null);
 
     async function loadStates(){
-        const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/document/states`;
+        const url  = api('document/states');
-        var resp = await fetch(url,{credentials: 'include'});
+        const resp = await fetch(url,{credentials: 'include'});
         if (resp.ok){
             states  = await resp.json();
         } else {

frontend/src/routes/document/TemplateSelector.svelte

@@ -1,12 +1,21 @@
 <script>
     import {onMount} from 'svelte';
+
+    import {api}     from '../../urls.svelte.js';
     import {t}       from '../../translations.svelte.js';
-    let { caption, company, value = $bindable(0), onchange = () => console.log('changed')} = $props();
+
+    let {
+        caption,
+        company,
+        value = $bindable(0),
+        onchange = () => console.log('changed')
+    } = $props();
+
     let message   = t('loading');
     let templates = $state(null);
 
     async function loadTemplates(){
-        const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/document/templates`;
+        const url = api('document/templates');
         var resp = await fetch(url,{
             credentials : 'include',
             method      : 'POST',

frontend/src/routes/document/TimeList.svelte

@@ -1,15 +1,20 @@
 <script>
-    import { t } from '../../translations.svelte.js';
     import { onMount } from 'svelte';
 
-    let { company_id, onSelect = (time) => {} } = $props();
+    import { api }     from '../../urls.svelte.js';
+    import { t }       from '../../translations.svelte.js';
 
+    let {
+        company_id,
+        onSelect = (time) => {}
+    } = $props();
+
+    let error    = $state(null);
     let projects = $state(null);
     let times    = $state(null);
-    let error = $state(null);
 
     async function loadProjects(){
-        const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/project/list`;
+        const url  = api'project/list');
         let data   = { company_id: company_id };
         const resp = await fetch(url,{
             credentials : 'include',
@@ -24,7 +29,7 @@
     }
 
     async function loadTimes(projectId){
-        const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/times/list`;
+        const url = api('times/list');
         let data = { company_id: company_id, project_id: projectId };
         const resp = await fetch(url,{
             credentials : 'include',

frontend/src/routes/document/TypeSelector.svelte

@@ -1,12 +1,20 @@
 <script>
     import {onMount} from 'svelte';
+
+    import {api}     from '../../urls.svelte.js';
     import {t}       from '../../translations.svelte.js';
-    let { caption, value = $bindable(0), onchange = () => console.log('changed')} = $props();
+
+    let {
+        caption,
+        onchange = () => console.log('changed'),
+        value = $bindable(0)
+    } = $props();
+
     let message = t('loading');
     let types   = $state(null);
 
     async function loadTypes(){
-        const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/document/types`;
+        const url = api('api/document/types');
         var resp = await fetch(url,{credentials: 'include'});
         if (resp.ok){
             types = await resp.json();

frontend/src/routes/document/View.svelte

@@ -1,9 +1,11 @@
 <script>
     import { onMount }       from 'svelte';
+    import { useTinyRouter } from 'svelte-tiny-router';
+
+    import {api}             from '../../urls.svelte.js';
     import { t }             from '../../translations.svelte.js';
     import { user }          from '../../user.svelte.js';
 
-    import { useTinyRouter } from 'svelte-tiny-router';
     import LineEditor        from '../../Components/LineEditor.svelte';
     import MarkdownEditor    from '../../Components/MarkdownEditor.svelte';
     import MultilineEditor   from '../../Components/MultilineEditor.svelte';
@@ -13,20 +15,19 @@
     import StateSelector     from './StateSelector.svelte';
     import TemplateSelector  from './TemplateSelector.svelte';
 
-    const router = useTinyRouter();
 
-    let { id } = $props();
-    let error = $state(null);
     let   doc           = $state(null);
-    let pdfDisabled = $state(false);
-    let sndDisabled = $state(false);
-    let position_select = $state(false);
-
     let   editable      = $derived(doc.state == 1);
+    let   error         = $state(null);
+    let   { id }        = $props();
+    let   pdfDisabled   = $state(false);
+    let position_select = $state(false);
+    const router        = useTinyRouter();
+    let   sndDisabled   = $state(false);
 
 
     async function loadDoc(){
-        const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/document/${id}`;
+        const url  =  api(`document/${id}`;
         const resp = await fetch(url,{credentials:'include'});
         if (resp.ok){
             doc   = await resp.json();
@@ -60,7 +61,7 @@
             data[parts.pop()] = inner;
         }
         try {
-            const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/document/${doc.id}`;
+            const url  = api(`document/${doc.id}`;
             const resp = await fetch(url,{
                 credentials : 'include',
                 method      : 'PATCH',
@@ -73,7 +74,7 @@
     }
 
     async function addPosition(selected){
-        const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/document/${doc.id}/position`;
+        const url  = api(`document/${doc.id}/position`;
         const resp = await fetch(url,{
             method      : 'POST',
             credentials : 'include',
@@ -90,7 +91,7 @@
     async function render(ev){
         pdfDisabled = true;
 
-        const url = `${location.protocol}//${location.host.replace('5173','8080')}/api/document/${doc.id}/pdf`;
+        const url   = api(`document/${doc.id}/pdf`;
         const resp  = await fetch(url,{credentials:'include'});
         if (resp.ok){
             error             = null;