Skip to content

ICSAAS-408 add datalayer to search and searchtab cmps #147

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
igorsimovski wants to merge 3 commits into
base: main
Choose a base branch
from
Open

ICSAAS-408 add datalayer to search and searchtab cmps #147

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
3b7ba54
ICSAAS-408 add datalayer to search and searchtab cmps
igorsimovski Mar 1, 2022
dddae06
Merge branch 'main' into ICSAAS-408-Add_data-layer_for_Search_Compone…
igorsimovski Mar 8, 2022
7cbcb72
data layer updates
igorsimovski Mar 9, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 9 additions & 0 deletions all/pom.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -74,6 +74,11 @@
<type>zip</type>
<target>/apps/saas-aem-module-packages/application/install</target>
</embedded>
<embedded>
<groupId>com.adobe.cq</groupId>
<artifactId>core.wcm.components.core</artifactId>
<target>/apps/saas-aem-module-vendor-packages/application/install</target>
</embedded>
</embeddeds>
</configuration>
</plugin>
Expand Down Expand Up @@ -187,5 +192,9 @@
<version>${project.version}</version>
<type>zip</type>
</dependency>
<dependency>
<groupId>com.adobe.cq</groupId>
<artifactId>core.wcm.components.core</artifactId>

@nhirrle nhirrle Mar 7, 2022

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

oh we have now a hard dependency on core components, right? because of the interface & utility function?
I am just bit worried because this can conflict with a client core component version...

@nhirrle nhirrle Mar 7, 2022

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

let's discuss this in some call

@nhirrle nhirrle Mar 9, 2022 •
edited
Loading

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@igorsimovski : how much code would you need to clone of we don't add the dependency?

I'd like to avoid adding the dependency to core competents to not dictate that and which version needs to be used by the client

@igorsimovski igorsimovski Mar 10, 2022

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just a thought: can't this be overcome with a specific entry in the Import-Package section in the client project?

@igorsimovski igorsimovski Mar 10, 2022

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@igorsimovski : how much code would you need to clone of we don't add the dependency?
com.adobe.cq.wcm.core.components.models.datalayer.ComponentData (we use the getData method from this interface)
com.adobe.cq.wcm.core.components.internal.jackson.ComponentDataModelSerializer (this is the serializer for the field/'json property' associated with getData())
com.adobe.cq.wcm.core.components.util.ComponentUtils (to check if data layer is enabled in CA configs - This can be omitted either by making our own ca config or rely only on a dataLayer on/off switch in the components)
com.adobe.cq.wcm.core.components.models.datalayer.builder.DataLayerBuilder (this is a rather large implementation that offers a convenient way of building the dataLayer json, but we could do w/o it - we can simply do it with a dedicated POJO for each component)

@igorsimovski igorsimovski Mar 10, 2022

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just a thought: can't this be overcome with a specific entry in the Import-Package section in the client project?

https://www.baeldung.com/maven-version-collision

@nhirrle nhirrle Mar 11, 2022

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sorry for my late reply. I think it makes sense to discuss this one to one

