Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fixed timezone issue in tasks component #171

Merged
merged 1 commit into from
Oct 8, 2019
Merged

Fixed timezone issue in tasks component #171

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
71 changes: 36 additions & 35 deletions src/components/mgt-tasks/mgt-tasks.ts
View file
Open in desktop
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 src/components/mgt-tasks/task-sources.ts
View file
Open in desktop
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';
}