Add sorting to Quick Links

src/lib/islands/quick-link-island.svelte

@@ -1,6 +1,6 @@
-<script>
+<script lang="ts">
   import Island from '$lib/islands/island.svelte';
-  import { ql } from '$lib/stores/quick-links.js';
+  import { ql } from '$lib/stores/quick-links';
   export let variables = {
     title: 'Quick Links'
   };

src/lib/islands/quick-link-set-island.svelte

@@ -1,11 +1,11 @@
-<script>
+<script lang="ts">
   import Island from '$lib/islands/island.svelte';
-  import { ql } from '$lib/stores/quick-links.js';
+  import { ql } from '$lib/stores/quick-links';
   export let variables = {
     title: 'Quick Links'
   };
 
-  let qlData = [];
+  let qlData: string[] = [];
   $: {
     qlData = $ql;
     console.log(qlData);
@@ -13,16 +13,16 @@
 
   let saveButton = 'Save';
 
-  async function timeout(ms) {
+  async function timeout(ms: number): Promise<any> {
     return new Promise((resolve) => setTimeout(resolve, ms));
   }
 
   async function saveQl() {
     // Fetch the content of all text entries within the island then run ql.set([ARRAY OF INPUT CONTENT])
     const inputs = document.getElementsByClassName('qlInput');
-    let inputLinks = [];
+    let inputLinks: string[] = [];
     for (let item of inputs) {
-      let text = item?.value;
+      let text = (<HTMLInputElement>item)?.value;
       if (text !== '') {
         inputLinks.push(text);
       }
@@ -46,7 +46,7 @@
     ql.set(updatedQl);
   }
 
-  function handleClick(event) {
+  function handleClick(event: any) {
     // Handle the click event here
     console.log('Island Clicked');
     // You can access the `variables` passed to the Island component here if needed

src/lib/overlays/welcome.svelte

@@ -1,12 +1,9 @@
-<script>
+<script lang="ts">
   import { welcome } from '$lib/stores/welcome';
   import { fade } from 'svelte/transition';
   import { version } from '$lib/stores/version';
 
-  const variables = {
-    title: 'Welcome to OwlBoard'
-  };
-  let pageNum = 0;
+  let pageNum: number = 0;
 
   function pageUp() {
     pageNum++;
@@ -22,7 +19,7 @@
     welcome.set(version);
   }
 
-  const pageText = [
+  const pageText: string[] = [
     '<h3>A brand new look</h3>' +
       "<p>OwlBoard has a brand new look, making it even faster for you to access the data - you won't have to register again.</p>" +
       "<p><strong>Live station data</strong> is still available right from the homepage.  If you are signed up, you'll get improved data from the <strong>Staff board</strong>.  Bus and Ferry services are still included</p>" +

src/lib/stores/quick-links.ts

@@ -1,10 +1,10 @@
-import { writable } from 'svelte/store';
+import { writable, type Writable } from 'svelte/store';
 import { browser } from '$app/environment';
 
 export const ql = writable(fromLocalStorage('ql', []));
 toLocalStorage(ql, 'ql');
 
-function fromLocalStorage(storageKey, fallback) {
+function fromLocalStorage(storageKey: string, fallback: string[]): string[] {
   if (browser) {
     const storedValue = localStorage.getItem(storageKey);
     if (storedValue !== 'undefined' && storedValue !== null) {
@@ -14,10 +14,10 @@ function fromLocalStorage(storageKey, fallback) {
   return fallback;
 }
 
-function toLocalStorage(store, storageKey) {
+function toLocalStorage(store: Writable<string[]>, storageKey: string) {
   if (browser) {
     store.subscribe((value) => {
-      let storageValue = typeof value === 'object' ? JSON.stringify(value) : value;
+      let storageValue = typeof value === 'object' ? JSON.stringify(value.sort()) : value;
 
       localStorage.setItem(storageKey, storageValue);
     });