From 8289c3128ebdfaf1de105c02ac71091738e50296 Mon Sep 17 00:00:00 2001 From: Christoph Wiedenmann Date: Tue, 23 Jul 2024 10:54:44 +0200 Subject: [PATCH 1/2] refactor: format search-result template --- .../src/components/search-result.hbs | 19 ++++++++++++++----- 1 file changed, 14 insertions(+), 5 deletions(-) diff --git a/guidemaker-ember-template/src/components/search-result.hbs b/guidemaker-ember-template/src/components/search-result.hbs index e05dc7fd..7363c71f 100644 --- a/guidemaker-ember-template/src/components/search-result.hbs +++ b/guidemaker-ember-template/src/components/search-result.hbs @@ -1,13 +1,22 @@ -{{!-- template-lint-disable no-curly-component-invocation no-implicit-this --}} -
+
- {{this.sectionTitle}} + + {{this.sectionTitle}} +
- +
{{#each this.remainingHeadings as |heading index|}} {{#if index}} From a4638cd1a1c4783e167da79c588347c09fabd2b1 Mon Sep 17 00:00:00 2001 From: Christoph Wiedenmann Date: Tue, 23 Jul 2024 11:01:00 +0200 Subject: [PATCH 2/2] refactor: transoform search-result to glimmer component --- .../src/components/search-result.hbs | 54 +++++++++---------- .../src/components/search-result.js | 27 ++++------ .../components/search-result-test.js | 47 ++++++++++++++++ 3 files changed, 83 insertions(+), 45 deletions(-) create mode 100644 test-app/tests/integration/components/search-result-test.js diff --git a/guidemaker-ember-template/src/components/search-result.hbs b/guidemaker-ember-template/src/components/search-result.hbs index 7363c71f..f65184b9 100644 --- a/guidemaker-ember-template/src/components/search-result.hbs +++ b/guidemaker-ember-template/src/components/search-result.hbs @@ -1,31 +1,29 @@ -
-
-
- - {{this.sectionTitle}} - -
-
- - -
- {{#each this.remainingHeadings as |heading index|}} - {{#if index}} - > - {{/if}} - {{html-safe heading.value}} - {{/each}} -
- +
+
+
+
+ + {{this.sectionTitle}} + +
+
+ +
+ {{#each this.remainingHeadings as |heading index|}} + {{#if index}} + > + {{/if}} + {{html-safe heading.value}} + {{/each}} +
+ +
diff --git a/guidemaker-ember-template/src/components/search-result.js b/guidemaker-ember-template/src/components/search-result.js index d7dd81bd..75348fac 100644 --- a/guidemaker-ember-template/src/components/search-result.js +++ b/guidemaker-ember-template/src/components/search-result.js @@ -1,24 +1,17 @@ -/* eslint-disable ember/no-classic-components, ember/no-classic-classes, ember/require-tagless-components, ember/require-computed-property-dependencies, prettier/prettier, ember/require-computed-macros */ -import Component from '@ember/component'; -import { computed } from '@ember/object'; +import Component from '@glimmer/component'; import { inject as service } from '@ember/service'; -export default Component.extend({ - classNames: ['ds-suggestion'], +export default class SearchResultComponent extends Component { + @service page; - page: service(), - sectionTitle: computed('result.path', function() { - let sectionId = this.result.path.split('/')[0]; + get sectionTitle() { + let sectionId = this.args.result.path.split('/')[0]; let section = this.page.pages.find((page) => page.id === sectionId); return section.title; - }), + } - pageHeading: computed('result._highlightResult.headings.[]', function() { - return this.result._highlightResult.headings[0]; - }), - - remainingHeadings: computed('result._highlightResult.headings.[]', function() { - return this.result._highlightResult.headings; - }) -}); + get remainingHeadings() { + return this.args.result._highlightResult.headings; + } +} diff --git a/test-app/tests/integration/components/search-result-test.js b/test-app/tests/integration/components/search-result-test.js new file mode 100644 index 00000000..b396341a --- /dev/null +++ b/test-app/tests/integration/components/search-result-test.js @@ -0,0 +1,47 @@ +import { module, test } from 'qunit'; +import { setupRenderingTest } from 'ember-qunit'; +import { render } from '@ember/test-helpers'; +import { hbs } from 'ember-cli-htmlbars'; +import Service from '@ember/service'; + +class PageStub extends Service { + pages = [ + { + id: 'examples', + title: 'Examples', + }, + ]; +} + +module('Integration | Component | search-result', function (hooks) { + setupRenderingTest(hooks); + + test('it renders the search result', async function (assert) { + this.owner.register('service:page', PageStub); + + this.result = { + path: 'examples/index', + anchor: 'toc_images', + _highlightResult: { + headings: [ + { + value: 'Basic Markdown', + }, + { + value: 'Images', + }, + ], + }, + }; + + await render(hbs``); + + assert + .dom('.algolia-docsearch-suggestion--subcategory-column-text') + .hasText('Examples'); + + assert + .dom('.algolia-docsearch-suggestion--title') + .hasText('Basic Markdown > Images'); + }); +});