IBX-6649: Added support for spell checking

ibexa · Sep 28, 2023 · 1ae36e4 · 1ae36e4
1 parent 64b8984
commit 1ae36e4
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 2 deletions.
diff --git a/src/bundle/Resources/public/scss/_search-form.scss b/src/bundle/Resources/public/scss/_search-form.scss
@@ -108,6 +108,15 @@
         display: flex;
     }
 
+    &__spellcheck-suggestion {
+        font-style: italic;
+        font-size: $ibexa-text-font-size-small;
+
+        a {
+            font-weight: bold;
+        }
+    }
+
     .ibexa-btn--secondary.ibexa-btn {
         max-width: 100%;
         overflow: hidden;

diff --git a/src/bundle/Resources/translations/ibexa_search.en.xliff b/src/bundle/Resources/translations/ibexa_search.en.xliff
@@ -156,6 +156,11 @@
         <target state="new">Section</target>
         <note>key: search.section</note>
       </trans-unit>
+      <trans-unit id="923ca53f6602fe7eabe79838efdca27c2756b0fd" resname="search.spellcheck.suggestion">
+        <source>Did you mean "%s"?</source>
+        <target state="new">Did you mean "%s"?</target>
+        <note>key: search.spellcheck.suggestion</note>
+      </trans-unit>
       <trans-unit id="b484be9d33f5cd9961f4ddd89c628f2cbca2a6a1" resname="search.subtree">
         <source>Subtree</source>
         <target state="new">Subtree</target>

diff --git a/src/bundle/Resources/views/themes/admin/ui/search/results.html.twig b/src/bundle/Resources/views/themes/admin/ui/search/results.html.twig
@@ -17,10 +17,21 @@
             <h2 class="ibexa-search-form__no-results-title">
                 {{ 'search.no_results.title'|trans({'%query%': form.query.vars.value})|desc('No results found for "%query%"') }}
             </h2>
+            {% if spellcheck is not null and spellcheck.incorrect %}
+                <div class="ibexa-search-form__spellcheck-suggestion">
+                    {% set suggestion_link %}
+                        <a href="{{ path('ibexa.search', app.request.query|merge({'search[query]': spellcheck.query})) }}">
+                            {{ spellcheck.query }}
+                        </a>
+                    {% endset %}
+
+                    {{ 'search.spellcheck.suggestion'|trans|desc('Did you mean "%s"?')|e('html')|format(suggestion_link)|raw }}
+                </div>
+            {% endif %}
             <div class="ibexa-search-form__no-results-subtitle">
                 {% for hint in no_results_hints %}
                     <div class="ibexa-search-form__no-results-hint">
-                        <div class="ibexa-search-form__no-results-hint-icon-wrapper">
+                        <div  class="ibexa-search-form__no-results-hint-icon-wrapper">
                             <svg class="ibexa-icon ibexa-icon--small-medium">
                                 <use xlink:href="{{ ibexa_icon_path('approved') }}"></use>
                             </svg>
@@ -182,7 +193,19 @@
             } %}
                 {% trans_default_domain 'ibexa_search' %}
                 {% block between_header_and_table %}
-                    <span class="ibexa-search-form__results-language">
+                    {% if spellcheck is not null and spellcheck.incorrect %}
+                        <div class="ibexa-search-form__spellcheck-suggestion">
+                            {% set suggestion_link %}
+                                <a href="{{ path('ibexa.search', app.request.query|merge({'search[query]': spellcheck.query})) }}">
+                                    {{ spellcheck.query }}
+                                </a>
+                            {% endset %}
+
+                            {{ 'search.spellcheck.suggestion'|trans|desc('Did you mean "%s"?')|e('html')|format(suggestion_link)|raw }}
+                        </div>
+                    {% endif %}
+
+                     <span class="ibexa-search-form__results-language">
                         {% if form.children.search_language.vars.value != '' %}
                             {{ 'search.in_language'|trans({
                                 '%search_language%': form.children.search_language.vars.data.name,