Refactoring rest request in SPFx Web aprt - rest

Question

I have worked in a web part that fetch items from a SP list and then filter or groups these results.
For each filter action I send a new request to SP with Rest and I am using the rest code to get back the filtered items and show them in the web part.
Right now I have two filter actions triggered by onClick events.
Each action looks like this:
To filter by closed agreements:
private getEnded(): void {
this.props.provider.getEnded().then((originalitems: IList[]) => {
this.setState({
filteredListItems: originalitems,
filter: true
});
});
}
and to filter by last day passed:
private getPassed(): void {
this.props.provider.getPassed().then((originalitems: IList[]) => {
this.setState({
filteredListItems: originalitems,
filter: true
});
});
}
and in the dataprovider file I have these methods, each one of them make request to SharePoint, the only difference is the filter parameter:
To get closed agreements (called from the method getEnded()):
public async getEnded(): Promise<IList[]> {
let today = new Date();
let Agreements: IList[] = [];
const items = await sp.web.lists
.getByTitle("AgreementDatabase")
.items.select(this.select)
.filter(
`(AgreementEnded eq true) and (AgreementEndDate le '${today.toISOString()}')`
)
.expand("SalesManager,TaxCatchAll,FrameworkAgreement")
.get();
items.forEach(item => {
Agreements.push({
Title: item.Title,
Id: item.Id,
CustomerAgreementNr: item.CustomerAgreementNr,
AgreementType: item.AgreementType,
Customer: item.TaxCatchAll[0].Term,
FrameworkAgreement: item.FrameworkAgreement.Title,
ContactPerson: item.ContactPerson,
SalesManager: item.SalesManager.FirstName + " " + item.SalesManager.LastName,
DeliveryType: item.DeliveryType,
AgreementStartDate: item.AgreementStartDate,
AgreementEndDate: item.AgreementEndDate,
AgreementEnded: item.AgreementEnded,
LastPriceAdjustment: item.LastPriceAdjustment,
NextPriceAdjustment: item.NexPriceAdjustment,
});
});
return new Promise<IList[]>(async resolve => {
resolve(Agreements);
});
}
and to get passed passed agreements (called from the method getPassed()):
public async getPassed(): Promise<IList[]> {
let today = new Date();
let Agreements: IList[] = [];
const items = await sp.web.lists
.getByTitle("AgreementDatabase")
.items.select(this.select)
.filter(`LastPriceAdjustment le '${today.toISOString()}'`)
.expand("SalesManager,TaxCatchAll,FrameworkAgreement")
.get();
items.forEach(item => {
Agreements.push({
Title: item.Title,
Id: item.Id,
CustomerAgreementNr: item.CustomerAgreementNr,
AgreementType: item.AgreementType,
Customer: item.TaxCatchAll[0].Term,
FrameworkAgreement: item.FrameworkAgreement.Title,
ContactPerson: item.ContactPerson,
SalesManager: item.SalesManager.FirstName + " " + item.SalesManager.LastName,
DeliveryType: item.DeliveryType,
AgreementStartDate: item.AgreementStartDate,
AgreementEndDate: item.AgreementEndDate,
AgreementEnded: item.AgreementEnded,
LastPriceAdjustment: item.LastPriceAdjustment,
NextPriceAdjustment: item.NexPriceAdjustment,
});
});
return new Promise<IList[]>(async resolve => {
resolve(Agreements);
});
}
As you can see the method that request information from SP are almost identical, the only difference is the filter parameter.
I am wondering how can I resuse just one of this rest method tho fetch and filter data from sharepoint?
Best regards
Americo

Answer 1

You can write one method and pass the filer:
private getEnded(): void {
const filter = `(AgreementEnded eq true) and (AgreementEndDate le '${today.toISOString()}')`;
this.props.provider.getAgreements(filter).then((originalitems: IList[]) => {
this.setState({
filteredListItems: originalitems,
filter: true
});
});
private getPassed(): void {
const filter = `LastPriceAdjustment le '${today.toISOString()}'`;
this.props.provider.getAgreements(filter).then((originalitems: IList[]) => {
this.setState({
filteredListItems: originalitems,
filter: true
});
});
public async getAgreements(filterAgreements: string): Promise<IList[]> {
let today = new Date();
let Agreements: IList[] = [];
const items = await sp.web.lists
.getByTitle("AgreementDatabase")
.items.select(this.select)
.filter(filterAgreements)
.expand("SalesManager,TaxCatchAll,FrameworkAgreement")
.get();
items.forEach(item => {
Agreements.push({
Title: item.Title,
Id: item.Id,
CustomerAgreementNr: item.CustomerAgreementNr,
AgreementType: item.AgreementType,
Customer: item.TaxCatchAll[0].Term,
FrameworkAgreement: item.FrameworkAgreement.Title,
ContactPerson: item.ContactPerson,
SalesManager: item.SalesManager.FirstName + " " + item.SalesManager.LastName,
DeliveryType: item.DeliveryType,
AgreementStartDate: item.AgreementStartDate,
AgreementEndDate: item.AgreementEndDate,
AgreementEnded: item.AgreementEnded,
LastPriceAdjustment: item.LastPriceAdjustment,
NextPriceAdjustment: item.NexPriceAdjustment,
});
});
return new Promise<IList[]>(async resolve => {
resolve(Agreements);
});
Other improvement:
You can use .map() instead of .foreach()
Agreements = items.map(item => {
Title: item.Title,
Id: item.Id,
CustomerAgreementNr: item.CustomerAgreementNr,
AgreementType: item.AgreementType,
Customer: item.TaxCatchAll[0].Term,
FrameworkAgreement: item.FrameworkAgreement.Title,
ContactPerson: item.ContactPerson,
SalesManager: item.SalesManager.FirstName + " " + item.SalesManager.LastName,
DeliveryType: item.DeliveryType,
AgreementStartDate: item.AgreementStartDate,
AgreementEndDate: item.AgreementEndDate,
AgreementEnded: item.AgreementEnded,
LastPriceAdjustment: item.LastPriceAdjustment,
NextPriceAdjustment: item.NexPriceAdjustment,
});