Demo del componente base lightning-record-edit-form

1. Demo: LWC Record Edit Form
Componente Base lightning-record-edit-form

2. Senior Developer
@ Altimetrik UY
federico.giust@icloud.com
https://github.com/fedegiust
@federicogiust
https://www.linkedin.com/in/federicogiust/
Federico Giust

3. Demo: LWC Record Edit Form
lightning-record-edit-form
El componente lightning-record-edit-form es un wrapper que acepta un record ID y puede ser usado para
mostrar uno o mas campos y labels asociados a dicho registro. Se utiliza el componente lightning-input-field
dentro de lightning-record-edit-form para crear campos editables, o bien lightning-output-field para solo
lectura.
• Requiere un record Id para mostrar los campos del registro.
• Utiliza Lightning Data Services.
• No requiere controladores Apex adicionales.
• Se encarga del field-level security y sharing automaticamente. (Los usuarios solo ven la data que tienen
acceso)
https://developer.salesforce.com/docs/component-library/bundle/lightning-record-edit-form/documentation

4. Call center con una lista de contactos, cada contacto tiene un e-Pin configurado para acceder al
soporte.Segun el nivel de acceso del agente van a poder ver todo el e-Pin o solo los ultimos 4 digitos.
El campo es de solo lectura en los layout, y se podra modificar mediante un quick action. En el mismo, si el
usuario tiene permiso de ver data encriptada se le mostrara el pin completo. En el caso de no tener permiso,
el pin estara enmascarado y solo podra ver los ultimos 4 digitos, pero al momento de editar el usuario podra
ver lo que esta digitando.
Para lograrlo, vamos a tener un LWC usando el componente base lightning-record-edit-form que usa LDS y
va a tener que ser expuesto en un Aura component para tener la posibilidad de usarlo como Quick Action,
debido a las limitaciones actuales de LWC.
Caso de uso
Call Center con e-Pin

5. Caso de uso
Un administrador tendra acceso a ver el e-Pin. Un Usuario Standard solo vera los ultimos 4 digitos.
Al momento de editar el usuario vera lo que digita.

6. Para poder desarrollar LWC necesitamos lo siguiente:
• NodeJS.
• Java SDK 8 o superior.
• El cliente de SFDX.
• VisualStudio Code con las extensiones de Salesforce.
• ESLint (opcional).
Que necesitamos?
Para trabajar con LWC

7. En este ejemplo tendremos
• Org configurada con dos usuarios
• Uno de ellos Sys Admin
• El otro Standard User (por ej: Agente del call center)
• Un Permission Set para habilitar "View Encrypted Data" y asignado al Sys Admin
• Un campo de nombre e-Pin en el objeto Contact, el mismo va a ser de tipo Texto y encriptado.
• Un Quick Action en Contact, llamando al componente
Org Setup

8. En este ejemplo tendremos
• Un LWC con el formulario (lightning-record-edit-form) para editar el e-Pin.
• Un <aura:component> como wrapper del LWC el cual le va a pasar el recordId al LWC
• Un Quick Action en Contact, llamando al aura:component
Componente

9. DEMO

10. Recursos y Referencias
• Salesforce CLI
• https://developer.salesforce.com/docs/atlas.en-
us.sfdx_cli_reference.meta/sfdx_cli_reference/cli_reference.htm
• Lightning Web Components Developer Guide
• https://developer.salesforce.com/docs/component-library/documentation/lwc
• Lightning Web Components - Component Reference
• https://developer.salesforce.com/docs/component-library/overview/components
• Trailhead
• https://trailhead.com

11. Gracias!
@federicogiust
https://github.com/fedegiust/lwc-recordeditform