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.

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

Adds user context filter to dashboard calendar #7786

Merged
merged 33 commits into from
Jul 19, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
33 commits
Select commit Hold shift + click to select a range
410a772
installs ember-local-storage.
stopfstedt Apr 18, 2024
403182c
work in progress - adds user context filter to dashboard calendar.
stopfstedt Apr 19, 2024
4cf462e
move toggle-button styles into multi-button mixin so they can be reused.
stopfstedt Jun 20, 2024
2e84ac5
moves user context filter toggles into the right place.
stopfstedt Jun 20, 2024
f18f5c3
flesh out and style user context toggle component.
stopfstedt Jun 20, 2024
66df335
rm context filter perms check.
stopfstedt Jun 20, 2024
fe1213f
updates user events filtering to include admin and learner context.
stopfstedt Jun 20, 2024
81e31b0
only expose user context filters to users with elevated privs.
stopfstedt Jun 21, 2024
4891216
fleshes out component tests.
stopfstedt Jun 21, 2024
e45eef9
code-cleanup: rm markup from component that's never rendered.
stopfstedt Jun 24, 2024
48679a9
adds data-test attrs to dashboard calendar components.
stopfstedt Jun 24, 2024
351e297
adds data-test attrs to dashboard calendar components.
stopfstedt Jun 24, 2024
804fa8d
start fleshing out page objects for dashboard calendar components.
stopfstedt Jun 24, 2024
b276603
replace qunit-dom with page objects in dashboard calendar acceptance …
stopfstedt Jun 25, 2024
ec8f711
revamps component page object.
stopfstedt Jun 26, 2024
3de5019
render all buttons as active if no user context is selected.
stopfstedt Jun 28, 2024
13fe2ee
better French translations for dashboard calendar context user controls.
stopfstedt Jun 28, 2024
0f95c18
provide accessible description and title ("tooltip") to labels.
stopfstedt Jun 28, 2024
6f56a28
adds user context filter tests.
stopfstedt Jul 1, 2024
95733e8
improve user context filter descriptions and add translations where m…
stopfstedt Jul 1, 2024
d2b48ce
rm empty lint-todo file.
stopfstedt Jul 1, 2024
b8e4c30
replaced tracked properties and component init with getters.
stopfstedt Jul 8, 2024
637faa4
replaces data loading via template modifiers with tracked-async-data …
stopfstedt Jul 8, 2024
269eb5f
replaces Resource with TrackedAsyncData.
stopfstedt Jul 8, 2024
707d515
rm unused method.
stopfstedt Jul 8, 2024
a7df24c
updates lint todos.
stopfstedt Jul 8, 2024
7d9145e
run a11y check in integration test.
stopfstedt Jul 8, 2024
9cd009f
take snapshots in user-context calendar-filters tests.
stopfstedt Jul 8, 2024
517ae5a
implement local storage to track user context filter selections on th…
stopfstedt Jul 9, 2024
e3840a6
opt-out of ember-data/ember-local-storage integration.
stopfstedt Jul 12, 2024
9286e32
rm debugging statement.
stopfstedt Jul 12, 2024
d48f3c3
rm unnecessary peer-dep declaration.
stopfstedt Jul 12, 2024
619bc11
fixes bad import.
stopfstedt Jul 18, 2024
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
150 changes: 75 additions & 75 deletions packages/frontend/.lint-todo

Large diffs are not rendered by default.

