[*] align text fields to the left in WebUI grids (#619)

Author: pashagolub

internal/webui/src/pages/MetricsPage/components/MetricsGrid/MetricsGrid.consts.tsx

@@ -23,15 +23,15 @@ export const useMetricsGridColumns = (): GridColDef<MetricGridRow>[] => ([
     field: "Description",
     headerName: "Description",
     width: 200,
-    align: "center",
+    align: "left",
     headerAlign: "center",
     valueGetter: ({ row }) => row.Metric.Description,
   },
   {
     field: "InitSQL",
     headerName: "InitSQL",
     width: 200,
-    align: "center",
+    align: "left",
     headerAlign: "center",
     valueGetter: ({ row }) => row.Metric.InitSQL,
   },
@@ -63,7 +63,7 @@ export const useMetricsGridColumns = (): GridColDef<MetricGridRow>[] => ([
     field: "StorageName",
     headerName: "Storage name",
     width: 200,
-    align: "center",
+    align: "left",
     headerAlign: "center",
     valueGetter: ({ row }) => row.Metric.StorageName,
   },

internal/webui/src/pages/PresetsPage/components/PresetsGrid/PresetsGrid.consts.tsx

@@ -15,7 +15,7 @@ export const usePresetsGridColumns = (): GridColDef<PresetGridRow>[] => ([
     field: "Description",
     headerName: "Description",
     flex: 1,
-    align: "center",
+    align: "left",
     headerAlign: "center",
     valueGetter: ({ row }) => row.Preset.Description,
   },

internal/webui/src/pages/SourcesPage/components/SourcesGrid/SourcesGrid.consts.tsx

@@ -24,68 +24,68 @@ export const useSourcesGridColumns = (): GridColDef<Source>[] => ([
     field: "Group",
     headerName: "Group",
     width: 150,
-    align: "center",
+    align: "left",
     headerAlign: "center",
   },
   {
     field: "ConnStr",
     headerName: "Connection string",
     flex: 1,
     minWidth: 300,
-    align: "center",
+    align: "left",
     headerAlign: "center",
     renderCell: ({ row }) => <MaskConnectionString source={row} />,
   },
   {
     field: "Metrics",
     width: 120,
-    align: "center",
+    align: "left",
     headerAlign: "center",
     renderCell: ({ row }) => <MetricPopUp Metrics={row.Metrics} />
   },
   {
     field: "Metrics Standby",
     width: 120,
-    align: "center",
+    align: "left",
     headerAlign: "center",
     renderCell: ({ row }) => <MetricPopUp Metrics={row.MetricsStandby} />
   },
   {
     field: "Kind",
     headerName: "Type",
-    align: "center",
+    align: "left",
     headerAlign: "center",
     hide: true,
   },
   {
     field: "IncludePattern",
     headerName: "Inclusion pattern",
     width: 150,
-    align: "center",
+    align: "left",
     headerAlign: "center",
     hide: true,
   },
   {
     field: "ExcludePattern",
     headerName: "Exclusion pattern",
     width: 150,
-    align: "center",
+    align: "left",
     headerAlign: "center",
     hide: true,
   },
   {
     field: "PresetMetrics",
     headerName: "Metrics preset",
     width: 150,
-    align: "center",
+    align: "left",
     headerAlign: "center",
     hide: true,
   },
   {
     field: "PresetMetricsStandby",
     headerName: "Metrics standby preset",
     width: 150,
-    align: "center",
+    align: "left",
     headerAlign: "center",
     hide: true,
   },