cronofy-elements - npm Package Compare versions

Comparing version 1.42.1 to 1.43.0

package.json

 {
     "name": "cronofy-elements",
-    "version": "1.42.1",
+    "version": "1.43.0",
     "description": "Fast track scheduling with Cronofy's embeddable UI Elements",
@@ -5,0 +5,0 @@ "main": "build/npm/CronofyElements.js",

src/js/components/DateTimePicker/contexts/status-reducer.js

@@ -9,2 +9,3 @@ import moment from "moment-timezone";
     removeMonthFromLoading,
+    addSequencedSlotsToObject,
 } from "../utils/slots";
@@ -47,2 +48,3 @@ import { getMonthsInDisplay, parseTimeSlots } from "../utils/calendar";
                     message: "There was an error getting the slots",
+                    body: action.error.body,
                 },
@@ -104,14 +106,19 @@ };
 
-            const slotsObject = addSlotsToObject(state.slots, action.slots);
-            const availableDays = getAvailableDays(addSlotsToObject({}, action.slots), action.tzid);
-            const availableDaysSet = new Set([...state.availableDays, ...availableDays]);
+            const slotsObject = state.sequenced_availability
+                ? addSequencedSlotsToObject(state.slots, action.slots)
+                : addSlotsToObject(state.slots, action.slots);
+            const availableDays = getAvailableDays(slotsObject, action.tzid);
             const monthsLoading = removeMonthFromLoading(state.monthsLoading, action.month);
 
+            const injectionPoint = state.sequenced_availability
+                ? getLocalDayFromUtc(action.slots[0].sequence[0].start, action.tzid)
+                : getLocalDayFromUtc(action.slots[0].start, action.tzid);
+
             return {
                 ...state,
-                availableDays: [...availableDaysSet].sort(),
+                availableDays,
                 monthsLoading,
                 slots: slotsObject,
                 slotFetchCount: state.slotFetchCount + 1,
-                slotInjectionPoint: getLocalDayFromUtc(action.slots[0].start, action.tzid),
+                slotInjectionPoint: injectionPoint,
             };
@@ -129,3 +136,7 @@ }
             const daySlots = getSlotsByDay(state.slots, action.day, action.tzid);
-            const focusedSlot = daySlots[0];
+            const focusedSlot = state.sequenced_availability
+                ? daySlots[0]?.reduce((prev, current) => {
+                      return prev.start < current.start ? prev.start : current.start;
+                  })
+                : daySlots[0]?.start;
 
@@ -136,3 +147,3 @@ return {
                 focusedDay: action.day,
-                focusedSlot: focusedSlot?.start,
+                focusedSlot: focusedSlot,
                 columnView: "slots",
@@ -139,0 +150,0 @@ daySlots,

src/js/components/DateTimePicker/DateTimePicker.js

@@ -9,2 +9,3 @@ import React, { useMemo } from "react";
     getMonthsLoadingFromQuery,
+    getDurationFromQuery,
 } from "./utils/slots";
@@ -34,2 +35,4 @@ import { getMonthsInDisplay, parseTimeSlots } from "./utils/calendar";
 
+        const duration = getDurationFromQuery(options.query);
+
         const endDateObject = moment(options.config.endDate, "YYYY-MM-DD");
@@ -66,2 +69,3 @@ const startDateObject = moment(options.config.startDate, "YYYY-MM-DD");
             daySlots: [],
+            duration,
             locale: options.locale,
@@ -81,2 +85,3 @@ mode: options.config.mode, // confirm (default) | no_confirm
             availableDays: [],
+            sequenced_availability: options.query.sequence ? true : false,
             slots: {},
@@ -83,0 +88,0 @@ slotFetchCount: 0,

src/js/components/DateTimePicker/Details.js

@@ -20,5 +20,7 @@ import React, { memo } from "react";
             <div className={theme.classBuilder("details--duration")}>
-                <p>
-                    <strong>{i18n.t("duration_label")}:</strong> {duration} {i18n.t("minutes")}
-                </p>
+                {duration && (
+                    <p>
+                        <strong>{i18n.t("duration_label")}:</strong> {duration} {i18n.t("minutes")}
+                    </p>
+                )}
             </div>
@@ -25,0 +27,0 @@ </div>

