[HELP] How to use "useSingleMotor" for rodux/reducer or store?

[dxgi]

Hello, My goal is to create a singlemotor that can be modified across the user interface. Let's say I have a navbar that swipes to the right to show, Currently it uses "useSingleMotor". My goal is to make that motor public so I can modify it across the user interface. So an example of this usage would be from another "page" a button is clicked and it's function is to set the offset to a new value so the swipeToShow navbar animates like hides.

// state-actions.ts
import Roact from "@rbxts/roact";
import { Spring, Instant, Linear, SingleMotor } from "@rbxts/roact-hooked-plus";

export function setSwipeToShowOffset(offset: LuaTuple<[Roact.Binding<number>, (goal: Spring | Instant | Linear) => void, SingleMotor]>) {
    return { type: "SET_SWIPE_TO_SHOW_OFFSET", offset } as const;
}

export type StateAction = ReturnType<typeof setSwipeToShowOffset>;

// state-reducer.ts
import { createReducer } from "@rbxts/rodux";
import { StateAction } from "./state-actions";
import Roact from "@rbxts/roact";
import { Spring, Instant, Linear, SingleMotor, useSingleMotor } from "@rbxts/roact-hooked-plus";

export interface State {
    SwipeToShow: {
        offset: LuaTuple<[Roact.Binding<number>, (goal: Spring | Instant | Linear) => void, SingleMotor]>
    }
}

export const stateReducer = createReducer<State, StateAction>(
    { SwipeToShow: { offset: useSingleMotor(0) } },
    {
        SET_SWIPE_TO_SHOW_OFFSET: (state, action) => ({ SwipeToShow: { offset: action.offset } }),
    }
);

// state-selectors.ts
import { RootState } from "rodux/root-reducer";

export const getSwipeToShowOffset = (state: RootState) => state.state.SwipeToShow.offset;

I know my code is wrong but how would I achieve such goal? A singlemotor used to animated a navbar, and is public around the user interface to be modified so the navbar still animates.