chore(web): migration svelte 5 syntax (#13883)

web/src/lib/components/faces-page/set-birth-date-modal.svelte

@@ -5,11 +5,20 @@
   import DateInput from '../elements/date-input.svelte';
   import { t } from 'svelte-i18n';
 
-  export let birthDate: string;
-  export let onClose: () => void;
-  export let onUpdate: (birthDate: string) => void;
+  interface Props {
+    birthDate: string;
+    onClose: () => void;
+    onUpdate: (birthDate: string) => void;
+  }
+
+  let { birthDate = $bindable(), onClose, onUpdate }: Props = $props();
 
   const todayFormatted = new Date().toISOString().split('T')[0];
+
+  const onSubmit = (event: Event) => {
+    event.preventDefault();
+    onUpdate(birthDate);
+  };
 </script>
 
 <FullScreenModal title={$t('set_date_of_birth')} icon={mdiCake} {onClose}>
@@ -19,7 +28,7 @@
     </p>
   </div>
 
-  <form on:submit|preventDefault={() => onUpdate(birthDate)} autocomplete="off" id="set-birth-date-form">
+  <form onsubmit={(e) => onSubmit(e)} autocomplete="off" id="set-birth-date-form">
     <div class="my-4 flex flex-col gap-2">
       <DateInput
         class="immich-form-input"
@@ -31,8 +40,9 @@
       />
     </div>
   </form>
-  <svelte:fragment slot="sticky-bottom">
-    <Button color="gray" fullwidth on:click={onClose}>{$t('cancel')}</Button>
+
+  {#snippet stickyBottom()}
+    <Button color="gray" fullwidth onclick={onClose}>{$t('cancel')}</Button>
     <Button type="submit" fullwidth form="set-birth-date-form">{$t('set')}</Button>
-  </svelte:fragment>
+  {/snippet}
 </FullScreenModal>