diff --git a/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-list.component.css b/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-list.component.css
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-list.component.html b/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-list.component.html
new file mode 100644
index 0000000000..ad652783f0
--- /dev/null
+++ b/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-list.component.html
@@ -0,0 +1,7 @@
+
+
\ No newline at end of file
diff --git a/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-list.component.spec.ts b/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-list.component.spec.ts
new file mode 100644
index 0000000000..3ec6e1a778
--- /dev/null
+++ b/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-list.component.spec.ts
@@ -0,0 +1,100 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { ComponentFixture, TestBed, async } from '@angular/core/testing';
+import { Observable } from 'rxjs/Observable';
+import { CoreModule, AlfrescoTranslationService } from 'ng2-alfresco-core';
+import { ActivitiPeopleList } from './activiti-people-list.component';
+import { User, UserEventModel } from '../models/index';
+import { DataTableModule, ObjectDataRow, DataRowEvent, DataRowActionEvent } from 'ng2-alfresco-datatable';
+
+declare let jasmine: any;
+
+const fakeUser: User = new User({
+ id: '1',
+ firstName: 'fake-name',
+ lastName: 'fake-last',
+ email: 'fake@mail.com'
+});
+
+describe('ActivitiPeopleList', () => {
+
+ let activitiPeopleListComponent: ActivitiPeopleList;
+ let fixture: ComponentFixture;
+ let element: HTMLElement;
+ let componentHandler;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ imports: [
+ CoreModule.forRoot(),
+ DataTableModule
+ ],
+ declarations: [
+ ActivitiPeopleList
+ ]
+ }).compileComponents().then(() => {
+
+ let translateService = TestBed.get(AlfrescoTranslationService);
+ spyOn(translateService, 'addTranslationFolder').and.stub();
+ spyOn(translateService.translate, 'get').and.callFake((key) => { return Observable.of(key); });
+
+ fixture = TestBed.createComponent(ActivitiPeopleList);
+ activitiPeopleListComponent = fixture.componentInstance;
+ element = fixture.nativeElement;
+ componentHandler = jasmine.createSpyObj('componentHandler', [
+ 'upgradeAllRegistered'
+ ]);
+
+ window['componentHandler'] = componentHandler;
+ fixture.detectChanges();
+ });
+ }));
+
+ it('should emit row click event', (done) => {
+ let row = new ObjectDataRow(fakeUser);
+ let rowEvent = new DataRowEvent(row, null);
+
+ activitiPeopleListComponent.clickRow.subscribe(selectedUser => {
+ expect(selectedUser.id).toEqual('1');
+ expect(selectedUser.email).toEqual('fake@mail.com');
+ expect(activitiPeopleListComponent.user.id).toEqual('1');
+ expect(activitiPeopleListComponent.user.email).toEqual('fake@mail.com');
+ done();
+ });
+
+ activitiPeopleListComponent.selectUser(rowEvent);
+ });
+
+ it('should emit row action event', (done) => {
+ let row = new ObjectDataRow(fakeUser);
+ let removeObj = {
+ name: 'remove',
+ title: 'Remove'
+ };
+ let rowActionEvent = new DataRowActionEvent(row, removeObj);
+
+ activitiPeopleListComponent.clickAction.subscribe((selectedAction: UserEventModel) => {
+ expect(selectedAction.type).toEqual('remove');
+ expect(selectedAction.value.id).toEqual('1');
+ expect(selectedAction.value.email).toEqual('fake@mail.com');
+ done();
+ });
+
+ activitiPeopleListComponent.onExecuteRowAction(rowActionEvent);
+ });
+});
diff --git a/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-list.component.ts b/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-list.component.ts
new file mode 100644
index 0000000000..eeb4645130
--- /dev/null
+++ b/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-list.component.ts
@@ -0,0 +1,99 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Component, Input, Output, EventEmitter, ViewChild, ContentChild } from '@angular/core';
+import { User, UserEventModel } from '../models/index';
+import { DataColumnListComponent } from 'ng2-alfresco-core';
+import { DataTableComponent } from 'ng2-alfresco-datatable';
+
+declare let componentHandler: any;
+
+@Component({
+ selector: 'activiti-people-list',
+ templateUrl: './activiti-people-list.component.html',
+ styleUrls: ['./activiti-people-list.component.css']
+})
+
+export class ActivitiPeopleList {
+
+ @ContentChild(DataColumnListComponent) columnList: DataColumnListComponent;
+
+ @ViewChild(DataTableComponent)
+ peopleDataTable: DataTableComponent;
+
+ @Input()
+ users: User[];
+
+ @Input()
+ actions: boolean = false;
+
+ @Output()
+ clickRow: EventEmitter = new EventEmitter();
+
+ @Output()
+ clickAction: EventEmitter = new EventEmitter();
+
+ user: User;
+
+ constructor() {
+ }
+
+ ngAfterContentInit() {
+ this.peopleDataTable.columnList = this.columnList;
+ }
+
+ ngAfterViewInit() {
+ this.setupMaterialComponents(componentHandler);
+ }
+
+ setupMaterialComponents(handler?: any): boolean {
+ // workaround for MDL issues with dynamic components
+ let isUpgraded: boolean = false;
+ if (handler) {
+ handler.upgradeAllRegistered();
+ isUpgraded = true;
+ }
+ return isUpgraded;
+ }
+
+ selectUser(event: any) {
+ this.user = event.value.obj;
+ this.clickRow.emit(this.user);
+ }
+
+ hasActions(): boolean {
+ return this.actions;
+ }
+
+ onShowRowActionsMenu(event: any) {
+
+ let removeAction = {
+ title: 'Remove',
+ name: 'remove'
+ };
+
+ event.value.actions = [
+ removeAction
+ ];
+ }
+
+ onExecuteRowAction(event: any) {
+ let args = event.value;
+ let action = args.action;
+ this.clickAction.emit(new UserEventModel({type: action.name, value: args.row.obj}));
+ }
+}