src/routes/app/+layout.svelte

@@ -8,11 +8,11 @@
 	import { Cog, LogOut, MessageCircleMore, UsersRound } from 'lucide-svelte';
 	import type { Snippet } from 'svelte';
 	import { onMount } from 'svelte';
-	import type { PageData } from './$types';
+	import type { LayoutData } from './$types';
 
 	type Props = {
 		children: Snippet;
-		data: PageData;
+		data: LayoutData;
 	};
 
 	let { children, data }: Props = $props();

src/routes/app/settings/+page.server.ts

@@ -27,7 +27,7 @@ export const load = async (event) => {
 };
 
 export const actions = {
-	update: async (event) => {
+	default: async (event) => {
 		const form = await event.request.formData();
 		const tenantId = event.locals.tenant.id;
 

src/routes/app/settings/+page.svelte

@@ -2,11 +2,10 @@
 	import { enhance } from '$app/forms';
 	import { Button } from '$lib/components/Actions';
 	import { TextInput } from '$lib/components/DataInput';
+	import Divider from '$lib/components/Layout/Divider.svelte';
 	import { messages } from '$lib/i18n';
 	import { Fingerprint, KeyRound, PhoneOutgoing } from 'lucide-svelte';
-	import { fade } from 'svelte/transition';
 	import type { ActionData, PageData } from './$types';
-	import Divider from '$lib/components/Layout/Divider.svelte';
 
 	type Props = {
 		data: PageData;
@@ -17,18 +16,18 @@
 	let configs = $derived(form?.configs ?? data.configs);
 </script>
 
-<div class="page" transition:fade>
+<div class="page">
 	<div class="card w-full max-w-xl bg-base-200 px-4 pt-4 shadow-xl">
 		<div class="card-title justify-center">
 			<h2 class="text-2xl font-semibold">{messages.settings_title()}</h2>
 			{#if form?.error}
-				<div role="alert" class="alert alert-error absolute -top-20" transition:fade>
+				<div role="alert" class="alert alert-error absolute -top-20">
 					<i class="fi fi-bs-octagon-xmark h-6 w-6 shrink-0"></i>
 					<span>{form.error}</span>
 				</div>
 			{/if}
 		</div>
-		<form id="sms" method="POST" action="?/update" use:enhance>
+		<form id="sms" method="POST" use:enhance>
 			<div class="card-body">
 				<Divider />
 				<!-- Twilio -->

src/routes/app/sms/+page.server.ts

@@ -37,7 +37,7 @@ export const load = async (event) => {
 };
 
 export const actions = {
-	push: async (event) => {
+	default: async (event) => {
 		const form = await event.request.formData();
 
 		if (!form.has('phone')) {

src/routes/app/sms/+page.svelte

@@ -7,7 +7,6 @@
 	import { Link } from '$lib/components/Navigation';
 	import { messages } from '$lib/i18n';
 	import { CircleX, MessageCircleMore, PhoneOutgoing, TriangleAlert } from 'lucide-svelte';
-	import { fade } from 'svelte/transition';
 	import type { ActionData, PageData } from './$types';
 
 	type Props = {
@@ -25,7 +24,7 @@
 	<MessageCircleMore size="18" /> {messages.sms_label_message()}
 {/snippet}
 
-<div class="page" transition:fade>
+<div class="page">
 	<div class="card bg-base-200 px-4 pt-4 shadow-xl">
 		{#if form?.error}
 			<Alert status="error">
@@ -49,7 +48,7 @@
 		<div class="card-title justify-center">
 			<h2 class="text-2xl font-semibold">{messages.sms_prompt()}</h2>
 		</div>
-		<form id="sms" method="POST" action="?/push" use:enhance>
+		<form id="sms" method="POST" use:enhance>
 			<div class="card-body">
 				<TextInput
 					disabled={!data.isTwilioConfigured}