I'm building an LWC to be used in Record Page and Community, a custom related records list component, that shows formula fields properly formatted (rich-text formatted), so it uses targetConfigs properties.
Fields to retrieve as you see is a comma-separated value, which needs to be parsed into a List in order to iterate over it and get their actual label to be used in the columns header of the data-table.
I'm not well versed in LWC, actually, I had no experience with it, but I'm making some progress.
This is my html file, I removed the references to the js properties just for better readibility
HTML
<template>
<lightning-card icon-name={iconName} title={objectLabel}>
<lightning-datatable
key-field="Id"
data={data}
columns={columns}
hide-checkbox-column="true"></lightning-datatable>
</lightning-card>
</template>
JS Controller
import { LightningElement, api, wire, track} from 'lwc';
import getIconName from '@salesforce/apex/ICRM_DynamicRelatedRecordsList_Ctrlr.getIconName';
import getObjectLabel from '@salesforce/apex/ICRM_DynamicRelatedRecordsList_Ctrlr.getObjectLabel';
import getFieldSet from '@salesforce/apex/ICRM_DynamicRelatedRecordsList_Ctrlr.getFieldSet';
export default class IcrmDrrl extends LightningElement {
@api recordId;
@api objectName = '';
@api relatedField = '';
@api fieldList = '';
@api recordsToDisplay = 0;
@track iconName = '';
@track objectLabel = '';
@track data = [];
@track columns = [];
@wire(getIconName, { objectName: '$objectName' })
wiredIcon({ error, data}) {
if(data) {
this.iconName = data;
} else if (error) {
this.error = error;
this.iconName = undefined;
}
}
@wire(getObjectLabel, { sobjectApiName: '$objectName' })
wiredLabel({ error, data}) {
if(data) {
this.objectLabel = data;
} else if (error) {
this.error = error;
this.objectLabel = undefined;
}
}
@wire(getFieldSet, {
sObjectName: '$objectName',
listOfFields: **---NEED TO PARSE fieldList STRING AND PASS IT HERE---,**
recordId: '$recordId',
relationshipField: '$relatedField',
recordsToDisplay: '$recordsToDisplay'
}) wiredResults({error, data}) {
if (data) {
this.data = data.listData;
this.columns = data.columns;
} else if (error) {
this.error = error;
this.data = undefined;
this.columns = undefined;
}
}
constructor() {
super();
console.log('Object Name: ' + this.fieldList);
}
}
Apex code
@AuraEnabled (Cacheable= true)
public static ColumnAndDataWrapper getFieldSet(String sObjectName, List<String> listOfFields, Id recordId, String relationshipField, Integer recordsToDisplay) {
ColumnAndDataWrapper cdw = new ColumnAndDataWrapper();
List<Columns> columns = new List<Columns>();
String fieldsToFetch = '';
Map<String, Schema.SObjectType> gd = Schema.getGlobalDescribe();
Schema.SObjectType ctype = gd.get(sObjectName);
Map<String, Schema.SObjectField> fmap = ctype.getDescribe().fields.getMap();
// Generating a list of columns
for (String f : listOfFields) {
if (f == 'Name') {
// Uncomment and replace to allow go to record by clicking name
// columns.add(new Columns(fmap.get(f).getDescribe().getLabel(), 'linkName', 'url'));
columns.add(new Columns(fmap.get(f).getDescribe().getLabel(), 'Name', 'text'));
} else {
columns.add(new Columns(fmap.get(f).getDescribe().getLabel(), f, String.valueOf(fmap.get(f).getDescribe().getType()).toLowerCase()));
}
if (fieldsToFetch != '') {
fieldsToFetch += ',';
}
fieldsToFetch += f;
}
// Get the records of requested object
List<SObject> listData;
if (recordsToDisplay == null) {
listData = Database.query('SELECT Id, ' + fieldsToFetch + ' FROM ' + sObjectName + ' WHERE ' + relationshipField + ' = :recordId ');
} else if (recordsToDisplay != null && recordsToDisplay > 0) {
listData = Database.query('SELECT Id, ' + fieldsToFetch + ' FROM ' + sObjectName + ' WHERE ' + relationshipField + ' = :recordId LIMIT ' + recordsToDisplay);
}
cdw.columns = columns;
cdw.listData = listData;
return cdw;
}
public class Columns {
@AuraEnabled public String label;
@AuraEnabled public String fieldName;
@AuraEnabled public String type;
public Columns(String label, String fieldName, String type) {
this.label = label;
this.fieldName = fieldName;
this.type = type;
}
}
public class ColumnAndDataWrapper {
@AuraEnabled public List<Columns> columns;
@AuraEnabled public List<SObject> listData;
}
I'm providing all this in case there are some areas that I need to fix too.
Best Answer
You just need to split the list, which you'd want to do with an @api setter. Change:
To:
From there, wire it to your method parameters: