npm package: @sp-entity/entity
Description: Entity class for SharePoint list
Author: Wassim Khalil
Latest version: 1.2.0

# sp-entity

Generate strongly-typed models from SharePoint lists in TypeScript.

## Table of Contents

* [Prerequisites](#prerequisites)
* [Supported SharePoint Versions](#supported-sharepoint-versions)
* [Installation](#installation)
* [Getting Started](#getting-started)
* [Usage](#usage)
    * [Get](#get)
    * [Create](#create)
    * [Update](#update)
    * [Delete](#delete)
    * [Query](#query)
    * [Query with params](#query-with-params)
    * [Query with $expand](#query-with-expand)
    * [Query with paging](#query-with-paging)
    * [SPFx Web Part](#spfx-web-part)
* [Config](#config)
* [Code Generation](#code-generation)
* [Authentication](#authentication)
* [Node Environment](#node-environment)
* [IE10 Support](#ie10-support)
* [License](#license)

## Prerequisites

* Node 6.9.0+
* NPM 3+

## Supported SharePoint Versions

* SharePoint Online
* SharePoint 2016
* SharePoint 2013

## Installation

Install sp-entity cli globally
```bash
npm install -g @sp-entity/cli
```

Add sp-entity as a dependency in project
```bash
npm install @sp-entity/entity --save
```

## Getting Started

### CLI

```bash
# login to sharepoint site
spe login

# generate dataContext folder with default sp-entity config
cd {project folder}/src
spe init

# generate entity classes
spe ./dataContext/spe.config.json
```
### Code

```typescript
import { DataContext } from './dataContext/dataContext'; // generated by sp-entity
import { EmployeeItem } from './dataContext/employee'; // generated by sp-entity

// initialize dataContext with default params (webUrl: _spPageContextInfo.webAbsoluteUrl)
const dataContext: DataContext = new DataContext();
dataContext.employee.get(1).then((employee: EmployeeItem) => {
    console.log(`${employee.firstName} ${employee.lastName}`); // Steve Rogers
});
```

## Usage

The following usage examples are based on [sample generated code](#sample-generated-code) below.

### Get

```typescript
dataContext.employee.get(1).then((employee: EmployeeItem) => {
    console.log(employee);
});

/* Output
{
    id: 1,
    title: 'Mr',
    firstName: 'Steve',
    lastName: 'Rogers',
    officeId: 1,
    active: false,
    skills: ['TypeScript', 'SharePoint'],
    created: '2018-01-01T00:00:00Z',
    createdById: 6
    ...
} */
```

### Create

```typescript
dataContext.employee.create({
    active: true,
    title: 'Mr',
    firstName: 'Steve',
    lastName: 'Rogers',
    officeId: 1
});
```

### Update

```typescript
const employee: EmployeeItem = await dataContext.employee.get(1);
employee.officeId = 5; // update office lookup
employee.skills = ['TypeScript', 'SharePoint']; // update skills
dataContext.employee.update(employee); // commit changes

// or

dataContext.employee.update({
    id: 1, // id property is required for updates
    officeId: 5,
    skills: ['TypeScript', 'SharePoint']
});
```

### Delete

```typescript
dataContext.employee.delete(1);
```

###

### Query

```typescript
dataContext.employee.query().then((employees: Array<EmployeeItem>) => {
    // ...
});
```

### Query with params

```typescript
// entity.fields property holds a map to list fields' internal names
// using es6's object destructuring to get a reference to fields used in code
const { id, firstName, lastName, active, created } = dataContext.employee.fields;

const employees: Array<EmployeeItem> = await dataContext.employee.query({
    $select: [id, firstName, lastName],
    $filter: `${active} eq 1`,
    $orderby: { orderBy: created, ascending: false }
});
```

### Query with $expand

```typescript
// office is a property mapped from a lookup field
const { id, firstName, lastName, office } = dataContext.employee.fields;

const employees: Array<EmployeeItem> = await dataContext.employee.query({
    // $select: ['Id','First_x0020_Name','Last_x0020_Name','Office/City','Office/Country']
    $select: [id, firstName, lastName, office.city, office.country],
    // $expand: ['Office']
    $expand: [office.$name] // $name property holds a lookup's internal name
});
```

### Query with paging

```typescript
import { SpEntityPaged } from '@sp-entity/entity';
import { DataContext } from './dataContext/dataContext';
import { EmployeeFields, EmployeeItem } from './dataContext/employee';

const dataContext: DataContext = new DataContext();
    
const { active } = dataContext.employee.fields;
let employeesPaged: SpEntityPaged<EmployeeFields, EmployeeItem>;

employeesPaged = await dataContext.employee.queryPaged({ $filter: `${active} eq 1`, $top: 5 /* page size */ });
console.log(employeesPaged.page); // 0

employeesPaged = await employeesPaged.getNext();
console.log(employeesPaged.page); // 1

employeesPaged = await employeesPaged.getNext();
console.log(employeesPaged.page); // 2

employeesPaged = await employeesPaged.getPrev();
console.log(employeesPaged.page); // 1

employeesPaged = await employeesPaged.getPrev();
console.log(employeesPaged.page); // 0

const employees: Array<EmployeeItem> = employeesPaged.items;
...
```

### SPFx Web Part

```typescript
import { DataContext } from './dataContext/dataContext'; // generated by sp-entity
import { EmployeeItem } from './dataContext/employee'; // generated by sp-entity

export default class SpEntitySampleWebPart extends BaseClientSideWebPart<ISpEntitySampleWebPartProps> {

  private employees: Array<EmployeeItem>;

  public async onInit(): Promise<void> {

    // initialize dataContext with spfx context web url
    const dataContext: DataContext = new DataContext(this.context.pageContext.web.absoluteUrl);
    this.employees = await dataContext.employee.query();
  }

  private renderEmployees(): string {
    return this.employees
      .map((employee: EmployeeItem) => `<div>${employee.firstName} ${employee.lastName} works at ${employee.office.city}, ${employee.office.country} office</div>`)
      .join('')
  }

  ...
}
```

## Config
**spe init** command generates an **spe.config.json** file with all visible SharePoint lists in currently logged in site. Update config file to only include lists required in project and update their entityName if necessary, e.g.
```javascript
{
    "entities": [
        {
            "entityName": "Employee",
            "listName": "Employees"
        },
        {
            "entityName": "Office",
            "listName": "Offices"
        }
}
```

> An **odataVerbose** flag is automatically added to generated config and set to true for all sp2013 environments. You may remove this flag if your 2013 environment is updated to SP1 and supports JSON light. Read [this post](http://www.spdoctor.net/Home/Article/using-json-light-in-sharepoint-server-2013) for more information.

## Code Generation

Running **spe** command generates a folder for each entity in the config.

The [sample config](#config) above generates the following folder structure:
* dataContext
  * employee
    * employeeFields.interface.ts
    * employeeFields.ts 
    * employeeItem.ts
  * office
    * officeFields.interface.ts
    * officeFields.ts 
    * officeItem.ts
  * dataContext.ts
  * spe.config.json

### Sample Generated Code

#### employeeFields.ts *(auto-generated)*
An *{entityName}Fields.ts* file is generated with mappings for default fields in the list returned by SharePoint's rest API. You may modify the file by adding/removing field mappings, updating property names and adding/removing expand fields for lookups (e.g. *office.city* and *office.country*).

> Make sure to run *spe* tool after modifying this file to automatically update related interfaces.
```typescript
import { EmployeeFields } from './employeeFields.interface';

export const employeeFields: EmployeeFields = {

    active: 'Active',
    created: 'Created',
    // each lookup field in the list is mapped to two properties:
    // an expand property with id and title mappings by default
    createdBy: { $name: 'Author', id: 'Id', title: 'Title' },
    // and an id property
    createdById: 'AuthorId',
    firstName: 'First_x0020_Name',
    id: 'Id',
    lastName: 'Last_x0020_Name',
    // city and country mappings have been added manually here
    office: { $name: 'Office', id: 'Id', title: 'Title', city: 'City', country: 'Country' },
    officeId: 'OfficeId',
    picture: 'Picture',
    permissions: 'EffectiveBasePermissions',
    skills: 'Skills',
    title: 'Title'
};
```

#### employeeItem.ts *(auto-generated)*
```typescript
import { iso8601Date, SpBasePermissions, SpUrlValue } from '@sp-entity/entity';

export interface EmployeeItem {

    active: boolean;
    readonly created: iso8601Date;
    readonly createdBy: { id: number, title: string };
    readonly createdById: number;
    firstName: string;
    readonly id: number;
    lastName: string;
    readonly office: { city: string, country: string, id: number, title: string };
    officeId: number;
    readonly permissions: SpBasePermissions;
    picture: SpUrlValue;
    skills: Array<string>;
    title: string;
}

```

#### dataContext.ts *(auto-generated)*
```typescript
import { SpEntity } from '@sp-entity/entity';
import { EmployeeFields, employeeFields, EmployeeItem, employeeListName } from './employee';
import { OfficeFields, officeFields, OfficeItem, officeListName } from './office';

export class DataContext {

    public readonly employee: SpEntity<EmployeeFields, EmployeeItem>;
    public readonly office: SpEntity<OfficeFields, OfficeItem>;

    public constructor(webUrl?: string) {

        this.employee = new SpEntity(employeeListName, employeeFields, webUrl);
        this.office = new SpEntity(officeListName, officeFields, webUrl);
    }
}
```

## Authentication
**spe login** and **spe logout** commands can be used to store/delete encrypted credentials for context sharepoint site.
Using **spe** cli without logging in first will prompt for credentials every time.

Login wizard is provided by the following awesome libraries:
* [node-sp-auth](https://github.com/s-KaiNet/node-sp-auth) by Sergei Sergeev [@s-KaiNet](https://github.com/s-KaiNet)
* [node-sp-auth-config](https://github.com/koltyakov/node-sp-auth-config) by Andrew Koltyakov [@koltyakov](https://github.com/koltyakov)

## Node Environment
In order to use sp-entity in a node environment, a fetch client factory must be provided using **setup** method

Install [pnp-auth](https://github.com/SharePoint-NodeJS/pnp-auth) dependency

```bash
npm install pnp-auth --save
```

Setup sp-entity's **fetchClientFactory**

```typescript
import { setup } from '@sp-entity/entity';
import { IAuthOptions } from 'node-sp-auth';
import NodeFetchClient from 'pnp-auth/lib/NodeFetchClient';

const siteUrl: string = 'https://contoso.sharepoint.com/sites/example';

const authOptions: IAuthOptions = {
    username: 'user@contoso.onmicrosoft.com',
    password: 'password'
};

setup({
    fetchClientFactory: () => {
        return new NodeFetchClient(authOptions, siteUrl) as GlobalFetch;
    }
});

const dataContext: DataContext = new DataContext();
...
```

## IE10 Support
Following polyfills are required for using sp-entity in IE10

* [es6-promise](https://github.com/stefanpenner/es6-promise)
* [whatwg-fetch](https://github.com/github/fetch)

> This is not required for SPFx projects as they include above polyfills by default

## License
MIT