diff --git a/addons/core/translations/actions/en-us.yaml b/addons/core/translations/actions/en-us.yaml index 144ced636..49cd11a23 100644 --- a/addons/core/translations/actions/en-us.yaml +++ b/addons/core/translations/actions/en-us.yaml @@ -35,3 +35,5 @@ close: Close toggle-secret: Toggle secret visibility minimize: Minimize fullscreen: Fullscreen +filter: + status: status diff --git a/addons/rose/addon/components/rose/toolbar/index.hbs b/addons/rose/addon/components/rose/toolbar/index.hbs new file mode 100644 index 000000000..5f9a6388a --- /dev/null +++ b/addons/rose/addon/components/rose/toolbar/index.hbs @@ -0,0 +1,6 @@ +
+ {{yield (hash + search=(component "rose/anonymous") + filter=(component "rose/anonymous" class="rose-toolbar-search") + )}} +
\ No newline at end of file diff --git a/addons/rose/addon/components/rose/toolbar/index.js b/addons/rose/addon/components/rose/toolbar/index.js new file mode 100644 index 000000000..1ae2378ca --- /dev/null +++ b/addons/rose/addon/components/rose/toolbar/index.js @@ -0,0 +1,8 @@ +import Component from '@glimmer/component'; +import { generateComponentID } from '../../../utilities/component-auto-id'; + +export default class RoseToolbarComponent extends Component { + // =attributes + + id = generateComponentID(); +} diff --git a/addons/rose/addon/components/rose/toolbar/index.stories.mdx b/addons/rose/addon/components/rose/toolbar/index.stories.mdx new file mode 100644 index 000000000..042a7a96c --- /dev/null +++ b/addons/rose/addon/components/rose/toolbar/index.stories.mdx @@ -0,0 +1,27 @@ +import { Meta, Story, Preview } from '@storybook/addon-docs/blocks'; +import { hbs } from 'ember-cli-htmlbars'; +import { action } from '@storybook/addon-actions'; + + + +# Toolbar + +A toolbar component that allows two distinct sections to be configured: search, filter + +```htmlbars + + + + +``` + + + {{ + template: hbs` + + Search + Filter + + `, + }} + \ No newline at end of file diff --git a/addons/rose/addon/styles/rose/components/_index.scss b/addons/rose/addon/styles/rose/components/_index.scss index dd936e77a..f8161a2c6 100644 --- a/addons/rose/addon/styles/rose/components/_index.scss +++ b/addons/rose/addon/styles/rose/components/_index.scss @@ -18,3 +18,4 @@ @import 'message'; @import 'link-button'; @import 'badge'; +@import 'toolbar'; diff --git a/addons/rose/addon/styles/rose/components/toolbar/_index.scss b/addons/rose/addon/styles/rose/components/toolbar/_index.scss new file mode 100644 index 000000000..d75d0bd61 --- /dev/null +++ b/addons/rose/addon/styles/rose/components/toolbar/_index.scss @@ -0,0 +1,9 @@ +.rose-toolbar { + background-color: #fbfbfc; + .rose-form { + display: flex; + } + .rose-dropdown { + margin-left: auto; + } +} diff --git a/addons/rose/addon/styles/rose/components/toolbar/_toolbar.scss b/addons/rose/addon/styles/rose/components/toolbar/_toolbar.scss new file mode 100644 index 000000000..e69de29bb diff --git a/addons/rose/app/components/rose/toolbar.js b/addons/rose/app/components/rose/toolbar.js new file mode 100644 index 000000000..bfd066fe9 --- /dev/null +++ b/addons/rose/app/components/rose/toolbar.js @@ -0,0 +1 @@ +export { default } from 'rose/components/rose/toolbar'; diff --git a/addons/rose/tests/integration/components/rose/toolbar-test.js b/addons/rose/tests/integration/components/rose/toolbar-test.js new file mode 100644 index 000000000..dbdd09da2 --- /dev/null +++ b/addons/rose/tests/integration/components/rose/toolbar-test.js @@ -0,0 +1,21 @@ +import { module, test } from 'qunit'; +import { setupRenderingTest } from 'ember-qunit'; +import { render, find } from '@ember/test-helpers'; +import hbs from 'htmlbars-inline-precompile'; + +module('Integration | Component | rose/toolbar', function (hooks) { + setupRenderingTest(hooks); + + test('it renders', async function (assert) { + await render(hbs``); + assert.ok(find('div')); + assert.ok(find('.rose-toolbar')); + }); + + test('it renders with filter', async function (assert) { + await render(hbs` + + `); + assert.ok(find('.rose-toolbar-search')); + }); +}); diff --git a/ui/admin/app/controllers/scopes/scope/sessions/index.js b/ui/admin/app/controllers/scopes/scope/sessions/index.js new file mode 100644 index 000000000..15c3461a5 --- /dev/null +++ b/ui/admin/app/controllers/scopes/scope/sessions/index.js @@ -0,0 +1,13 @@ +import Controller from '@ember/controller'; +import { inject as service } from '@ember/service'; + +export default class ScopesScopeSessionsController extends Controller { + // =services + @service store; + + // =attributes + + get availableSessions() { + return this.store.peekAll('session'); + } +} diff --git a/ui/admin/app/templates/scopes/scope/sessions/index.hbs b/ui/admin/app/templates/scopes/scope/sessions/index.hbs index 297c68a70..36f4d45cb 100644 --- a/ui/admin/app/templates/scopes/scope/sessions/index.hbs +++ b/ui/admin/app/templates/scopes/scope/sessions/index.hbs @@ -15,7 +15,27 @@ {{#if @model}} + + + + + {{#each this.availableSessions as |session|}} + + + + {{/each}} + + + +