Comment créer un explorateur de fichiers sur Salesforce à partir des composants lightning LWC & Aura ?

J’ai reçu il y a quelques temps, une demande d’un client qui se plaignait de l’absence de visibilité globale sur les dossiers dans Salesforce et il n’avait pas complètement tort.

En effet, lorsqu’il y a plusieurs dossiers imbriqué l’un en dessous de l’autre avec des documents dans chaque dossiers, la visibilité qu’offre la solution standard de salesforce est considérablement réduite. De plus, l’utilisateur n’a pas la possibilité de visualiser les documents en miniature afin de les prévisualiser sans avoir a naviguer vers d’autres pages pour les ouvrir, ce qui est beaucoup plus pratique.

Alors, j’ai pensé à l’élaboration d’une solution qui permettrait d’avoir une navigation fluide entre les dossiers et d’avoir une certaine vue sur leur hiérarchie avec la possibilité d’afficher en miniature le contenu des fichiers instantanément.

Pour élaborer ma solution, je me suis inspiré du (finder) du mac os :

LWC & AURA

Après le lancement de l’expérience Salesforce Lightning en 2015 (winter’ 2015), salesforce a recommandé aux développeurs de migrer vers ses nouvelles technologies notamment vers le composant lightning (Aura) dans un premier temps puis vers les LWC après leur publication en 2019 (spring 2019).

Voici un article qui décrit les avantages des LWC : https://trailhead.salesforce.com/en/content/learn/modules/lightning-web-components-basics/discover-lightning-web-components

LWC vs Aura

Les composants Web Lightning (LWC) s’alignent étroitement sur les normes Web modernes, ce qui les rend plus performants pour le rendu des navigateurs. Le bundle LWC a une structure plus simple que celle des composants Aura, et le développement de LWC ressemble beaucoup plus à d’autres frameworks JavaScript modernes. Cela peut augmenter la productivité des développeurs. Et non seulement il est plus facile pour les développeurs de créer avec LWC, mais ils peuvent également augmenter les performances des applications par rapport aux composants Aura.

Pourquoi aura ?

Bien que les LWC sont plus performants que les composants aura, les composants Aura restent nécessaires dans certains cas.

Pour afficher les fichiers en miniature, nous avons besoin d’un composant lightning appelé lightning:fileCard. Malheureusement, ce composant n’est pas disponible dans LWC, c’est pourquoi j’ai utilisé Aura pour afficher les fichiers en miniature.

Voici les considérations à prendre en compte lors des interactions entre LWC et Aura https://developer.salesforce.com/blogs/2019/02/working-with-aura-and-lightning-web-components-interoperability-and-migration.html

Découper l’application en composant :

La composition permet de créer des composants complexes à partir de composants de blocs de construction plus simples. La composition d’applications et de composants à partir d’un ensemble de composants plus petits rend le code plus réutilisable et maintenable, donc dans un premier temps j’ai décomposé mon application en 3 parties ou chaque partie est décomposée à son tour en composants.

  1. File header (LWC):
  • File current path (LWC).
  • File uploader (LWC).
  • File switch displayer (LWC).
  • File search (LWC).
  • Folder actions(LWC).

2. File tree (LWC).

  • Workspace form (LWC).
  • Folder tree (LWC).
  • Library actions(LWC).

3. File displayer (Aura).

  • File cards (Aura).
  • File table (LWC).

Communication entre les composants :

Afin de créer une communication à travers le modèle d’objet de document (DOM), j’ai créé un canal Lightning Message Service.

https://developer.salesforce.com/docs/component-library/bundle/lightning-message-service/documentation

Démo :

Parcourir les dossiers, afficher leur contenu et charger de nouveaux documents :

Création, Suppression et déplacement des dossiers :

Recherche rapide de documents dans un fichier :

Création d’une librairie :

Code source : https://github.com/Altius-mena/Library

lien d’installation du package : https://login.salesforce.com/packaging/installPackage.apexp?p0=04t4K000001on7g

Samy Dilem

Consultant Salesforce - Altius services.

Comment créer une extension spécifique métier sur Sage FRP1000 ?

Votre progiciel Sage FRP1000 vous permet de concevoir vous-même des écrans correspondant à vos besoins et peuvent ensuite être affectés à certains utilisateurs via la console d’administration.

Read more >>

Utiliser un IDP pour se connecter à Salesforce (Part 1 - Getting Started)

Read more >>

Comment récupérer des données de Salesforce depuis un système externe ?

Read more >>

Intégration de Slack avec Salesforce, comment procéder ?

Pour optimiser la collaboration entre les membres de l’équipe et gérer plus efficacement votre processus de vente, vous pouvez utiliser simultanément Salesforce et la plateforme de messagerie Slack. Cette intégration prend en charge Sales Cloud et Service Cloud dans les expériences Lightning et Classic, elle est disponible pour toutes les éditions.

Read more >>

Comment protéger un logiciel en Algérie ?

De prime abord, les brevets d’invention semblent constituer, pour les pays en voie de développement, un facteur de développement puissant. Cependant, pour bien saisir les enjeux de cette problématique, il importe d’apporter des réponses à certaines questions essentielles.

Read more >>

Contact

Les informations que vous nous fournissez, seront totalement confidentielles et utilisées uniquement pour vous contacter.

Merci ! Votre demande a été reçue !
Oops! Something went wrong while submitting the form.