Créer une source de données personnalisée pour les champs déroulants dans l’éditeur de configuration contextuel / Blogs / Perficient

Configuration contextuelle Sling dans AEM (Gestionnaire d’expérience Adobe) offre la possibilité de définir des paires clé-valeur pour une logique métier spécifique à un chemin de contenu au lieu d’une configuration à l’échelle du site ou d’une configuration à l’échelle du modèle. Par exemple, si vous souhaitez définir des valeurs différentes pour le chemin /content/mysite/en et /content/mysite/es, nous pouvons utiliser la configuration contextuelle au niveau du chemin spécifique.

Ces valeurs de configuration contextuelles peuvent sembler aussi simples que des paires clé-valeur avec un simple champ de texte, ou une liste déroulante codée en dur pour sélectionner des valeurs prédéfinies pour une clé.

L’exemple d’extrait de code ci-dessous permet de créer une liste déroulante à l’aide de WCM IO.

@Property(label = "My Dropdown", description = "Values for my dropdown.", property = { 

    "widgetType=dropdown", 

    "dropdownOptions=[" 

        + "{'value':'option1','description':'Desc for option1'}," 

        + "{'value':'option2','description':'Desc for option2'}," 

        + "{'value':'option3','description':'Desc for option3'}" 

        + "]" 

}) 

String sampleDropDownParameter();

Du point de vue d’un utilisateur professionnel, nous aimons avoir des valeurs dynamiques dans la liste déroulante afin de ne pas avoir à attendre un autre déploiement de code.

Du point de vue d’un développeur, dans ce blog, je vais montrer comment résoudre l’exigence ci-dessus.

Avec l’extension WCM IO Editor, nous pouvons implémenter DataSource pour fournir ces valeurs déroulantes, ce qui rend le comportement cohérent, surtout si nous utilisons la même source pour d’autres endroits. Ensuite, nous pouvons simplement utiliser la même source de données dans notre implémentation de source de données personnalisée.

Il offre Fournisseur d’options déroulantes classe auquel nous devons implémenter et écrire notre logique personnalisée.

Considérons que nous écrivons des options déroulantes pour fournir la liste des chemins de modèles requis pour une sorte de mappage.

Nous implémenterons DropdownOptionsProvider qui aura également une capacité de configuration où nous fournirons le chemin racine des modèles.

/** 
 * Implementation for Template Path Data source for CAC. 
 */ 
@Component(service = DropdownOptionProvider.class, 
        immediate = true, property = {"io.wcm.caconfig.editor.widget.dropdown.provider=templateDataSource"}) 
@ServiceDescription("Implementation For DropdownOptionProvider For Providing Templates Path ") 
@Slf4j 
@Designate(ocd= TemplatesDatasourceServiceImpl.Configuration.class) 
public final class TemplatesDatasourceServiceImpl implements DropdownOptionProvider { 
 
    private Configuration configuration; 
 
    @Activate 
    @Modified 
    public void activate(final Configuration configuration){ 
        this.configuration = configuration; 
    } 
 
    @Override 
    public @NotNull List<DropdownOptionItem> getDropdownOptions(@NotNull final Resource resource) { 
        final List<DropdownOptionItem> dropdownOptionItems = new ArrayList<>(); 
        final var resourceResolver = resource.getResourceResolver(); 
        final var templatesResource = resourceResolver.getResource(configuration.template_path()); 
        dropdownOptionItems.add(new DropdownOptionItem("ALL", "ALL - To be used for mapping in All templates")); 
        if (templatesResource != null) { 
            templatesResource.getChildren().forEach(templateResource -> { 
                final var contentResource = templateResource.getChild("jcr:content"); 
                final var contentResourceProps = Optional.ofNullable(contentResource) 
                        .map(Resource::getValueMap).orElse(new ValueMapDecorator(new HashMap<>())); 
                final var title = contentResourceProps.get("jcr:title", String.class); 
                final DropdownOptionItem dropdownOptionItem = 
                        new DropdownOptionItem(templateResource.getPath(), title + "|" 
                                + templateResource.getPath()); 
                dropdownOptionItems.add(dropdownOptionItem); 
            }); 
        } 
        return dropdownOptionItems; 
    } 
 
    @ObjectClassDefinition(name = "Template Path For Mappings") 
    public @interface Configuration { 
        @AttributeDefinition( 
                name = "Template Paths" 
                , description = "Template Paths" 
        ) 
        String template_path() default "/conf/we-retail/settings/wcm/templates"; 
    } 
 
 
}

Nous pouvons voir que Configuration offre la possibilité de configurer le chemin racine du modèle. Ici, nous définissons simplement le chemin we-retail comme chemin par défaut.

io.wcm.caconfig.editor.widget.dropdown.provider=templateDataSource

Cela enregistrera notre source de données avec le nom de templateDataSource que nous pourrons utiliser dans Annotation de la propriété déroulante.

@Property(label = "Select Template Name/Path", description = "Name Of Template to be mapped.", property = { 
        "widgetType=dropdown", 
        "dropdownOptionsProvider=templateDataSource" 
}, order = 1) 
String getTemplatePath();

Il apparaîtra dans la fenêtre de l’éditeur sous la forme illustré ci-dessous.

Nous pouvons le voir remplir dynamiquement tous les modèles We Retail.

Nous pouvons mettre à jour la logique en fonction des conditions requises, comme l’utilisation de listes génériques, de pages existantes ou de tout appel d’API tierce.