diff --git a/app/components/file-table-item.js b/app/components/file-table-item.js index 88d7593..a8028be 100644 --- a/app/components/file-table-item.js +++ b/app/components/file-table-item.js @@ -1,7 +1,14 @@ import Component from '@ember/component'; +import { computed } from '@ember/object'; const defaultFile = {}; +const defaultSelectedFilePaths = []; export default Component.extend({ file: defaultFile, + selectedFilePaths: defaultSelectedFilePaths, + + isSelected: computed('file.path', 'selectedFilePaths', function() { + return this.selectedFilePaths.includes(this.file.path); + }), }); diff --git a/app/components/file-table.js b/app/components/file-table.js index b93ecdf..12798d5 100644 --- a/app/components/file-table.js +++ b/app/components/file-table.js @@ -1,6 +1,9 @@ import Component from '@ember/component'; + const defaultFiles = []; +const defaultSelectedFilePaths = []; export default Component.extend({ files: defaultFiles, + selectedFilePaths: defaultSelectedFilePaths, }); diff --git a/app/templates/components/file-table-item.hbs b/app/templates/components/file-table-item.hbs index 706bfc0..ef24ad0 100644 --- a/app/templates/components/file-table-item.hbs +++ b/app/templates/components/file-table-item.hbs @@ -1,6 +1,6 @@ -   + {{if isSelected "Selected"}} {{file.name}} diff --git a/app/templates/components/file-table.hbs b/app/templates/components/file-table.hbs index 06a593a..f742bee 100644 --- a/app/templates/components/file-table.hbs +++ b/app/templates/components/file-table.hbs @@ -15,7 +15,7 @@ {{#each files as | file |}} - {{file-table-item file=file selected=selected}} + {{file-table-item file=file selectedFilePaths=selectedFilePaths}} {{/each}} \ No newline at end of file diff --git a/tests/integration/components/file-table-item-test.js b/tests/integration/components/file-table-item-test.js index 4e897ec..e1a4015 100644 --- a/tests/integration/components/file-table-item-test.js +++ b/tests/integration/components/file-table-item-test.js @@ -44,4 +44,18 @@ module('Integration | Component | file-table-item', function(hooks) { assert.equal(find('[data-test-id=file-table-item-status]').textContent.trim(), 'available', 'Renders correct status text'); assert.equal(find('[data-test-id=file-table-status-icon]').classList.contains('file-table-item-status-available'), true, 'Status icon has expected class'); }); + + test('it handles toggling selected status based on incoming selectedFilePaths', async function(assert) { + this.set('file', genericFile()); + this.set('selectedFilePaths', []); + await render(hbs`{{file-table-item file=file selectedFilePaths=selectedFilePaths}}`); + + assert.equal(find('[data-test-id=file-table-item-selected]').textContent.trim(), '', 'Not selected by default'); + + this.set('selectedFilePaths', [this.file.path]); + assert.equal(find('[data-test-id=file-table-item-selected]').textContent.trim(), 'Selected', 'Not selected by default'); + + this.set('selectedFilePaths', []); + assert.equal(find('[data-test-id=file-table-item-selected]').textContent.trim(), '', 'No longer selected'); + }); });