From 7e87751caf37d227ecc43293148870b424cbdca1 Mon Sep 17 00:00:00 2001
From: Thomas Zahari <tzahari@users.noreply.github.com>
Date: Fri, 12 Jul 2024 16:42:26 +0200
Subject: [PATCH] Added right alignment for NumberColumns and price Removed
 seconds from date / times Removed decimals from spool length and weight

---
 client/src/components/column.tsx    |  5 ++++-
 client/src/pages/filaments/list.tsx |  5 +++--
 client/src/pages/spools/list.tsx    | 10 ++++++----
 3 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/client/src/components/column.tsx b/client/src/components/column.tsx
index b671018..bd76273 100644
--- a/client/src/components/column.tsx
+++ b/client/src/components/column.tsx
@@ -44,6 +44,7 @@ interface BaseColumnProps<Obj extends Entity> {
   i18ncat?: string;
   i18nkey?: string;
   title?: string;
+  align?: AlignType;
   sorter?: boolean;
   t: (key: string) => string;
   navigate: (link: string) => void;
@@ -87,6 +88,7 @@ function Column<Obj extends Entity>(
 
   const columnProps: ColumnType<Obj> = {
     dataIndex: props.id,
+    align: props.align,
     title: props.title ?? t(props.i18nkey ?? `${props.i18ncat}.fields.${props.id}`),
     filterMultiple: props.allowMultipleFilters ?? true,
     width: props.width ?? undefined,
@@ -226,6 +228,7 @@ interface NumberColumnProps<Obj extends Entity> extends BaseColumnProps<Obj> {
 export function NumberColumn<Obj extends Entity>(props: NumberColumnProps<Obj>) {
   return Column({
     ...props,
+    align: 'right',
     render: (rawValue) => {
       const value = props.transform ? props.transform(rawValue) : rawValue;
       if (value === null || value === undefined) {
@@ -255,7 +258,7 @@ export function DateColumn<Obj extends Entity>(props: BaseColumnProps<Obj>) {
           hidden={!value}
           value={dayjs.utc(value).local()}
           title={dayjs.utc(value).local().format()}
-          format="YYYY-MM-DD HH:mm:ss"
+          format="YYYY-MM-DD HH:mm"
         />
       );
     },
diff --git a/client/src/pages/filaments/list.tsx b/client/src/pages/filaments/list.tsx
index c90850a..a550087 100644
--- a/client/src/pages/filaments/list.tsx
+++ b/client/src/pages/filaments/list.tsx
@@ -260,6 +260,7 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
             ...commonProps,
             id: "price",
             i18ncat: "filament",
+            align: 'right',
             width: 80,
             render: (_, obj: IFilamentCollapsed) => {
               return obj.price?.toLocaleString(undefined, {
@@ -291,7 +292,7 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
             id: "weight",
             i18ncat: "filament",
             unit: "g",
-            maxDecimals: 1,
+            maxDecimals: 0,
             width: 100,
           }),
           NumberColumn({
@@ -299,7 +300,7 @@ export const FilamentList: React.FC<IResourceComponentsProps> = () => {
             id: "spool_weight",
             i18ncat: "filament",
             unit: "g",
-            maxDecimals: 1,
+            maxDecimals: 0,
             width: 100,
           }),
           FilteredQueryColumn({
diff --git a/client/src/pages/spools/list.tsx b/client/src/pages/spools/list.tsx
index 2046368..34ebdea 100644
--- a/client/src/pages/spools/list.tsx
+++ b/client/src/pages/spools/list.tsx
@@ -363,6 +363,7 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
             ...commonProps,
             id: "price",
             i18ncat: "spool",
+            align: 'right',
             width: 80,
             render: (_, obj: ISpoolCollapsed) => {
               return obj.price?.toLocaleString(undefined, {
@@ -377,8 +378,9 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
             ...commonProps,
             id: "used_weight",
             i18ncat: "spool",
+            align: 'right',
             unit: "g",
-            maxDecimals: 1,
+            maxDecimals: 0,
             width: 110,
           }),
           NumberColumn({
@@ -386,7 +388,7 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
             id: "remaining_weight",
             i18ncat: "spool",
             unit: "g",
-            maxDecimals: 1,
+            maxDecimals: 0,
             defaultText: t("unknown"),
             width: 110,
           }),
@@ -395,7 +397,7 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
             id: "used_length",
             i18ncat: "spool",
             unit: "mm",
-            maxDecimals: 1,
+            maxDecimals: 0,
             width: 120,
           }),
           NumberColumn({
@@ -403,7 +405,7 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
             id: "remaining_length",
             i18ncat: "spool",
             unit: "mm",
-            maxDecimals: 1,
+            maxDecimals: 0,
             defaultText: t("unknown"),
             width: 120,
           }),