diff --git a/packages/solid/src/components/notification/notifications-provider.tsx b/packages/solid/src/components/notification/notifications-provider.tsx index 572a918c..7a3043e0 100644 --- a/packages/solid/src/components/notification/notifications-provider.tsx +++ b/packages/solid/src/components/notification/notifications-provider.tsx @@ -89,9 +89,9 @@ export function NotificationsProvider(props: NotificationsProviderProps) { const finalPlacement: Accessor = () => local.placement ?? "top-end"; - const notificationsAccessor = () => notificationQueue().state.current; + const notificationsAccessor = () => notificationQueue().state.current(); - const queueAccessor = () => notificationQueue().state.queue; + const queueAccessor = () => notificationQueue().state.queue(); const showNotification = (notification: ShowNotificationProps) => { const id = notification.id ?? `hope-notification-${createUniqueId()}`; diff --git a/packages/solid/src/hooks/create-queue/create-queue.test.ts b/packages/solid/src/hooks/create-queue/create-queue.test.ts index 63330a41..47e4c688 100644 --- a/packages/solid/src/hooks/create-queue/create-queue.test.ts +++ b/packages/solid/src/hooks/create-queue/create-queue.test.ts @@ -4,15 +4,15 @@ describe("createQueue", () => { it("correctly distributes initial values when limit is not reached", () => { const { state } = createQueue({ initialValues: [1], limit: 2 }); - expect(state.current).toStrictEqual([1]); - expect(state.queue).toStrictEqual([]); + expect(state.current()).toStrictEqual([1]); + expect(state.queue()).toStrictEqual([]); }); it("correctly distributes initial values when limit is reached", () => { const { state } = createQueue({ initialValues: [1, 2, 3, 4, 5], limit: 2 }); - expect(state.current).toStrictEqual([1, 2]); - expect(state.queue).toStrictEqual([3, 4, 5]); + expect(state.current()).toStrictEqual([1, 2]); + expect(state.queue()).toStrictEqual([3, 4, 5]); }); it("adds items to the state when limit is not reached", () => { @@ -20,8 +20,8 @@ describe("createQueue", () => { add(2); - expect(state.current).toStrictEqual([1, 2]); - expect(state.queue).toStrictEqual([]); + expect(state.current()).toStrictEqual([1, 2]); + expect(state.queue()).toStrictEqual([]); }); it("adds items to the queue when limit is reached", () => { @@ -29,8 +29,8 @@ describe("createQueue", () => { add(3, 4, 5); - expect(state.current).toStrictEqual([1, 2]); - expect(state.queue).toStrictEqual([3, 4, 5]); + expect(state.current()).toStrictEqual([1, 2]); + expect(state.queue()).toStrictEqual([3, 4, 5]); }); it("correctly applies given update to state without queue", () => { @@ -38,8 +38,8 @@ describe("createQueue", () => { update(state => state.filter(i => i % 2)); - expect(state.current).toStrictEqual([1]); - expect(state.queue).toStrictEqual([]); + expect(state.current()).toStrictEqual([1]); + expect(state.queue()).toStrictEqual([]); }); it("correctly applies given update to state with queue", () => { @@ -47,8 +47,8 @@ describe("createQueue", () => { update(state => state.filter(i => i % 2)); - expect(state.current).toStrictEqual([1, 3, 5]); - expect(state.queue).toStrictEqual([7]); + expect(state.current()).toStrictEqual([1, 3, 5]); + expect(state.queue()).toStrictEqual([7]); }); it("puts extra items to the queue if state has extra items after update", () => { @@ -56,8 +56,8 @@ describe("createQueue", () => { update(() => [1, 2, 3, 4, 5, 6, 7, 8]); - expect(state.current).toStrictEqual([1, 2, 3]); - expect(state.queue).toStrictEqual([4, 5, 6, 7, 8]); + expect(state.current()).toStrictEqual([1, 2, 3]); + expect(state.queue()).toStrictEqual([4, 5, 6, 7, 8]); }); it("cleans queue with cleanQueue handlers", () => { @@ -65,7 +65,7 @@ describe("createQueue", () => { clearQueue(); - expect(state.current).toStrictEqual([1, 2]); - expect(state.queue).toStrictEqual([]); + expect(state.current()).toStrictEqual([1, 2]); + expect(state.queue()).toStrictEqual([]); }); }); diff --git a/packages/solid/src/hooks/create-queue/index.ts b/packages/solid/src/hooks/create-queue/index.ts index 738bd5d3..34387af3 100644 --- a/packages/solid/src/hooks/create-queue/index.ts +++ b/packages/solid/src/hooks/create-queue/index.ts @@ -1,4 +1,4 @@ -import { createStore } from "solid-js/store"; +import { Accessor, createSignal } from "solid-js"; interface CreateQueueProps { initialValues?: T[]; @@ -6,9 +6,9 @@ interface CreateQueueProps { } interface CreateQueueState { - current: T[]; - queue: T[]; - limit: number; + current: Accessor; + queue: Accessor; + limit: Accessor; } interface CreateQueueReturn { @@ -19,38 +19,40 @@ interface CreateQueueReturn { } export function createQueue(props: CreateQueueProps): CreateQueueReturn { - const [state, setState] = createStore>({ - // eslint-disable-next-line solid/reactivity - current: props.initialValues?.slice(0, props.limit) ?? [], + const [currentState, setCurrentState] = createSignal( + props.initialValues?.slice(0, props.limit) ?? [] + ); - // eslint-disable-next-line solid/reactivity - queue: props.initialValues?.slice(props.limit) ?? [], + const [queue, setQueue] = createSignal(props.initialValues?.slice(props.limit) ?? []); - get limit() { - return props.limit; - }, - }); + const limit = () => props.limit; const add = (...items: T[]) => { - const results = [...state.current, ...state.queue, ...items]; + const results = [...currentState(), ...queue(), ...items]; - setState("current", results.slice(0, state.limit) as T[]); - setState("queue", results.slice(state.limit) as T[]); + setCurrentState(results.slice(0, limit()) as T[]); + setQueue(results.slice(limit()) as T[]); }; const update = (fn: (state: T[]) => T[]) => { - const results = fn([...state.current, ...state.queue] as Array); + const results = fn([...currentState(), ...queue()] as Array); - setState("current", results.slice(0, state.limit)); - setState("queue", results.slice(state.limit)); + setCurrentState(results.slice(0, limit()) as T[]); + setQueue(results.slice(limit()) as T[]); }; const clearQueue = () => { - setState("queue", []); + setQueue([]); + }; + + const state: CreateQueueState = { + current: currentState, + queue, + limit, }; return { - state: state as CreateQueueState, + state, add, update, clearQueue,