Skip to content

Commit

Permalink
Merge pull request #171 from microsoftgraph/nmetulev/tasks-152
Browse files Browse the repository at this point in the history
Fixed timezone issue in tasks component
  • Loading branch information
vogtn committed Oct 8, 2019
1 parent 2c9c973 commit 7d9c02d
Show file tree
Hide file tree
Showing 2 changed files with 113 additions and 65 deletions.
71 changes: 36 additions & 35 deletions packages/mgt/src/components/mgt-tasks/mgt-tasks.ts
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,6 @@ const TASK_RES = {
BASE_SELF_ASSIGNED: 'All Tasks',
BUCKETS_SELF_ASSIGNED: 'All Folders',
BUCKET_NOT_FOUND: 'Folder not found',
DUE_DATE_TIME: 'T17:00',
PLANS_SELF_ASSIGNED: 'All groups',
PLAN_NOT_FOUND: 'Group not found'
},
Expand All @@ -38,7 +37,6 @@ const TASK_RES = {
BASE_SELF_ASSIGNED: 'Assigned to Me',
BUCKETS_SELF_ASSIGNED: 'All Buckets',
BUCKET_NOT_FOUND: 'Bucket not found',
DUE_DATE_TIME: 'T17:00',
PLANS_SELF_ASSIGNED: 'All Plans',
PLAN_NOT_FOUND: 'Plan not found'
}
Expand Down Expand Up @@ -159,7 +157,7 @@ export class MgtTasks extends MgtBaseComponent {
* contains user chosen date for new task due date
* @type {string}
*/
@property() private _newTaskDueDate: string = '';
@property() private _newTaskDueDate: Date = null;

/**
* contains id for new user created task??
Expand Down Expand Up @@ -250,7 +248,7 @@ export class MgtTasks extends MgtBaseComponent {
this._newTaskSelfAssigned = false;
this._newTaskDrawerId = '';
this._newTaskDresserId = '';
this._newTaskDueDate = '';
this._newTaskDueDate = null;
this._newTaskName = '';
this._newTaskBeingAdded = false;

Expand Down Expand Up @@ -278,9 +276,16 @@ export class MgtTasks extends MgtBaseComponent {
return;
}

this._inTaskLoad = true;
const provider = Providers.globalProvider;
if (!provider || provider.state !== ProviderState.SignedIn) {
return;
}

this._me = await ts.me();
this._inTaskLoad = true;
let meTask;
if (!this._me) {
meTask = provider.graph.getMe();
}

if (this.targetId) {
if (this.dataSource === 'todo') {
Expand All @@ -292,11 +297,12 @@ export class MgtTasks extends MgtBaseComponent {
await this._loadAllTasks(ts);
}

this._inTaskLoad = false;

if (!this._hasDoneInitialLoad) {
this._hasDoneInitialLoad = true;
if (meTask) {
this._me = await meTask;
}

this._inTaskLoad = false;
this._hasDoneInitialLoad = true;
}

/**
Expand All @@ -319,7 +325,7 @@ export class MgtTasks extends MgtBaseComponent {
this._showNewTask = false;

this._newTaskSelfAssigned = false;
this._newTaskDueDate = '';
this._newTaskDueDate = null;
this._newTaskName = '';
this._newTaskDresserId = '';
}
Expand Down Expand Up @@ -449,7 +455,7 @@ export class MgtTasks extends MgtBaseComponent {

private async addTask(
name: string,
dueDateTime: string,
dueDate: Date,
topParentId: string,
immediateParentId: string,
assignments: PlannerAssignments = {}
Expand All @@ -461,15 +467,12 @@ export class MgtTasks extends MgtBaseComponent {

const newTask = {
assignments,
dueDate,
immediateParentId,
name,
topParentId
} as ITask;

if (dueDateTime && dueDateTime !== 'T') {
newTask.dueDate = this.getDateTimeOffset(dueDateTime + 'Z');
}

this._newTaskBeingAdded = true;
await ts.addTask(newTask);
await this.loadTasks();
Expand Down Expand Up @@ -520,7 +523,7 @@ export class MgtTasks extends MgtBaseComponent {
) {
this.addTask(
this._newTaskName,
this._newTaskDueDate ? this._newTaskDueDate + this.res.DUE_DATE_TIME : null,
this._newTaskDueDate,
this.isDefault(this._currentTargetDresser) ? this._newTaskDresserId : this._currentTargetDresser,
this.isDefault(this._currentTargetDrawer) ? this._newTaskDrawerId : this._currentTargetDrawer,
this._newTaskSelfAssigned
Expand Down Expand Up @@ -755,9 +758,14 @@ export class MgtTasks extends MgtBaseComponent {
label="new-taskDate-input"
aria-label="new-taskDate-input"
role="input"
.value="${this._newTaskDueDate}"
.value="${this.dateToInputValue(this._newTaskDueDate)}"
@change="${(e: Event) => {
this._newTaskDueDate = (e.target as HTMLInputElement).value;
const value = (e.target as HTMLInputElement).value;
if (value) {
this._newTaskDueDate = new Date(value + 'T17:00');
} else {
this._newTaskDueDate = null;
}
}}"
/>
</span>
Expand Down Expand Up @@ -819,7 +827,6 @@ export class MgtTasks extends MgtBaseComponent {
private renderTaskHtml(task: ITask) {
const { name = 'Task', completed = false, dueDate, assignments } = task;

const dueDateString = new Date(dueDate);
const people = Object.keys(assignments);

const taskCheck = this._loadingTasks.includes(task.id)
Expand Down Expand Up @@ -858,7 +865,7 @@ export class MgtTasks extends MgtBaseComponent {
: html`
<span class="TaskDetail TaskDue">
${this.renderCalendarIcon()}
<span>${getShortDateString(dueDateString)}</span>
<span>${getShortDateString(dueDate)}</span>
</span>
`;

Expand Down Expand Up @@ -1034,16 +1041,6 @@ export class MgtTasks extends MgtBaseComponent {
return keys.includes(this._me.id);
}

private getDateTimeOffset(dateTime: string) {
let offset = (new Date().getTimezoneOffset() / 60).toString();
if (offset.length < 2) {
offset = '0' + offset;
}

dateTime = dateTime.replace('Z', `-${offset}:00`);
return dateTime;
}

private getPlanTitle(planId: string): string {
if (this.isDefault(planId)) {
return this.res.BASE_SELF_ASSIGNED;
Expand Down Expand Up @@ -1090,11 +1087,15 @@ export class MgtTasks extends MgtBaseComponent {
);
}

private taskSubPlanFilter(task: ITask) {
return task.topParentId === this._currentSubTargetDresser || this.isDefault(this._currentSubTargetDresser);
}

private taskBucketPlanFilter(task: ITask) {
return task.immediateParentId === this._currentTargetDrawer || this.isDefault(this._currentTargetDrawer);
}

private dateToInputValue(date: Date) {
if (date) {
return new Date(date.getTime() - date.getTimezoneOffset() * 60000).toISOString().split('T')[0];
}

return null;
}
}
107 changes: 77 additions & 30 deletions packages/mgt/src/components/mgt-tasks/task-sources.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
* -------------------------------------------------------------------------------------------
*/

import { PlannerAssignments, User } from '@microsoft/microsoft-graph-types';
import { PlannerAssignments } from '@microsoft/microsoft-graph-types';
import { OutlookTask, OutlookTaskFolder, OutlookTaskGroup } from '@microsoft/microsoft-graph-types-beta';
import { Graph } from '../../Graph';
/**
Expand All @@ -32,10 +32,10 @@ export interface ITask {
/**
* task dueDate
*
* @type {string}
* @type {Date}
* @memberof ITask
*/
dueDate: string;
dueDate: Date;
/**
* is task completed
*
Expand Down Expand Up @@ -153,25 +153,86 @@ export interface IDresser {
_raw?: any;
}
/**
* ItaskSource
* A common interface for both planner and todo tasks
*
* @export
* @interface ITaskSource
*/
export interface ITaskSource {
// tslint:disable
me(): Promise<User>;
/**
* Promise that returns task collections for the signed in user
*
* @returns {Promise<IDresser[]>}
* @memberof ITaskSource
*/
getMyDressers(): Promise<IDresser[]>;

/**
* Promise that returns a single task collection by collection id
*
* @param {string} id
* @returns {Promise<IDresser>}
* @memberof ITaskSource
*/
getSingleDresser(id: string): Promise<IDresser>;

/**
* Promise that returns all task groups in task collection
*
* @param {string} id
* @returns {Promise<IDrawer[]>}
* @memberof ITaskSource
*/
getDrawersForDresser(id: string): Promise<IDrawer[]>;

/**
* Promise that returns all tasks in task group
*
* @param {string} id
* @param {string} parId
* @returns {Promise<ITask[]>}
* @memberof ITaskSource
*/
getAllTasksForDrawer(id: string, parId: string): Promise<ITask[]>;

/**
* Promise that completes a single task
*
* @param {string} id
* @param {string} eTag
* @returns {Promise<any>}
* @memberof ITaskSource
*/
setTaskComplete(id: string, eTag: string): Promise<any>;

/**
* Promise that sets a task to incomplete
*
* @param {string} id
* @param {string} eTag
* @returns {Promise<any>}
* @memberof ITaskSource
*/
setTaskIncomplete(id: string, eTag: string): Promise<any>;

/**
* Promise to add a new task
*
* @param {ITask} newTask
* @returns {Promise<any>}
* @memberof ITaskSource
*/
addTask(newTask: ITask): Promise<any>;

/**
* Promise to delete a task by id
*
* @param {string} id
* @param {string} eTag
* @returns {Promise<any>}
* @memberof ITaskSource
*/
removeTask(id: string, eTag: string): Promise<any>;
// tslint:enable
}
/**
* async method to get user details
Expand All @@ -180,15 +241,6 @@ export interface ITaskSource {
*/
class TaskSourceBase {
constructor(public graph: Graph) {}
/**
* returns Promise with logged in user details
*
* @returns {Promise<User>}
* @memberof TaskSourceBase
*/
public async me(): Promise<User> {
return await this.graph.getMe();
}
}

/**
Expand All @@ -212,6 +264,7 @@ export class PlannerTaskSource extends TaskSourceBase implements ITaskSource {

return plans.map(plan => ({ id: plan.id, title: plan.title } as IDresser));
}

/**
* returns promise single dresser or plan from plan.id
*
Expand All @@ -224,6 +277,7 @@ export class PlannerTaskSource extends TaskSourceBase implements ITaskSource {

return { id: plan.id, title: plan.title, _raw: plan };
}

/**
* returns promise with Bucket for a plan from bucket.id
*
Expand Down Expand Up @@ -261,7 +315,7 @@ export class PlannerTaskSource extends TaskSourceBase implements ITaskSource {
_raw: task,
assignments: task.assignments,
completed: task.percentComplete === 100,
dueDate: task.dueDateTime,
dueDate: task.dueDateTime && new Date(task.dueDateTime),
eTag: task['@odata.etag'],
id: task.id,
immediateParentId: task.bucketId,
Expand Down Expand Up @@ -306,7 +360,7 @@ export class PlannerTaskSource extends TaskSourceBase implements ITaskSource {
return await this.graph.planner_addTask({
assignments: newTask.assignments,
bucketId: newTask.immediateParentId,
dueDateTime: newTask.dueDate,
dueDateTime: newTask.dueDate && newTask.dueDate.toISOString(),
planId: newTask.topParentId,
title: newTask.name
});
Expand Down Expand Up @@ -403,7 +457,7 @@ export class TodoTaskSource extends TaskSourceBase implements ITaskSource {
_raw: task,
assignments: {},
completed: !!task.completedDateTime,
dueDate: task.dueDateTime && task.dueDateTime.dateTime,
dueDate: task.dueDateTime && new Date(task.dueDateTime.dateTime + 'Z'),
eTag: task['@odata.etag'],
id: task.id,
immediateParentId: id,
Expand Down Expand Up @@ -444,12 +498,14 @@ export class TodoTaskSource extends TaskSourceBase implements ITaskSource {
*/
public async addTask(newTask: ITask): Promise<any> {
const task = {
assignedTo: plannerAssignmentsToTodoAssign(newTask.assignments),
parentFolderId: newTask.immediateParentId,
subject: newTask.name
} as OutlookTask;
if (newTask.dueDate) {
task.dueDateTime = { dateTime: newTask.dueDate, timeZone: 'UTC' };
task.dueDateTime = {
dateTime: newTask.dueDate.toISOString(),
timeZone: 'UTC'
};
}
return await this.graph.todo_addTask(task);
}
Expand All @@ -465,12 +521,3 @@ export class TodoTaskSource extends TaskSourceBase implements ITaskSource {
return await this.graph.todo_removeTask(id, eTag);
}
}
/**
* Assignment method for user to task
*
* @param {PlannerAssignments} assignments
* @returns {string}
*/
function plannerAssignmentsToTodoAssign(assignments: PlannerAssignments): string {
return 'John Doe';
}

0 comments on commit 7d9c02d

Please sign in to comment.