Split event view into components

src/routes/private/events/event/view/components/GoogleAuthentication.svelte

@@ -0,0 +1,26 @@
+<script lang="ts">
+  import GoogleAuthButton from '$lib/components/GoogleAuthButton.svelte';
+
+  let { loading, onSuccess, onError } = $props<{
+    loading: boolean;
+    onSuccess: () => void;
+    onError: (message: string) => void;
+  }>();
+</script>
+
+<div class="rounded-lg border border-gray-300 bg-white p-6 mb-4">
+  <div class="mb-4 flex items-center justify-between">
+    <h2 class="text-xl font-semibold text-gray-900">Google Account</h2>
+    <p class="text-sm text-gray-500">Required for syncing participants and sending emails</p>
+  </div>
+  {#if loading}
+    <div class="h-10 w-48 animate-pulse rounded bg-gray-200"></div>
+  {:else}
+    <GoogleAuthButton 
+      size="small" 
+      variant="secondary"
+      onSuccess={onSuccess}
+      onError={onError}
+    />
+  {/if}
+</div>