5 changes: 5 additions & 0 deletions packages/frontend/config/environment.js
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,11 @@ module.exports = function (environment) {
visualNoiseLevel: 1,
},
},
'ember-local-storage': {
jrjohnson marked this conversation as resolved.
Show resolved Hide resolved
namespace: true,
keyDelimiter: '/',
includeEmberDataSupport: false,
},
fontawesome: {
enableExperimentalBuildTimeTransform: false,
defaultPrefix: 'fas',
Expand Down
688 changes: 385 additions & 303 deletions packages/frontend/tests/acceptance/dashboard/calendar-test.js

Large diffs are not rendered by default.

49 changes: 48 additions & 1 deletion packages/frontend/tests/acceptance/dashboard/week-test.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { currentRouteName } from '@ember/test-helpers';
import { currentRouteName, findAll } from '@ember/test-helpers';
import { DateTime } from 'luxon';
import { module, test } from 'qunit';
import { setupAuthentication, freezeDateAt, unfreezeDate } from 'ilios-common';
Expand All @@ -9,9 +9,11 @@ import percySnapshot from '@percy/ember';

module('Acceptance | Dashboard Week at a Glance', function (hooks) {
setupApplicationTest(hooks);

const today = DateTime.fromObject({ hour: 8 });

hooks.beforeEach(async function () {
this.intl = this.owner.lookup('service:intl');
this.school = this.server.create('school');
this.user = await setupAuthentication({ school: this.school });
});
Expand Down Expand Up @@ -133,6 +135,51 @@ module('Acceptance | Dashboard Week at a Glance', function (hooks) {
assert.ok(true, 'no a11y errors found!');
});

test('week summary displays the whole week', async function (assert) {
assert.expect(3);
const startOfTheWeek = DateTime.fromJSDate(
this.owner.lookup('service:locale-days').firstDayOfThisWeek,
).set({ minute: 2 });
const endOfTheWeek = DateTime.fromJSDate(
this.owner.lookup('service:locale-days').lastDayOfThisWeek,
).set({ hour: 22, minute: 5 });

this.server.create('userevent', {
user: this.user.id,
startDate: startOfTheWeek.toJSDate(),
endDate: startOfTheWeek.plus({ hour: 1 }).toJSDate(),
offering: 1,
isPublished: true,
});
this.server.create('userevent', {
user: this.user.id,
startDate: endOfTheWeek.toJSDate(),
endDate: endOfTheWeek.plus({ hour: 1 }).toJSDate(),
offering: 2,
isPublished: true,
});
const dashboard = '.dashboard-week';
const events = `${dashboard} .event`;

await page.visit();

const eventBLocks = findAll(events);
assert.strictEqual(eventBLocks.length, 2);
const options = {
weekday: 'long',
hour: 'numeric',
minute: 'numeric',
};
assert.strictEqual(
page.week.weekGlance.events[0].text,
'event 0 ' + this.intl.formatTime(startOfTheWeek.toJSDate(), options),
);
assert.strictEqual(
page.week.weekGlance.events[1].text,
'event 1 ' + this.intl.formatTime(endOfTheWeek.toJSDate(), options),
);
});

test('calendar is active in dashboard navigation', async function (assert) {
await page.visit();
assert.notOk(page.navigation.calendar.isActive);
Expand Down
2 changes: 0 additions & 2 deletions packages/ilios-common/.lint-todo
Original file line number Diff line number Diff line change
Expand Up @@ -77,8 +77,6 @@ add|ember-template-lint|no-at-ember-render-modifiers|4|2|4|2|23cd787c79c34a628da
add|ember-template-lint|no-at-ember-render-modifiers|4|2|4|2|23cd787c79c34a628dadb6e96dd4004d42eebb79|1720137600000|1722729600000|1725321600000|addon/components/course/visualize-instructors.hbs
add|ember-template-lint|no-at-ember-render-modifiers|4|2|4|2|23cd787c79c34a628dadb6e96dd4004d42eebb79|1720137600000|1722729600000|1725321600000|addon/components/course/visualize-session-type.hbs
add|ember-template-lint|no-at-ember-render-modifiers|4|2|4|2|23cd787c79c34a628dadb6e96dd4004d42eebb79|1720137600000|1722729600000|1725321600000|addon/components/course/visualize-term.hbs
add|ember-template-lint|no-at-ember-render-modifiers|105|6|105|6|1e67fb6d3c62d7707918389c0b1b072c756afbd2|1720137600000|1722729600000|1725321600000|addon/components/dashboard/calendar.hbs
add|ember-template-lint|no-at-ember-render-modifiers|106|6|106|6|448d60c76fbd9ee5aeb7219dde978518fcba1aea|1720137600000|1722729600000|1725321600000|addon/components/dashboard/calendar.hbs
add|ember-template-lint|no-at-ember-render-modifiers|3|2|3|2|9b56ba661238d88b20a82b6f8647d8e16a07b05f|1720137600000|1722729600000|1725321600000|addon/components/dashboard/courses-calendar-filter.hbs
add|ember-template-lint|no-at-ember-render-modifiers|4|2|4|2|23cd787c79c34a628dadb6e96dd4004d42eebb79|1720137600000|1722729600000|1725321600000|addon/components/dashboard/courses-calendar-filter.hbs
add|ember-template-lint|no-at-ember-render-modifiers|5|2|5|2|a90be151f45cd8ab32827e9247a9a9eb7f1baef2|1720137600000|1722729600000|1725321600000|addon/components/dashboard/courses-calendar-filter.hbs
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
import { collection, create, text } from 'ember-cli-page-object';
import c from './filter-checkbox';
import cohortsFilter from './cohort-calendar-filter';
import coursesFilter from './courses-calendar-filter';
import selectedVocabulary from './selected-vocabulary';

const definition = {
scope: '[data-test-dashboard-calendar-filters]',
coursesFilter,
sessionTypesFilter: {
scope: '[data-test-session-type-filter]',
title: text('h5'),
sessionTypes: collection('li', c),
},
vocabularyFilter: {
scope: '[data-test-vocabulary-filter]',
title: text('h5'),
sessionTypes: collection('li', c),
vocabularies: collection('[data-test-dashboard-selected-vocabulary]', selectedVocabulary),
},
courseLevelsFilter: {
scope: '[data-test-course-level-filter]',
title: text('h5'),
courseLevels: collection('li', c),
},
cohortsFilter,
};

export default definition;
export const component = create(definition);
Original file line number Diff line number Diff line change
@@ -1,15 +1,41 @@
import { create } from 'ember-cli-page-object';
import weeklyCalendar from './../weekly-calendar';
import dailyCalendar from './../daily-calendar';
import weekGlance from './../week-glance';
import monthlyCalendar from './../monthly-calendar';
import { collection, create, fillable, property } from 'ember-cli-page-object';
import toggle from '../toggle-buttons';
import userContextFilter from './user-context-filter';
import filters from './calendar-filters';
import filterTags from './filter-tags';
import calendar from './../ilios-calendar';

const definition = {
scope: '[data-test-dashboard-calendar]',
dailyCalendar,
weekGlance,
weeklyCalendar,
monthlyCalendar,
controls: {
scope: '[data-test-dashboard-calendar-controls]',
mySchedule: {
scope: '[data-test-myschedule]',
toggle,
},
showFilters: {
scope: '[data-test-showfilters]',
toggle,
},
showCourseFilters: {
scope: '[data-test-showcoursefilters]',
toggle,
},
userContextFilter,
schoolPicker: {
scope: '[data-test-schoolpicker]',
select: {
scope: '[data-test-select-school]',
set: fillable(),
options: collection('option', {
isSelected: property('selected'),
}),
},
},
filters,
},
filterTags,
calendar,
};

export default definition;
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
import { collection, create } from 'ember-cli-page-object';

const definition = {
scope: '[data-test-dashboard-filter-tags]',
tags: collection('[data-test-filter-tag]'),
clearAll: {
scope: '[data-test-clear-filters]',
},
};

export default definition;
export const component = create(definition);
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
import { attribute, clickable, create, hasClass, property, text } from 'ember-cli-page-object';

const definition = {
scope: '[data-test-dashboard-user-context-filter]',
instructing: {
isChecked: property('checked', '[data-test-instructing-input]'),
label: text('[data-test-instructing-label]'),
toggle: clickable('[data-test-instructing-label]'),
isActive: hasClass('active', '[data-test-instructing-label]'),
ariaDescription: attribute('aria-description', '[data-test-instructing-label]'),
title: attribute('title', '[data-test-instructing-label]'),
},
learning: {
isChecked: property('checked', '[data-test-learning-input]'),
label: text('[data-test-learning-label]'),
toggle: clickable('[data-test-learning-label]'),
isActive: hasClass('active', '[data-test-learning-label]'),
ariaDescription: attribute('aria-description', '[data-test-learning-label]'),
title: attribute('title', '[data-test-learning-label]'),
},
admin: {
isChecked: property('checked', '[data-test-admin-input]'),
label: text('[data-test-admin-label]'),
toggle: clickable('[data-test-admin-label]'),
isActive: hasClass('active', '[data-test-admin-label]'),
ariaDescription: attribute('aria-description', '[data-test-admin-label]'),
title: attribute('title', '[data-test-admin-label]'),
},
};

export default definition;
export const component = create(definition);
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { attribute, create, hasClass, isPresent, text } from 'ember-cli-page-object';
import { attribute, create, hasClass, isPresent, text, triggerable } from 'ember-cli-page-object';

const definition = {
scope: '[data-test-weekly-calendar-event]',
Expand All @@ -15,6 +15,11 @@ const definition = {
isScheduled: isPresent('[data-test-scheduled-icon]'),
isDraft: isPresent('[data-test-draft-icon]'),
wasRecentlyUpdated: isPresent('[data-test-recently-updated-icon]'),
mouseOver: triggerable('mouseover'),
tooltip: {
scope: '[data-test-ilios-calendar-event-tooltip]',
resetScope: true,
},
};

export default definition;
Expand Down
Loading