fix: tables

src/lib/components/viewSelector.svelte

@@ -96,14 +96,16 @@
                 <ActionMenu.Root>
                     <Layout.Stack>
                         {#each $columns as column}
-                            <InputCheckbox
-                                id={column.id}
-                                label={column.title}
-                                on:change={() => (column.hide = !column.hide)}
-                                checked={!column.hide}
-                                disabled={allowNoColumns
-                                    ? false
-                                    : selectedColumnsNumber <= 1 && column.hide !== true} />
+                            {#if !column?.exclude}
+                                <InputCheckbox
+                                    id={column.id}
+                                    label={column.title}
+                                    on:change={() => (column.hide = !column.hide)}
+                                    checked={!column.hide}
+                                    disabled={allowNoColumns
+                                        ? false
+                                        : selectedColumnsNumber <= 1 && column.hide !== true} />
+                            {/if}
                         {/each}
                     </Layout.Stack>
                 </ActionMenu.Root>

src/lib/constants.ts

@@ -380,13 +380,13 @@ export const scopes: {
     },
     {
         scope: 'log.read',
-        description: "Access to read your sites's  logs",
+        description: "Access to read your sites's logs",
         category: 'Sites',
         icon: 'globe'
     },
     {
         scope: 'log.write',
-        description: "Access to execute your project's sites",
+        description: "Access to delete your site's logs",
         category: 'Sites',
         icon: 'globe'
     }

src/lib/helpers/types.ts

@@ -31,6 +31,7 @@ export type Column = PinkColumn & {
     array?: boolean;
     format?: string;
     show?: boolean;
+    exclude?: boolean;
     elements?: string[] | { value: string | number; label: string }[];
 };
 

src/routes/(console)/project-[project]/sites/site-[site]/deployments/store.ts

@@ -4,12 +4,12 @@ import type { Column } from '$lib/helpers/types';
 export const showCreateDeployment: Writable<boolean> = writable(false);
 
 export const columns = writable<Column[]>([
-    { id: '$id', title: 'Deployment ID', type: 'string', width: 200 },
+    { id: '$id', title: 'Deployment ID', type: 'string', width: { min: 200, max: 250 } },
     {
         id: 'status',
         title: 'Status',
         type: 'enum',
-        width: 110,
+        width: { min: 90, max: 130 },
         array: true,
         format: 'enum',
         elements: ['ready', 'processing', 'building', 'waiting', 'cancelled', 'failed']
@@ -19,7 +19,8 @@ export const columns = writable<Column[]>([
         id: 'buildDuration',
         title: 'Build duration',
         type: 'integer',
-        width: 90,
+        width: { min: 110, max: 170 },
+
         elements: [
             {
                 value: 15,
@@ -41,7 +42,7 @@ export const columns = writable<Column[]>([
         title: 'Source size',
         type: 'integer',
         hide: true,
-        width: 140,
+        width: { min: 110, max: 170 },
         elements: [
             {
                 value: 2 * 1000 * 1000,
@@ -62,13 +63,13 @@ export const columns = writable<Column[]>([
         title: 'Build size',
         type: 'integer',
         filter: false,
-        width: 80
+        width: { min: 90, max: 140 }
     },
     {
         id: 'type',
         title: 'Source',
         type: 'string',
-        width: 90,
+        width: { min: 90, max: 140 },
         array: true,
         format: 'enum',
         elements: [
@@ -81,7 +82,8 @@ export const columns = writable<Column[]>([
         id: '$updatedAt',
         title: 'Updated',
         type: 'datetime',
-        width: 150,
+        width: { min: 150, max: 180 },
+
         format: 'datetime'
     }
 ]);

src/routes/(console)/project-[project]/sites/site-[site]/domains/store.ts

@@ -7,19 +7,19 @@ export const columns = writable<Column[]>([
         title: 'Domain',
         type: 'string',
         format: 'string',
-        width: { min: 120, max: 400 }
+        width: { min: 200, max: 600 }
     },
 
     {
         id: 'redirectUrl',
         title: 'Redirect to',
         type: 'string',
-        width: { min: 120, max: 200 }
+        width: { min: 120, max: 300 }
     },
     {
         id: 'deploymentVcsProviderBranch',
         title: 'Production branch',
         type: 'string',
-        width: { min: 70, max: 150 }
+        width: { min: 90, max: 150 }
     }
 ]);

src/routes/(console)/project-[project]/sites/site-[site]/logs/store.ts

@@ -2,12 +2,12 @@ import type { Column } from '$lib/helpers/types';
 import { writable } from 'svelte/store';
 
 export const columns = writable<Column[]>([
-    { id: '$id', title: 'Log ID', type: 'string', width: 200 },
+    { id: '$id', title: 'Log ID', type: 'string', width: { min: 200, max: 250 } },
     {
         id: 'requestPath',
         title: 'Path',
         type: 'string',
-        width: 90,
+        width: { min: 500, max: 900 },
         format: 'string'
     },
 
@@ -15,7 +15,7 @@ export const columns = writable<Column[]>([
         id: 'trigger',
         title: 'Trigger',
         type: 'string',
-        hide: true,
+        exclude: true,
         width: 90,
         array: true,
         format: 'enum',
@@ -30,7 +30,7 @@ export const columns = writable<Column[]>([
         id: 'requestMethod',
         title: 'Method',
         type: 'string',
-        hide: true,
+        exclude: true,
         width: 70,
         array: true,
         format: 'enum',
@@ -40,7 +40,7 @@ export const columns = writable<Column[]>([
         id: 'responseStatusCode',
         title: 'Status code',
         type: 'integer',
-        hide: true,
+        exclude: true,
         width: 100,
         format: 'integer',
         elements: [
@@ -84,13 +84,14 @@ export const columns = writable<Column[]>([
                 label: 'more than 30 seconds'
             }
         ],
-        filter: false
+        filter: false,
+        exclude: true
     },
     {
         id: '$createdAt',
         title: 'Created',
+        width: { min: 150, max: 180 },
         type: 'datetime',
-        width: 120,
         format: 'datetime',
         elements: [
             {

src/routes/(console)/project-[project]/sites/site-[site]/logs/table.svelte

@@ -15,7 +15,7 @@
 
 <Table.Root {columns} let:root>
     <svelte:fragment slot="header" let:root>
-        {#each columns as { id, title }}
+        {#each columns.filter((c) => !c.exclude) as { id, title }}
             <Table.Header.Cell column={id} {root}>{title}</Table.Header.Cell>
         {/each}
     </svelte:fragment>
@@ -26,7 +26,7 @@
                 openSheet = true;
                 selectedLogId = log.$id;
             }}>
-            {#each columns as column}
+            {#each columns.filter((c) => !c.exclude) as column}
                 <Table.Cell column={column.id} {root}>
                     {#if column.id === '$id'}
                         {#key column.id}
@@ -38,10 +38,12 @@
                         {log.responseStatusCode}
                     {:else if column.id === 'requestPath'}
                         <Layout.Stack direction="row" alignItems="center" gap="s">
-                            <Badge
-                                variant="secondary"
-                                type={log.responseStatusCode >= 400 ? 'error' : 'success'}
-                                content={log.responseStatusCode.toString()} />
+                            <div>
+                                <Badge
+                                    variant="secondary"
+                                    type={log.responseStatusCode >= 400 ? 'error' : 'success'}
+                                    content={log.responseStatusCode.toString()} />
+                            </div>
                             <Typography.Code size="m">
                                 {log.requestMethod}
                             </Typography.Code>