Shopware6 : Admin module not updatable

Question

The default functionnality of Shopware does not shows the company name when we use the search bar in the admin panel. We have some customers only filling the company field and not using the first and lastName with text (they're adding "_" instead). So, I copied the structure from the vendor/shopware/administration/Resources/app/administration/src/app/component/structure/sw-search-bar-item/ in my custom theme and registered it in my main.js file but every change I made in my custom theme (sw-search-bar-item.html.twig) has no effects in the administration.

Here's the default shopware file's content :

{% block sw_search_bar_item %}
<!-- eslint-disable-next-line vuejs-accessibility/mouse-events-have-key-events -->
<li
    class="sw-search-bar-item sw-search-bar-item--v2"
    :class="componentClasses"
    @mouseenter="onMouseEnter($event)"
>

    {% block sw_search_bar_item_icon %}
    <sw-icon
        v-if="iconName"
        :name="iconName"
        :color="iconColor"
    />
    {% endblock %}

    {% block sw_search_bar_item_customer %}
    <router-link
        v-if="type === 'customer'"
        ref="routerLink"
        class="sw-search-bar-item__link"
        :to="{ name: 'sw.customer.detail.base', params: { id: item.id } }"
        @click.native="onClickSearchResult('customer', item.id)"
    >
        {% block sw_search_bar_item_customer_label %}
        <span
            class="sw-search-bar-item__label"
        >
            {% block sw_search_bar_item_customer_label_name %}
                <sw-highlight-text
                        :search-term="searchTerm"
                        :text="`${item.firstName} ${item.lastName}`"
                />
            {% endblock %}

            {% block sw_search_bar_item_customer_label_number %}
            <sw-highlight-text
                :search-term="searchTerm"
                :text="item.customerNumber"
            />
            {% endblock %}
        </span>
        {% endblock %}

    </router-link>
    {% endblock %}

    {% block sw_search_bar_item_product %}
    <router-link
        v-else-if="type === 'product'"
        ref="routerLink"
        class="sw-search-bar-item__link"
        :to="{ name: 'sw.product.detail.base', params: { id: item.id } }"
        @click.native="onClickSearchResult('product', item.id)"
    >

        {% block sw_search_bar_item_product_label %}
        <span
            class="sw-search-bar-item__label"
        >
            {% block sw_search_bar_item_product_label_name %}
            <sw-highlight-text
                :search-term="searchTerm"
                :text="productDisplayName"
            />
            {% endblock %}

            {% block sw_search_bar_item_product_label_number %}
            <sw-highlight-text
                :search-term="searchTerm"
                :text="item.productNumber"
            />
            {% endblock %}
        </span>
        {% endblock %}

    </router-link>
    {% endblock %}

    {% block sw_search_bar_item_category %}
    <router-link
        v-else-if="type === 'category'"
        ref="routerLink"
        class="sw-search-bar-item__link"
        :to="{ name: 'sw.category.detail', params: { id: item.id } }"
        @click.native="onClickSearchResult('category', item.id)"
    >

        {% block sw_search_bar_item_category_label %}
        <span class="sw-search-bar-item__label">
            <sw-highlight-text
                :search-term="searchTerm"
                :text="item.name"
            />
        </span>
        {% endblock %}

    </router-link>
    {% endblock %}

    {% block sw_search_bar_item_order %}
    <router-link
        v-else-if="type === 'order'"
        ref="routerLink"
        class="sw-search-bar-item__link"
        :to="{ name: 'sw.order.detail', params: { id: item.id } }"
        @click.native="onClickSearchResult('order', item.id)"
    >

        {% block sw_search_bar_item_order_label %}
        <span
            class="sw-search-bar-item__label"
        >
            {% block sw_search_bar_item_order_label_name %}
            <sw-highlight-text
                :search-term="searchTerm"
                :text="`${item.orderCustomer.firstName} ${item.orderCustomer.lastName}`"
            />
            {% endblock %}

            {% block sw_search_bar_item_order_label_number %}
            <sw-highlight-text
                :search-term="searchTerm"
                :text="item.orderNumber"
            />
            {% endblock %}
        </span>
        {% endblock %}

    </router-link>
    {% endblock %}

    {% block sw_search_bar_item_media %}
    <router-link
        v-else-if="type === 'media'"
        ref="routerLink"
        class="sw-search-bar-item__link"
        :to="{ name: 'sw.media.index', params: { folderId: item.mediaFolderId }, query: { term: item.fileName } }"
        @click.native="onClickSearchResult('media', item.id)"
    >

        {% block sw_search_bar_item_media_label %}
        <span class="sw-search-bar-item__label">
            <sw-highlight-text
                :search-term="searchTerm"
                :text="item | mediaName"
            />
        </span>
        {% endblock %}

    </router-link>
    {% endblock %}

    {% block sw_search_bar_item_cms_page %}
    <router-link
        v-else-if="type === 'cms_page'"
        ref="routerLink"
        class="sw-search-bar-item__link"
        :to="{ name: 'sw.cms.detail', params: { id: item.id } }"
        @click.native="onClickSearchResult('cms_page', item.id)"
    >

        {% block sw_search_bar_item_cms_page_label %}
        <span class="sw-search-bar-item__label">
            <sw-highlight-text
                :search-term="searchTerm"
                :text="item.name"
            />
        </span>
        {% endblock %}

    </router-link>
    {% endblock %}

    {% block sw_search_bar_item_landing_page %}
    <router-link
        v-else-if="type === 'landing_page'"
        ref="routerLink"
        class="sw-search-bar-item__link"
        :to="{ name: 'sw.category.landingPageDetail.base', params: { id: item.id } }"
        @click.native="onClickSearchResult('landing_page', item.id)"
    >

        {% block sw_search_bar_item_cms_landing_page_label %}
        <span class="sw-search-bar-item__label">
            <sw-highlight-text
                :search-term="searchTerm"
                :text="item.name"
            />
        </span>
        {% endblock %}

    </router-link>
    {% endblock %}

    {% block sw_search_bar_item_module %}
    <router-link
        v-else-if="['frequently_used', 'module'].includes(type)"
        ref="routerLink"
        class="sw-search-bar-item__link"
        :to="routeName"
    >
        {% block sw_search_bar_item_module_label %}
        <span
            class="sw-search-bar-item__label"
        >
            {% block sw_search_bar_item_module_label_module %}
            <sw-highlight-text
                :search-term="searchTerm"
                :text="moduleName"
            />
            {% endblock %}

            {% block sw_search_bar_item_module_label_shortcut %}
            <sw-shortcut-overview-item
                v-if="shortcut"
                title=""
                :content="shortcut"
            />
            {% endblock %}

            {% block sw_search_bar_item_module_label_action %}
            <sw-highlight-text
                :text="$tc(`global.sw-search-bar-item.${item.action ? 'typeLabelAction': 'typeLabelModule'}`)"
            />
            {% endblock %}
        </span>
        {% endblock %}
    </router-link>
    {% endblock %}

    {% block sw_search_bar_item_other_entity %}
    <router-link
        v-else-if="detailRoute && displayValue.length > 0"
        ref="routerLink"
        class="sw-search-bar-item__link"
        :to="{ name: detailRoute, params: { id: item.id } }"
    >

        {% block sw_search_bar_item_other_entity_label %}
        <span class="sw-search-bar-item__label">
            <sw-highlight-text
                :search-term="searchTerm"
                :text="displayValue"
            />
        </span>
        {% endblock %}

    </router-link>
    {% endblock %}
</li>
{% endblock %}

and here are the lines I need to change : :text=" ${item.firstName} ${item.lastName} " :text=" ${item.orderCustomer.firstName} ${item.orderCustomer.lastName} "

I just copied the whole content in the previous file and changed these two lines to : :text=" ${item.firstName} ${item.lastName} ${item.company} "

:text=" ${item.orderCustomer.firstName} ${item.orderCustomer.lastName} ${item.orderCustomer.company} "

Is there something wrong?

Here's my main.js file content :

import './app/component/structure/sw-search-bar-item';

You can see my folder's structure in the attached picture

Answer 1

I think you have to overwrite the twig template in a different way as it is included from Javascript:

The first parameter is component to override and second parameter is new twig template for this component.

import template from './src/extension/sw-order-detail/sw-order- detail.html.twig'; Component.override('sw-order-detail', { template, });

See here for the source https://webkul.com/blog/how-to-override-a-component-in-shopware-6/

Answer 2

显然，这是来自其他地方的问题，因为我只是在另一个实例上复制了相同的文件和相同的内容......它工作得很好