From 87c3df89792ba2f3f6cdb1b1c94b339b78fdd7f2 Mon Sep 17 00:00:00 2001 From: Nathalie Date: Mon, 1 Sep 2025 17:47:58 +0200 Subject: [PATCH 1/4] Updated row height --- addon/components/hyper-table/cell-renderers/image.hbs | 2 +- app/styles/cells.less | 4 ++-- app/styles/columns.less | 2 +- .../components/hyper-table/cell-renderers/image-test.js | 6 +++--- 4 files changed, 7 insertions(+), 7 deletions(-) diff --git a/addon/components/hyper-table/cell-renderers/image.hbs b/addon/components/hyper-table/cell-renderers/image.hbs index f3742535..7267e025 100644 --- a/addon/components/hyper-table/cell-renderers/image.hbs +++ b/addon/components/hyper-table/cell-renderers/image.hbs @@ -1,5 +1,5 @@
- {{upf-image src=this.imageURL classNames="upf-image--round-36"}} + {{upf-image src=this.imageURL classNames="upf-image--round-24"}}
{{#if (gt @column.labels.length 0)}} diff --git a/app/styles/cells.less b/app/styles/cells.less index ae707f39..c23bb313 100644 --- a/app/styles/cells.less +++ b/app/styles/cells.less @@ -1,4 +1,4 @@ -@cell-height: 60px; +@cell-height: 50px; .hypertable__cell { border-bottom: 1px solid var(--color-border-default); @@ -9,7 +9,7 @@ height: @cell-height; max-height: @cell-height; - padding: var(--spacing-px-12); + padding: var(--spacing-px-3) var(--spacing-px-12); width: 100%; .ember-flatpickr-input { diff --git a/app/styles/columns.less b/app/styles/columns.less index 1c37003f..69644350 100644 --- a/app/styles/columns.less +++ b/app/styles/columns.less @@ -66,7 +66,7 @@ z-index: 15; height: @cell-height; max-height: @cell-height; - padding: var(--spacing-px-12) var(--spacing-px-18); + padding: var(--spacing-px-3) var(--spacing-px-12); border-left: 1px solid var(--color-border-default); border-bottom: 1px solid var(--color-border-default); width: 100%; diff --git a/tests/integration/components/hyper-table/cell-renderers/image-test.js b/tests/integration/components/hyper-table/cell-renderers/image-test.js index 601f59c2..ab747479 100644 --- a/tests/integration/components/hyper-table/cell-renderers/image-test.js +++ b/tests/integration/components/hyper-table/cell-renderers/image-test.js @@ -13,7 +13,7 @@ module('Integration | Component | hyper-table/cell-renderers/image', function (h await render(hbs``); assert - .dom('div.upf-image.upf-image--round-36') + .dom('div.upf-image.upf-image--round-24') .hasAttribute('style', 'background-image: url("foo.png"), url("assets/images/no-image.svg");'); }); @@ -25,7 +25,7 @@ module('Integration | Component | hyper-table/cell-renderers/image', function (h await render(hbs``); assert - .dom('div.upf-image.upf-image--round-36') + .dom('div.upf-image.upf-image--round-24') .hasAttribute('style', 'background-image: url("foo.png"), url("assets/images/no-image.svg");'); assert.dom('span.margin-left-xx-sm.text-ellipsis-160').hasText('FooBar'); @@ -40,7 +40,7 @@ module('Integration | Component | hyper-table/cell-renderers/image', function (h await render(hbs``); assert - .dom('div.upf-image.upf-image--round-36') + .dom('div.upf-image.upf-image--round-24') .hasAttribute('style', 'background-image: url("foo.png"), url("assets/images/no-image.svg");'); assert.dom('span.margin-left-xx-sm.text-ellipsis-160').hasText('FooBar'); From dbca0d63fda1a2fe8fdcdaf4f71da132f4a6d017 Mon Sep 17 00:00:00 2001 From: Nathalie Date: Tue, 2 Sep 2025 17:11:41 +0200 Subject: [PATCH 2/4] Updated image cell renderer to use OSS Avatar --- .../components/hyper-table/cell-renderers/image.hbs | 2 +- addon/components/hyper-table/cell-renderers/image.js | 10 ++++++++++ .../hyper-table/cell-renderers/image-test.js | 12 +++--------- 3 files changed, 14 insertions(+), 10 deletions(-) diff --git a/addon/components/hyper-table/cell-renderers/image.hbs b/addon/components/hyper-table/cell-renderers/image.hbs index 7267e025..a7847ebf 100644 --- a/addon/components/hyper-table/cell-renderers/image.hbs +++ b/addon/components/hyper-table/cell-renderers/image.hbs @@ -1,5 +1,5 @@
- {{upf-image src=this.imageURL classNames="upf-image--round-24"}} +
{{#if (gt @column.labels.length 0)}} diff --git a/addon/components/hyper-table/cell-renderers/image.js b/addon/components/hyper-table/cell-renderers/image.js index 12b54fa7..86ef41f2 100644 --- a/addon/components/hyper-table/cell-renderers/image.js +++ b/addon/components/hyper-table/cell-renderers/image.js @@ -5,4 +5,14 @@ export default class ImageCellRenderer extends Component { get imageURL() { return get(this.args.item, this.args.column.key); } + + get initials() { + return ( + (get(this.args.item, this.args.column.labels[0]) || '') + .match(/\b[a-zA-Z]/g) + ?.slice(0, 2) + .join('') + .toUpperCase() || '' + ); + } } diff --git a/tests/integration/components/hyper-table/cell-renderers/image-test.js b/tests/integration/components/hyper-table/cell-renderers/image-test.js index ab747479..ce61eb48 100644 --- a/tests/integration/components/hyper-table/cell-renderers/image-test.js +++ b/tests/integration/components/hyper-table/cell-renderers/image-test.js @@ -12,9 +12,7 @@ module('Integration | Component | hyper-table/cell-renderers/image', function (h await render(hbs``); - assert - .dom('div.upf-image.upf-image--round-24') - .hasAttribute('style', 'background-image: url("foo.png"), url("assets/images/no-image.svg");'); + assert.dom('.upf-avatar.upf-avatar--sm img').hasAttribute('src', 'foo.png'); }); module('it has labels to show', function () { @@ -24,9 +22,7 @@ module('Integration | Component | hyper-table/cell-renderers/image', function (h await render(hbs``); - assert - .dom('div.upf-image.upf-image--round-24') - .hasAttribute('style', 'background-image: url("foo.png"), url("assets/images/no-image.svg");'); + assert.dom('.upf-avatar.upf-avatar--sm img').exists(); assert.dom('span.margin-left-xx-sm.text-ellipsis-160').hasText('FooBar'); }); @@ -39,9 +35,7 @@ module('Integration | Component | hyper-table/cell-renderers/image', function (h await render(hbs``); - assert - .dom('div.upf-image.upf-image--round-24') - .hasAttribute('style', 'background-image: url("foo.png"), url("assets/images/no-image.svg");'); + assert.dom('.upf-avatar.upf-avatar--sm img').exists(); assert.dom('span.margin-left-xx-sm.text-ellipsis-160').hasText('FooBar'); assert.dom('span.upf-notification--inline').exists(); From ad2223155c292b1a5968fe2bdc4c452dfb747393 Mon Sep 17 00:00:00 2001 From: Nathalie Date: Wed, 10 Sep 2025 10:47:36 +0200 Subject: [PATCH 3/4] Changed number of rows per page --- addon/core/handler.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/addon/core/handler.ts b/addon/core/handler.ts index 3209dbf3..77f74592 100644 --- a/addon/core/handler.ts +++ b/addon/core/handler.ts @@ -21,6 +21,8 @@ import { isEmpty } from '@ember/utils'; export type RowMutator = (row: Row) => boolean; +const ROWS_PER_PAGE = 30; + export default class TableHandler { private _context: unknown; private _renderingResolver?: RendererResolver; @@ -103,7 +105,7 @@ export default class TableHandler { this.loadingRows = true; return this.rowsFetcher - .fetch(this.currentPage, 20) + .fetch(this.currentPage, ROWS_PER_PAGE) .then(({ rows, meta }) => { this.rows = [...this.rows, ...rows.filter((row) => !this.rows.map((r) => r.record_id).includes(row.record_id))]; this.rowsMeta = meta; From 67e267855380c37cb9f1e472d6aa345b5ef9d7b2 Mon Sep 17 00:00:00 2001 From: Nathalie Date: Wed, 10 Sep 2025 17:08:09 +0200 Subject: [PATCH 4/4] Fixed broken test --- tests/unit/core/handler-test.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/unit/core/handler-test.ts b/tests/unit/core/handler-test.ts index 4650d3f2..32935ac4 100644 --- a/tests/unit/core/handler-test.ts +++ b/tests/unit/core/handler-test.ts @@ -242,7 +242,7 @@ module('Unit | core/handler', function (hooks) { // @ts-ignore assert.ok(rowsFetcherSpy.fetch.calledTwice); // @ts-ignore - assert.ok(rowsFetcherSpy.fetch.calledWithExactly(1, 20)); + assert.ok(rowsFetcherSpy.fetch.calledWithExactly(1, 30)); assert.equal(handler.rows.length, 3); });