Fixed overflow of really long project names.

Author: niemyjski

src/Exceptionless.Web/ClientApp/src/lib/features/projects/components/dialogs/remove-project-config-dialog.svelte

@@ -21,7 +21,7 @@
         <AlertDialog.Header>
             <AlertDialog.Title>Delete Configuration Value</AlertDialog.Title>
             <AlertDialog.Description>
-                Are you sure you want to delete "{name}"?
+                Are you sure you want to delete "<span class="truncate max-w-[200px] inline-block align-bottom" title={name}>{name}</span>"?
             </AlertDialog.Description>
         </AlertDialog.Header>
         <AlertDialog.Footer>

src/Exceptionless.Web/ClientApp/src/lib/features/projects/components/dialogs/remove-project-dialog.svelte

@@ -21,7 +21,7 @@
         <AlertDialog.Header>
             <AlertDialog.Title>Delete Project</AlertDialog.Title>
             <AlertDialog.Description>
-                Are you sure you want to delete "{name}"?
+                Are you sure you want to delete "<span class="truncate max-w-[200px] inline-block align-bottom" title={name}>{name}</span>"?
             </AlertDialog.Description>
         </AlertDialog.Header>
         <AlertDialog.Footer>

src/Exceptionless.Web/ClientApp/src/lib/features/projects/components/dialogs/reset-project-data-dialog.svelte

@@ -21,7 +21,7 @@
         <AlertDialog.Header>
             <AlertDialog.Title>Reset Project Data</AlertDialog.Title>
             <AlertDialog.Description>
-                Are you sure you want to reset all project data for "{name}"? This action cannot be undone and will permanently erase all events, stacks, and
+                Are you sure you want to reset all project data for "<span class="truncate max-w-[200px] inline-block align-bottom" title={name}>{name}</span>"? This action cannot be undone and will permanently erase all events, stacks, and
                 associated data.
             </AlertDialog.Description>
         </AlertDialog.Header>

src/Exceptionless.Web/ClientApp/src/lib/features/webhooks/components/dialogs/remove-webhook-dialog.svelte

@@ -21,7 +21,7 @@
         <AlertDialog.Header>
             <AlertDialog.Title>Delete Webhook</AlertDialog.Title>
             <AlertDialog.Description>
-                Are you sure you want to delete "{url}"?
+                Are you sure you want to delete "<span class="truncate max-w-[200px] inline-block align-bottom" title={url}>{url}</span>"?
             </AlertDialog.Description>
         </AlertDialog.Header>
         <AlertDialog.Footer>

src/Exceptionless.Web/ClientApp/src/routes/(app)/project/[projectId]/+layout.svelte

@@ -33,9 +33,13 @@
 
 <Card.Root>
     <Card.Header>
-        <Card.Title class="text-2xl" level={2}
-            >{#if projectQuery.isSuccess}{projectQuery.data.name}
-            {/if} Settings</Card.Title
+        <Card.Title class="text-2xl flex items-center gap-1" level={2}
+            >{#if projectQuery.isSuccess}
+            <div class="max-w-[70%] overflow-hidden" title={projectQuery.data.name}>
+                <span class="truncate block">{projectQuery.data.name}</span>
+            </div>
+        {/if}
+        <span class="flex-shrink-0">Settings</span></Card.Title
         >
         <Card.Description>Manage your project settings and integrations.</Card.Description>
         <Card.Action>

src/Exceptionless.Web/ClientApp/src/routes/(app)/project/[projectId]/api-keys/+page.svelte

@@ -1,6 +1,5 @@
 <script lang="ts">
     import { page } from '$app/state';
-    import * as DataTable from '$comp/data-table';
     import { H3, Muted } from '$comp/typography';
     import { Button } from '$comp/ui/button';
     import { Separator } from '$comp/ui/separator';

src/Exceptionless.Web/ClientApp/src/routes/(app)/project/[projectId]/configuration-values/+page.svelte

@@ -1,6 +1,5 @@
 <script lang="ts">
     import { page } from '$app/state';
-    import * as DataTable from '$comp/data-table';
     import { A, H3, Muted } from '$comp/typography';
     import { Button } from '$comp/ui/button';
     import { Separator } from '$comp/ui/separator';

src/Exceptionless.Web/ClientApp/src/routes/(app)/project/[projectId]/integrations/+page.svelte

@@ -2,8 +2,7 @@
     import type { NotificationSettings } from '$features/projects/models';
 
     import { page } from '$app/state';
-    import * as DataTable from '$comp/data-table';
-    import { H3, H4, Muted, P } from '$comp/typography';
+    import { H3, H4, Muted } from '$comp/typography';
     import { Button } from '$comp/ui/button';
     import { Separator } from '$comp/ui/separator';
     import { env } from '$env/dynamic/public';

src/Exceptionless.Web/ClientApp/src/routes/(app)/project/[projectId]/settings/+page.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
     import { page } from '$app/state';
-    import { A, H3, H4, Large, Muted, P } from '$comp/typography';
+    import { A, H3, H4, Large, Muted } from '$comp/typography';
     import { Input } from '$comp/ui/input';
     import { Label } from '$comp/ui/label';
     import { Separator } from '$comp/ui/separator';