</dependency>
</dependencies>
</project>
4 changes: 4 additions & 0 deletions core/pom.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -131,6 +131,10 @@
<artifactId>commons-io</artifactId>
<groupId>commons-io</groupId>
</dependency>
<dependency>
<groupId>com.adobe.cq</groupId>
<artifactId>core.wcm.components.core</artifactId>
</dependency>
<!-- AEM 6.5 Dependencies, this has to be last dependency before the Testing section -->
<dependency>
<groupId>com.adobe.aem</groupId>
Expand Down
20 changes: 19 additions & 1 deletion core/src/main/java/com/valtech/aem/saas/core/fulltextsearch/SearchModelImpl.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,10 @@
import com.adobe.cq.export.json.ComponentExporter;
import com.adobe.cq.export.json.ContainerExporter;
import com.adobe.cq.export.json.ExporterConstants;
import com.adobe.cq.wcm.core.components.models.Container;
import com.adobe.cq.wcm.core.components.models.datalayer.ComponentData;
import com.adobe.cq.wcm.core.components.models.datalayer.builder.DataLayerBuilder;
import com.adobe.cq.wcm.core.components.util.ComponentUtils;
import com.day.cq.i18n.I18n;
import com.fasterxml.jackson.annotation.JsonIgnore;
import com.fasterxml.jackson.annotation.JsonInclude;
Expand Down Expand Up @@ -52,7 +56,7 @@
resourceType = RESOURCE_TYPE)
@Exporter(name = ExporterConstants.SLING_MODEL_EXPORTER_NAME,
extensions = ExporterConstants.SLING_MODEL_EXTENSION)
public class SearchModelImpl implements SearchModel, ContainerExporter {
public class SearchModelImpl implements SearchModel, Container {

public static final String RESOURCE_TYPE = "saas-aem-module/components/search";
public static final String NODE_NAME_SEARCH_TABS_CONTAINER = "search-tabs";
Expand Down Expand Up @@ -154,6 +158,20 @@ public class SearchModelImpl implements SearchModel, ContainerExporter {

private SearchCAConfigurationModel searchCAConfigurationModel;

@Override
public ComponentData getData() {
if (ComponentUtils.isDataLayerEnabled(this.resource)) {
return DataLayerBuilder.forContainer()
.withId(this::getId)
.withTitle(this::getTitle)
.withType(this::getExportedType)
.build();

}
return null;
}


@PostConstruct
private void init() {
searchCAConfigurationModel = resource.adaptTo(SearchCAConfigurationModel.class);
Expand Down
27 changes: 26 additions & 1 deletion core/src/main/java/com/valtech/aem/saas/core/fulltextsearch/SearchTabModelImpl.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,10 @@

import com.adobe.cq.export.json.ComponentExporter;
import com.adobe.cq.export.json.ExporterConstants;
import com.adobe.cq.wcm.core.components.models.Component;
import com.adobe.cq.wcm.core.components.models.datalayer.ComponentData;
import com.adobe.cq.wcm.core.components.models.datalayer.builder.DataLayerBuilder;
import com.adobe.cq.wcm.core.components.util.ComponentUtils;
import com.fasterxml.jackson.annotation.JsonInclude;
import com.fasterxml.jackson.annotation.JsonInclude.Include;
import com.valtech.aem.saas.api.caconfig.SearchCAConfigurationModel;
Expand All @@ -15,6 +19,7 @@
import com.valtech.aem.saas.api.resource.PathTransformer;
import com.valtech.aem.saas.core.common.request.RequestWrapper;
import com.valtech.aem.saas.core.common.resource.ResourceWrapper;
import com.valtech.aem.saas.core.util.ResourceUtil;
import com.valtech.aem.saas.core.util.StringToInteger;
import lombok.Getter;
import lombok.extern.slf4j.Slf4j;
Expand Down Expand Up @@ -47,7 +52,7 @@
resourceType = RESOURCE_TYPE)
@Exporter(name = ExporterConstants.SLING_MODEL_EXPORTER_NAME,
extensions = ExporterConstants.SLING_MODEL_EXTENSION)
public class SearchTabModelImpl implements SearchTabModel, ComponentExporter {
public class SearchTabModelImpl implements SearchTabModel, Component {

public static final String RESOURCE_TYPE = "saas-aem-module/components/searchtab";
public static final int DEFAULT_START_PAGE = 1;
Expand Down Expand Up @@ -137,6 +142,26 @@ private void init() {
});
}

@Override
public ComponentData getData() {
if (ComponentUtils.isDataLayerEnabled(this.resource)) {
return DataLayerBuilder.forComponent()
.withId(this::getId)
.withParentId(() -> Optional.ofNullable(parentSearch).map(SearchModel::getId).orElse(""))
.withTitle(this::getTitle)
.withType(this::getExportedType)
.build();

}
return null;
}

@Override
public String getId() {
return ResourceUtil.generateId("saas", resource.getPath());
}


private Optional<Integer> getConfiguredResultsPerPage() {
return Optional.ofNullable(parentSearch).map(SearchModel::getResultsPerPage);
}
Expand Down
10 changes: 7 additions & 3 deletions pom.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -92,8 +92,8 @@

<sonar.organization>valtech-ch</sonar.organization>
<sonar.host.url>https://sonarcloud.io</sonar.host.url>
<sonar.coverage.jacoco.xmlReportPaths>${project.basedir}/target/site/jacoco/jacoco.xml
</sonar.coverage.jacoco.xmlReportPaths>
<sonar.coverage.jacoco.xmlReportPaths>${project.basedir}/target/site/jacoco/jacoco.xml</sonar.coverage.jacoco.xmlReportPaths>
<core.wcm.components.version>2.17.2</core.wcm.components.version>

</properties>

Expand Down Expand Up @@ -866,14 +866,18 @@
<version>2.8.0</version>
<scope>provided</scope>
</dependency>
<dependency>
<groupId>com.adobe.cq</groupId>
<artifactId>core.wcm.components.core</artifactId>
<version>${core.wcm.components.version}</version>
</dependency>
<!-- AEM 6.5 Dependencies, this has to be last dependency before the Testing section -->
<dependency>
<groupId>com.adobe.aem</groupId>
<artifactId>uber-jar</artifactId>
<version>6.5.10</version>
<scope>provided</scope>
</dependency>

<!-- Testing -->
<dependency>
<groupId>org.junit</groupId>
Expand Down
1 change: 0 additions & 1 deletion ui.apps/pom.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,6 @@
<cloudManagerTarget>none</cloudManagerTarget>
</properties>
<group>com.valtech.aem</group>
<name>saas.ui.apps</name>
<packageType>application</packageType>
<repositoryStructurePackages>
<repositoryStructurePackage>
Expand Down
1 change: 1 addition & 0 deletions ui.config/pom.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,7 @@
<properties>
<cloudManagerTarget>none</cloudManagerTarget>
</properties>
<group>com.valtech.aem</group>
<packageType>container</packageType>
<showImportPackageReport>false</showImportPackageReport>
<repositoryStructurePackages>
Expand Down
1 change: 0 additions & 1 deletion ui.content/pom.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,6 @@
<cloudManagerTarget>none</cloudManagerTarget>
</properties>
<group>com.valtech.aem</group>
<name>saas.ui.content</name>
<packageType>content</packageType>
<accessControlHandling>merge</accessControlHandling>
<validatorsSettings>
Expand Down
6 changes: 6 additions & 0 deletions ui.frontend/src/main/webpack/site/js/buildSearch.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,10 +53,12 @@ export const buildSearch = async (
autocompleteTriggerThreshold,
autoSuggestText,
noResultsText,
dataLayer,
} = searchConfig

const searchContainer = document.createElement('div')
searchContainer.classList.add('cmp-saas')
searchContainer.dataset.cmpDataLayer = JSON.stringify(dataLayer)

const searchFormElement = buildSearchForm()
const searchResetButton = buildSearchClearButton()
Expand Down Expand Up @@ -123,4 +125,8 @@ export const buildSearch = async (
callbacks,
)
}
const DOMContentLoadedEvent = new Event('DOMContentLoaded', {
bubbles: true
});
window.document.dispatchEvent(DOMContentLoadedEvent)
}
3 changes: 3 additions & 0 deletions ui.frontend/src/main/webpack/site/js/components/searchResults.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ type SearchResultsOptions = {
searchItems: SearchItem[]
tabId: string
onSearchItemClick?: OnSearchItemClickCallback
dataLayer: object
}

export const generateSearchItemList = (
Expand All @@ -29,9 +30,11 @@ const buildSearchResult = ({
searchItems,
tabId,
onSearchItemClick,
dataLayer,
}: SearchResultsOptions): HTMLDivElement => {
const searchResults = document.createElement('div')
searchResults.classList.add('cmp-saas__results')
searchResults.dataset.cmpDataLayer = JSON.stringify(dataLayer)

const resultsItems = document.createElement('div')
resultsItems.classList.add('cmp-saas__results-items')
Expand Down
4 changes: 3 additions & 1 deletion ui.frontend/src/main/webpack/site/js/components/searchResultsTab.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,7 @@ const buildSearchResultsTab = ({
results,
url,
facetFilters,
dataLayer,
} = tabResult

if (resultsTotal) {
Expand All @@ -51,13 +52,14 @@ const buildSearchResultsTab = ({
tabNumberOfResults: resultsTotal,
title,
onSwitchTab,
searchContainer,
searchContainer
})

const searchResults = buildSearchResult({
searchItems: results,
tabId,
onSearchItemClick,
dataLayer
})

searchForm?.parentNode?.insertBefore(
Expand Down
2 changes: 2 additions & 0 deletions ui.frontend/src/main/webpack/site/js/components/searchTabs.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ export type SearchTabOptions = {
export type TabConfig = {
title: string
url: string
dataLayer: object
}

export type Suggestion = {
Expand All @@ -31,6 +32,7 @@ export type Tab = {
url: string
suggestion?: Suggestion
facetFilters?: FacetFilters
dataLayer: object
}

const CMP_SAAS_RESULTS_CLASS = 'cmp-saas__results'
Expand Down
1 change: 0 additions & 1 deletion ui.frontend/src/main/webpack/site/js/searchElement.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,6 @@ export const getDataAttributeFromSearchElement = (
if (!element) {
return null
}

const searchConfigStr = element.dataset.searchConfig || '{}'
const searchConfig = JSON.parse(searchConfigStr) as SearchConfig

Expand Down
1 change: 1 addition & 0 deletions ui.frontend/src/main/webpack/site/js/types/searchOptions.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,4 +18,5 @@ export type SearchConfig = {
autoSuggestText: string
noResultsText: string
trackingUrl?: string
dataLayer: string
}
2 changes: 1 addition & 1 deletion ui.frontend/src/main/webpack/static/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ <h1 class="cmp-title__text">Welcome to Valtech AEM SAAS!</h1>

<div class="search">
<search
data-search-config='{"title":"Search Cmp","searchFieldPlaceholderText":"Type search term here...","searchButtonText":"Search","loadMoreButtonText":"Load more","searchTabs":[{"title":"Search tab","url":"/content/saas-aem-module/us/en/_jcr_content/root/container/search/search-tabs/searchtab.model.json?wcmmode=disabled&q=wknd",":type":"saas-aem-module/components/searchtab"},{"title":"PDF Only","url":"/content/saas-aem-module/us/en/_jcr_content/root/container/search/search-tabs/searchtab_765476375.model.json?wcmmode=disabled&q=wknd",":type":"saas-aem-module/components/searchtab"}],"autocompleteUrl":"/content/saas-aem-module/us/en/_jcr_content/root/container/search.autocomplete.json","trackingUrl":"/content/saas-aem-module/us/en/_jcr_content/root/container/search.tracking.html","autoSuggestText":"Did you mean:","noResultsText":"No results found.","autocompleteTriggerThreshold":3,"id":"saas-2007378464",":type":"saas-aem-module/components/search",":items":{},":itemsOrder":[]}'
data-search-config='{"title":"Search Cmp","searchFieldPlaceholderText":"Type search term here...","searchButtonText":"Search","loadMoreButtonText":"Load more","searchTabs":[{"title":"Search tab","url":"/content/saas-aem-module/us/en/search-page/_jcr_content/root/container/search/search-tabs/searchtab.model.json?wcmmode=disabled&q=wknd",":type":"saas-aem-module/components/searchtab"},{"title":"PDF Only","url":"/content/saas-aem-module/us/en/search-page/_jcr_content/root/container/search/search-tabs/searchtab_765476375.model.json?wcmmode=disabled&q=wknd",":type":"saas-aem-module/components/searchtab"}],"autocompleteUrl":"/content/saas-aem-module/us/en/search-page/_jcr_content/root/container/search.autocomplete.json","trackingUrl":"/content/saas-aem-module/us/en/search-page/_jcr_content/root/container/search.tracking.html","autoSuggestText":"Did you mean:","noResultsText":"No results found.","autocompleteTriggerThreshold":3,"id":"saas-2007378464",":type":"saas-aem-module/components/search",":items":{},":itemsOrder":[]}'
></search>
</div>
</div>
Expand Down