src/js/components/DateTimePicker/SlotsList.js

 import React from "react";
 
 import SlotButton from "./SlotButton";
+import SequencedSlotButton from "./SequencedSlotButton";
 
@@ -17,3 +18,7 @@ import { useI18n } from "../../contexts/i18n-context";
             <li key={key} className={theme.classBuilder("slot-list--item")}>
-                <SlotButton slot={slot} />
+                {status.sequenced_availability ? (
+                    <SequencedSlotButton slot={slot} />
+                ) : (
+                    <SlotButton slot={slot} />
+                )}
             </li>
@@ -20,0 +25,0 @@ );

src/js/components/DateTimePicker/utils/slots.js

 import moment from "moment-timezone";
 
-import { getAvailability } from "../../../helpers/connections";
+import { getAvailability, getSequencedAvailability } from "../../../helpers/connections";
 import { uniqueItems, humanizeTzName } from "../../../helpers/utils";
@@ -36,2 +36,8 @@ import { errorMessages } from "../../../helpers/logging";
 
+export const getDurationFromQuery = query => {
+    const duration = query.sequence ? false : query.required_duration.minutes;
+
+    return duration;
+};
+
 export const getMonthsLoadingFromQuery = (query, tzid) => {
@@ -108,3 +114,3 @@ if (!query.query_periods || !query.query_periods.length) {
     ).then(res => {
-        if (res.errors) {
+        if (res.status === 422) {
             throw {
@@ -147,2 +153,49 @@ type: 422,
 
+export const getSequencedSlots = ({ query, auth, tzid, slots = [] }) =>
+    getSequencedAvailability(
+        auth.token,
+        auth.domains.apiDomain,
+        query,
+        "DateTimePicker",
+        tzid,
+        auth.demo
+    ).then(res => {
+        if (res.errors) {
+            throw {
+                type: 422,
+                message: errorMessages[422].message,
+                body: res.errors,
+                docsSlug: errorMessages[422].docsSlug,
+            };
+        }
+        // This will intentionally throw an error if the
+        // result is not in the correct format:
+        const returnedSlots = parseSlotsResult(res);
+
+        const allSlots = [...slots, ...returnedSlots];
+
+        if (returnedSlots.length < 512) return [...slots, ...returnedSlots];
+
+        // If we get here, the API has returned the maximum number
+        // of slots allowed, so we need to crop the query and try
+        // again to ensure we haven't missed any slots.
+
+        const startOfLastSlot = returnedSlots[returnedSlots.length - 1].start;
+        const endOfLastPeriod = query.query_periods[query.query_periods.length - 1].end;
+        const boundsForCropping = {
+            start: startOfLastSlot,
+            end: endOfLastPeriod,
+        };
+        const croppedPeriods = cropPeriodsArbitrarily(query.query_periods, boundsForCropping);
+        const croppedQuery = { ...query, query_periods: croppedPeriods };
+
+        // Rerun the query
+        return getSequencedSlots({
+            query: croppedQuery,
+            auth,
+            tzid,
+            slots: allSlots,
+        });
+    });
+
 export const parseQuery = query => {
@@ -162,2 +215,4 @@ if (!query.bookable_events) {
         returnedSlots = res.available_bookable_events;
+    } else if (typeof res.sequences !== "undefined") {
+        returnedSlots = res.sequences;
     } else {
@@ -216,2 +271,13 @@ returnedSlots = res.available_slots;
 
+export const addSequencedSlotsToObject = (slotsObject, newSlotsArray) => {
+    newSlotsArray.forEach(slot => {
+        const startArray = slot.sequence.map(a => a.start);
+        const start = startArray.reduce((prev, current) => {
+            return prev < current ? prev : current;
+        });
+        slotsObject[start] = slot.sequence;
+    });
+    return slotsObject;
+};
+
 export const getSlotsByDay = (slots, day, tzid) => {
@@ -218,0 +284,0 @@ const slotKeys = Object.keys(slots);

src/js/components/DateTimePicker/Wrapper.js

 import React, { useEffect, useRef, useState } from "react";
 import moment from "moment";
 
-import { getSlots } from "./utils/slots";
+import { getSequencedSlots, getSlots } from "./utils/slots";
 
@@ -34,22 +34,16 @@ import Calendar from "./Calendar";
         const fetchMonthSlots = (query, month) => {
-            return getSlots({
+            const fetch = status.sequenced_availability ? getSequencedSlots : getSlots;
+
+            return fetch({
                 query,
                 auth: status.auth,
                 tzid: status.tzid,
-            })
-                .then(res => {
-                    dispatchStatus({
-                        type: "SET_SLOTS",
-                        slots: res,
-                        tzid: tz.selectedTzid.tzid,
-                        month: month,
-                    });
-                })
-                .catch(res => {
-                    dispatchStatus({
-                        type: "ERROR_LOADING_SLOTS",
-                        error: res,
-                        month: month,
-                    });
+            }).then(res => {
+                dispatchStatus({
+                    type: "SET_SLOTS",
+                    slots: res,
+                    tzid: tz.selectedTzid.tzid,
+                    month: month,
                 });
+            });
         };
@@ -64,3 +58,11 @@
                 const remainingMonths = status.months.filter(month => !month.current);
-                remainingMonths.forEach(month => fetchMonthSlots(month.query, month.month));
+                remainingMonths.forEach(month =>
+                    fetchMonthSlots(month.query, month.month).catch(res => {
+                        dispatchStatus({
+                            type: "ERROR_LOADING_SLOTS",
+                            error: res,
+                            month: month.month,
+                        });
+                    })
+                );
             })
@@ -177,3 +179,3 @@ .catch(error => {
         <section className={theme.classBuilder()} style={theme.customProperties}>
-            <Details duration={status.query.required_duration.minutes} locale={status.locale} />
+            <Details duration={status.duration} locale={status.locale} />
             <div className={theme.classBuilder("wrapper")}>
@@ -180,0 +182,0 @@ <div

src/js/helpers/connections.js

@@ -271,2 +271,40 @@ import * as mocks from "./mocks";
 
+export const getSequencedAvailability = (
+    token,
+    api_domain,
+    params = {},
+    element = "sequenced-availability",
+    tzid = "Etc/UTC",
+    mock = false
+) => {
+    if (
+        (mock && params.response_format === "slots") ||
+        (mock && typeof params.start_interval === "undefined")
+    ) {
+        return mocks.availabilitySlots;
+    }
+    if (mock && params.response_format === "overlapping_slots") {
+        return mocks.availabilityOverlappingSlots(
+            params.start_interval.minutes,
+            params.required_duration.minutes,
+            params.query_periods,
+            tzid
+        );
+    }
+    if (mock) return mocks.availability;
+
+    return fetch(`${api_domain}/v1/sequenced_availability?et=${token}`, {
+        method: "POST",
+        headers: {
+            "Cronofy-Element": `v${packageDetails.version}, ${element}`,
+            "Content-Type": "application/json; charset=utf-8",
+        },
+        body: JSON.stringify(params),
+    })
+        .then(handleInvalidResponses)
+        .then(res => res.json())
+        .then(handle422Responses)
+        .catch(catchAndRethrowErrors);
+};
+
 export const getAvailabilityRules = ({
@@ -273,0 +311,0 @@ token,

src/js/helpers/init.DateTimePicker.js

@@ -75,2 +75,3 @@ import moment from "moment-timezone";
     const isBookableEventsQuery = options.availability_query.bookable_events ? true : false;
+    const isSequencedAvailabilityQuery = options.availability_query.sequence ? true : false;
 
@@ -83,2 +84,5 @@ let query;
         query = parseWithOverlappingSlots(query);
+    } else if (isSequencedAvailabilityQuery) {
+        query = options.availability_query;
+        query = parseWithOverlappingSlots(query);
     } else {
@@ -85,0 +89,0 @@ query = parseQuery({ options, elementSlug: "date-time-picker", log });

tests/DateTimePicker/contexts/status-reducer.test.js

@@ -9,3 +9,6 @@ import { statusReducer } from "../../../src/js/components/DateTimePicker/contexts/status-reducer";
     testSlotsArrayAdditional,
+    testSequencedSlotsArray,
     testDaySlots,
+    testDaySequencedSlots,
+    testSequencedSlotsAObject,
     testQuery,
@@ -446,2 +449,61 @@ } from "../dummy-data";
         });
+
+        it("sets sequenced slots", () => {
+            const oldState = {
+                ...startingState,
+                slots: {},
+                availableDays: [],
+                slotFetchCount: 0,
+                slotInjectionPoint: undefined,
+                sequenced_availability: true,
+            };
+
+            const result = statusReducer(oldState, {
+                type: "SET_SLOTS",
+                slots: testSequencedSlotsArray,
+                month: "2021-09",
+                tzid: "Europe/London",
+            });
+
+            const newMonthsLoading = [
+                {
+                    month: "2021-09",
+                    loading: false,
+                },
+                {
+                    month: "2021-10",
+                    loading: true,
+                },
+            ];
+
+            delete oldState.slots;
+            delete oldState.availableDays;
+            delete oldState.slotFetchCount;
+            delete oldState.slotInjectionPoint;
+            delete oldState.monthsLoading;
+
+            const {
+                slots,
+                availableDays,
+                slotFetchCount,
+                slotInjectionPoint,
+                monthsLoading,
+                ...newState
+            } = result;
+
+            // These values have been updated
+            expect(slots).toStrictEqual(testSequencedSlotsAObject);
+            expect(availableDays).toStrictEqual([
+                "2021-09-29",
+                "2021-09-30",
+                "2021-10-01",
+                "2021-10-04",
+            ]);
+            expect(slotFetchCount).toBe(1);
+            expect(slotInjectionPoint).toBe("2021-09-29");
+            expect(monthsLoading).toStrictEqual(newMonthsLoading);
+
+            // All other values are unchanged
+            expect(newState).toStrictEqual(oldState);
+        });
     });
@@ -467,54 +529,100 @@
 
-    it("SELECT_DAY", async () => {
-        const oldState = { ...startingState };
-        const date = "2021-10-04";
-        const result = statusReducer(oldState, {
-            type: "SELECT_DAY",
-            day: date,
+    describe("SELECT_DAY", () => {
+        it("SELECT_DAY", async () => {
+            const oldState = { ...startingState };
+            const date = "2021-10-04";
+            const result = statusReducer(oldState, {
+                type: "SELECT_DAY",
+                day: date,
+            });
+
+            const expectedDaySlots = [
+                {
+                    start: "2021-10-04T09:00:00Z",
+                    end: "2021-10-04T10:00:00Z",
+                    participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+                },
+                {
+                    start: "2021-10-04T10:00:00Z",
+                    end: "2021-10-01T11:00:00Z",
+                    participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+                },
+                {
+                    start: "2021-10-04T11:00:00Z",
+                    end: "2021-10-04T12:00:00Z",
+                    participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+                },
+                {
+                    start: "2021-10-04T15:00:00Z",
+                    end: "2021-10-04T16:00:00Z",
+                    participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+                },
+                {
+                    start: "2021-10-04T17:00:00Z",
+                    end: "2021-10-04T18:00:00Z",
+                    participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+                },
+            ];
+
+            delete oldState.selectedDay;
+            delete oldState.focusedDay;
+            delete oldState.focusedSlot;
+            delete oldState.columnView;
+            delete oldState.daySlots;
+
+            const {
+                selectedDay,
+                focusedDay,
+                focusedSlot,
+                columnView,
+                daySlots,
+                ...newState
+            } = result;
+
+            // These values have been updated
+            expect(selectedDay).toBe(date);
+            expect(focusedDay).toBe(date);
+            expect(focusedSlot).toBe("2021-10-04T09:00:00Z");
+            expect(daySlots).toStrictEqual(expectedDaySlots);
+            expect(columnView).toBe("slots");
+            // All other values are unchanged
+            expect(newState).toStrictEqual(oldState);
         });
 
-        const expectedDaySlots = [
-            {
-                start: "2021-10-04T09:00:00Z",
-                end: "2021-10-04T10:00:00Z",
-                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
-            },
-            {
-                start: "2021-10-04T10:00:00Z",
-                end: "2021-10-01T11:00:00Z",
-                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
-            },
-            {
-                start: "2021-10-04T11:00:00Z",
-                end: "2021-10-04T12:00:00Z",
-                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
-            },
-            {
-                start: "2021-10-04T15:00:00Z",
-                end: "2021-10-04T16:00:00Z",
-                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
-            },
-            {
-                start: "2021-10-04T17:00:00Z",
-                end: "2021-10-04T18:00:00Z",
-                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
-            },
-        ];
+        it("SELECT_DAY for sequenced slots", async () => {
+            const oldState = {
+                ...startingState,
+                slots: testSequencedSlotsAObject,
+                sequenced_availability: true,
+            };
+            const date = "2021-09-29";
+            const result = statusReducer(oldState, {
+                type: "SELECT_DAY",
+                day: date,
+            });
 
-        delete oldState.selectedDay;
-        delete oldState.focusedDay;
-        delete oldState.focusedSlot;
-        delete oldState.columnView;
-        delete oldState.daySlots;
+            delete oldState.selectedDay;
+            delete oldState.focusedDay;
+            delete oldState.focusedSlot;
+            delete oldState.columnView;
+            delete oldState.daySlots;
 
-        const { selectedDay, focusedDay, focusedSlot, columnView, daySlots, ...newState } = result;
+            const {
+                selectedDay,
+                focusedDay,
+                focusedSlot,
+                columnView,
+                daySlots,
+                ...newState
+            } = result;
 
-        // These values have been updated
-        expect(selectedDay).toBe(date);
-        expect(focusedDay).toBe(date);
-        expect(focusedSlot).toBe("2021-10-04T09:00:00Z");
-        expect(daySlots).toStrictEqual(expectedDaySlots);
-        expect(columnView).toBe("slots");
-        // All other values are unchanged
-        expect(newState).toStrictEqual(oldState);
+            // These values have been updated
+            expect(selectedDay).toBe(date);
+            expect(focusedDay).toBe(date);
+            expect(focusedSlot).toBe("2021-09-29T08:00:00Z");
+            expect(daySlots).toStrictEqual(testDaySequencedSlots);
+            expect(columnView).toBe("slots");
+            // All other values are unchanged
+            expect(newState).toStrictEqual(oldState);
+        });
     });
@@ -666,26 +774,68 @@
     });
-    it("SELECT_SLOT", async () => {
-        const oldState = { ...startingState };
-        const slot = {
-            start: "2021-09-30T14:00:00Z",
-            end: "2021-09-30T15:00:00Z",
-            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
-        };
-        const result = statusReducer(oldState, {
-            type: "SELECT_SLOT",
-            slot: slot,
+
+    describe("SELECT_SLOT", () => {
+        it("SELECT_SLOT", async () => {
+            const oldState = { ...startingState };
+            const slot = {
+                start: "2021-09-30T14:00:00Z",
+                end: "2021-09-30T15:00:00Z",
+                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+            };
+            const result = statusReducer(oldState, {
+                type: "SELECT_SLOT",
+                slot: slot,
+            });
+
+            delete oldState.selected;
+            delete oldState.focusedSlot;
+            delete oldState.columnView;
+
+            const { selected, focusedSlot, columnView, ...newState } = result;
+
+            // These values have been updated
+            expect(selected).toStrictEqual(slot);
+            expect(focusedSlot).toBe("2021-09-30T14:00:00Z");
+            expect(columnView).toBe("confirm");
+            // All other values are unchanged
+            expect(newState).toStrictEqual(oldState);
         });
 
-        delete oldState.selected;
-        delete oldState.focusedSlot;
-        delete oldState.columnView;
+        it("SELECT_SLOT for sequenced availability", async () => {
+            const oldState = { ...startingState };
+            const slot = {
+                start: "2021-09-29T10:00:00Z",
+                end: "2021-09-29T11:30:00Z",
+                sequence: [
+                    {
+                        sequence_id: "test-one",
+                        start: "2021-09-29T10:00:00Z",
+                        end: "2021-09-29T11:00:00Z",
+                        participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+                    },
+                    {
+                        sequence_id: "test-two",
+                        start: "2021-09-29T11:00:00Z",
+                        end: "2021-09-29T11:30:00Z",
+                        participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+                    },
+                ],
+            };
+            const result = statusReducer(oldState, {
+                type: "SELECT_SLOT",
+                slot: slot,
+            });
 
-        const { selected, focusedSlot, columnView, ...newState } = result;
+            delete oldState.selected;
+            delete oldState.focusedSlot;
+            delete oldState.columnView;
 
-        // These values have been updated
-        expect(selected).toStrictEqual(slot);
-        expect(focusedSlot).toBe("2021-09-30T14:00:00Z");
-        expect(columnView).toBe("confirm");
-        // All other values are unchanged
-        expect(newState).toStrictEqual(oldState);
+            const { selected, focusedSlot, columnView, ...newState } = result;
+
+            // These values have been updated
+            expect(selected).toStrictEqual(slot);
+            expect(focusedSlot).toBe("2021-09-29T10:00:00Z");
+            expect(columnView).toBe("confirm");
+            // All other values are unchanged
+            expect(newState).toStrictEqual(oldState);
+        });
     });
@@ -692,0 +842,0 @@

tests/DateTimePicker/dummy-data.js

@@ -269,2 +269,133 @@ export const rawSlots = {
 
+export const testSequencedSlotsArray = [
+    {
+        sequence: [
+            {
+                sequence_id: "test-one",
+                start: "2021-09-29T08:00:00Z",
+                end: "2021-09-29T09:00:00Z",
+                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+            },
+            {
+                sequence_id: "test-two",
+                start: "2021-09-29T09:00:00Z",
+                end: "2021-09-29T09:30:00Z",
+                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+            },
+        ],
+    },
+    {
+        sequence: [
+            {
+                sequence_id: "test-one",
+                start: "2021-09-29T10:00:00Z",
+                end: "2021-09-29T11:00:00Z",
+                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+            },
+            {
+                sequence_id: "test-two",
+                start: "2021-09-29T11:00:00Z",
+                end: "2021-09-29T11:30:00Z",
+                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+            },
+        ],
+    },
+    {
+        sequence: [
+            {
+                sequence_id: "test-one",
+                start: "2021-09-30T08:00:00Z",
+                end: "2021-09-30T09:00:00Z",
+                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+            },
+            {
+                sequence_id: "test-two",
+                start: "2021-09-30T09:00:00Z",
+                end: "2021-09-30T09:30:00Z",
+                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+            },
+        ],
+    },
+    {
+        sequence: [
+            {
+                sequence_id: "test-one",
+                start: "2021-09-30T10:00:00Z",
+                end: "2021-09-30T11:00:00Z",
+                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+            },
+            {
+                sequence_id: "test-two",
+                start: "2021-09-30T11:00:00Z",
+                end: "2021-09-30T11:30:00Z",
+                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+            },
+        ],
+    },
+    {
+        sequence: [
+            {
+                sequence_id: "test-one",
+                start: "2021-09-30T11:30:00Z",
+                end: "2021-09-30T12:30:00Z",
+                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+            },
+            {
+                sequence_id: "test-two",
+                start: "2021-09-30T12:30:00Z",
+                end: "2021-09-30T13:00:00Z",
+                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+            },
+        ],
+    },
+    {
+        sequence: [
+            {
+                sequence_id: "test-one",
+                start: "2021-10-01T08:00:00Z",
+                end: "2021-10-01T09:00:00Z",
+                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+            },
+            {
+                sequence_id: "test-two",
+                start: "2021-10-01T09:00:00Z",
+                end: "2021-10-01T09:30:00Z",
+                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+            },
+        ],
+    },
+    {
+        sequence: [
+            {
+                sequence_id: "test-one",
+                start: "2021-10-04T08:00:00Z",
+                end: "2021-10-04T09:00:00Z",
+                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+            },
+            {
+                sequence_id: "test-two",
+                start: "2021-10-04T09:00:00Z",
+                end: "2021-10-04T09:30:00Z",
+                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+            },
+        ],
+    },
+    {
+        sequence: [
+            {
+                sequence_id: "test-one",
+                start: "2021-10-04T10:00:00Z",
+                end: "2021-10-04T11:00:00Z",
+                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+            },
+            {
+                sequence_id: "test-two",
+                start: "2021-10-04T11:00:00Z",
+                end: "2021-10-04T11:30:00Z",
+                participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+            },
+        ],
+    },
+];
+
 export const testSlotsObject = {
@@ -406,2 +537,117 @@ "2021-09-29T08:00:00Z": {
 
+export const testSequencedSlotsAObject = {
+    "2021-09-29T08:00:00Z": [
+        {
+            sequence_id: "test-one",
+            start: "2021-09-29T08:00:00Z",
+            end: "2021-09-29T09:00:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+        {
+            sequence_id: "test-two",
+            start: "2021-09-29T09:00:00Z",
+            end: "2021-09-29T09:30:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+    ],
+    "2021-09-29T10:00:00Z": [
+        {
+            sequence_id: "test-one",
+            start: "2021-09-29T10:00:00Z",
+            end: "2021-09-29T11:00:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+        {
+            sequence_id: "test-two",
+            start: "2021-09-29T11:00:00Z",
+            end: "2021-09-29T11:30:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+    ],
+    "2021-09-30T08:00:00Z": [
+        {
+            sequence_id: "test-one",
+            start: "2021-09-30T08:00:00Z",
+            end: "2021-09-30T09:00:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+        {
+            sequence_id: "test-two",
+            start: "2021-09-30T09:00:00Z",
+            end: "2021-09-30T09:30:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+    ],
+    "2021-09-30T10:00:00Z": [
+        {
+            sequence_id: "test-one",
+            start: "2021-09-30T10:00:00Z",
+            end: "2021-09-30T11:00:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+        {
+            sequence_id: "test-two",
+            start: "2021-09-30T11:00:00Z",
+            end: "2021-09-30T11:30:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+    ],
+    "2021-09-30T11:30:00Z": [
+        {
+            sequence_id: "test-one",
+            start: "2021-09-30T11:30:00Z",
+            end: "2021-09-30T12:30:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+        {
+            sequence_id: "test-two",
+            start: "2021-09-30T12:30:00Z",
+            end: "2021-09-30T13:00:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+    ],
+    "2021-10-01T08:00:00Z": [
+        {
+            sequence_id: "test-one",
+            start: "2021-10-01T08:00:00Z",
+            end: "2021-10-01T09:00:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+        {
+            sequence_id: "test-two",
+            start: "2021-10-01T09:00:00Z",
+            end: "2021-10-01T09:30:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+    ],
+    "2021-10-04T08:00:00Z": [
+        {
+            sequence_id: "test-one",
+            start: "2021-10-04T08:00:00Z",
+            end: "2021-10-04T09:00:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+        {
+            sequence_id: "test-two",
+            start: "2021-10-04T09:00:00Z",
+            end: "2021-10-04T09:30:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+    ],
+    "2021-10-04T10:00:00Z": [
+        {
+            sequence_id: "test-one",
+            start: "2021-10-04T10:00:00Z",
+            end: "2021-10-04T11:00:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+        {
+            sequence_id: "test-two",
+            start: "2021-10-04T11:00:00Z",
+            end: "2021-10-04T11:30:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+    ],
+};
+
 export const testDaySlots = [
@@ -424,1 +670,32 @@ {
 ];
+
+export const testDaySequencedSlots = [
+    [
+        {
+            sequence_id: "test-one",
+            start: "2021-09-29T08:00:00Z",
+            end: "2021-09-29T09:00:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+        {
+            sequence_id: "test-two",
+            start: "2021-09-29T09:00:00Z",
+            end: "2021-09-29T09:30:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+    ],
+    [
+        {
+            sequence_id: "test-one",
+            start: "2021-09-29T10:00:00Z",
+            end: "2021-09-29T11:00:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+        {
+            sequence_id: "test-two",
+            start: "2021-09-29T11:00:00Z",
+            end: "2021-09-29T11:30:00Z",
+            participants: [{ sub: "acc_5f35432b3f07d06753082354" }],
+        },
+    ],
+];

tests/DateTimePicker/utils.test.js

 import * as utils from "../../src/js/components/DateTimePicker/utils/slots";
-import { rawSlots } from "./dummy-data";
+import { rawSlots, testSequencedSlotsAObject, testSequencedSlotsArray } from "./dummy-data";
 import moment from "moment-timezone";
@@ -139,2 +139,8 @@
 
+    it("adds sequenced slots to object", () => {
+        const exampleSlots = [...testSequencedSlotsArray];
+        const slotsObject = utils.addSequencedSlotsToObject({}, exampleSlots);
+        expect(slotsObject).toStrictEqual(testSequencedSlotsAObject);
+    });
+
     describe("Parses the timezone list correctly", () => {
@@ -141,0 +147,0 @@ it("gets timezone list", () => {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

3277064

increased by1.07%

Number of package files

340

increased by0.59%

Lines of code

27203

increased by2.63%

Worsened metrics

Number of medium supply chain risk alerts

61

increased by7.02%

No dependency changes