chore: fix typo, clean URL, de-dup toast (#407)

pkg/api/handlers.go

@@ -871,7 +871,7 @@ func checkHealth(k8sResources *K8sResources, disconnected chan error) http.Handl
 		// Set headers to keep connection alive
 		rest.WriteHeaders(w)
 
-		ticker := time.NewTicker(30 * time.Second)
+		ticker := time.NewTicker(10 * time.Second)
 		defer ticker.Stop()
 
 		recovering := false

ui/src/lib/features/toast/store.test.ts

@@ -5,7 +5,7 @@ import { get } from 'svelte/store'
 
 import { afterEach, beforeEach, describe, expect, vi } from 'vitest'
 
-import { addToast, getIdByMessage, removeToast, toast, type Toast } from './store'
+import { addToast, removeToast, toast, type Toast } from './store'
 
 describe('Toast Store', () => {
   beforeEach(() => {
@@ -116,12 +116,4 @@ describe('Toast Store', () => {
 
     expect(get(toast)).toHaveLength(1)
   })
-
-  test('gets toast id by message', () => {
-    const toast1: Toast = { message: 'Toast 1', timeoutSecs: 3, type: 'info' }
-    addToast(toast1)
-
-    const id = getIdByMessage('Toast 1')
-    expect(id).toBeDefined()
-  })
 })

ui/src/lib/features/toast/store.ts

@@ -1,7 +1,7 @@
 // SPDX-License-Identifier: Apache-2.0
 // SPDX-FileCopyrightText: 2024-Present The UDS Authors
 
-import { get, writable } from 'svelte/store'
+import { writable } from 'svelte/store'
 
 export type Toast = {
   id?: number
@@ -13,9 +13,12 @@ export type Toast = {
 export const toast = writable<Toast[]>([])
 
 export const addToast = (newToast: Toast) => {
-  console.log('addToast', newToast)
-
   toast.update((toasts) => {
+    // don't show duplicate toasts
+    if (toasts.some((toast) => toast.message === newToast.message)) {
+      return toasts
+    }
+
     const id = Date.now() + Math.random()
     const toast = { id, ...newToast }
 
@@ -29,13 +32,3 @@ export const addToast = (newToast: Toast) => {
 export const removeToast = (id?: number) => {
   toast.update((toasts) => toasts.filter((toast) => toast.id !== id))
 }
-
-export const getIdByMessage = (message: string) => {
-  let id: number | undefined
-  const toasts = get(toast)
-  const found = toasts.find((toast) => toast.message === message)
-  if (found) {
-    id = found.id
-  }
-  return id
-}

ui/src/lib/utils/api-auth.ts

@@ -26,10 +26,10 @@ export class APIAuth {
   }
 }
 
-const http = new APIAuth()
+const apiAuth = new APIAuth()
 const Auth = {
   connect: async (token: string) => {
-    return await http.request(token)
+    return await apiAuth.request(token)
   },
 }
 

ui/src/lib/utils/cluster-check/cluster-check.ts

@@ -1,5 +1,5 @@
 import { addToast } from '$features/toast'
-import { getIdByMessage, removeToast } from '$features/toast/store'
+import { toast } from '$features/toast/store'
 
 // checkClusterConnection checks the connection to the cluster and
 // shows a toast message if the connection is lost or restored.
@@ -19,11 +19,8 @@ export function checkClusterConnection() {
   // handle cluster disconnection and reconnection events
   clusterCheck.onmessage = (msg) => {
     const data = JSON.parse(msg.data) as Record<'success' | 'error' | 'reconnected', string>
-    const errToast = getIdByMessage(disconnectedMsg)
-
-    // remove error toast if cluster is reconnected
-    if (errToast && data['reconnected']) {
-      removeToast(errToast)
+    if (data['reconnected']) {
+      toast.update(() => [])
       addToast({
         type: 'success',
         message: 'Cluster connection restored',
@@ -39,7 +36,7 @@ export function checkClusterConnection() {
     }
 
     // only show error toast once and make timeout really long
-    if (!errToast && data['error']) {
+    if (data['error']) {
       addToast({
         type: 'error',
         message: disconnectedMsg,

ui/src/routes/+page.svelte

@@ -5,6 +5,11 @@
   import Unauthenticated from '$components/Auth/component.svelte'
   import { authenticated } from '$features/api-auth/store'
   import { ClusterOverview } from '$features/k8s'
+
+  // remove token param from URL if it exists
+  if (window.location.search.includes('token')) {
+    window.history.replaceState({}, '', window.location.pathname)
+  }
 </script>
 
 <!-- Hide homepage if api auth is enabled and user is not authenticated-->

ui/vite.config.ts

@@ -11,11 +11,11 @@ export default defineConfig(({ mode }) => ({
       // Proxy all requests starting with /api to the go server
       // noting that we ues https and 8443 because by default we use TLS when running locally
       '/api': {
-        target: 'https://runtime-local:8443',
+        target: 'https://runtime-local.uds.dev:8443',
         changeOrigin: true,
       },
       '/health': {
-        target: 'https://runtime-local:8443',
+        target: 'https://runtime-local.uds.dev:8443',
         changeOrigin: true,
       },
     },