@unitedstatespowersquadrons/components 1.2.8-pre.1 → 1.2.8

package/Reducer/Example/SubComponent.tsx

@@ -1,9 +1,10 @@
 import React from "react";
-import { useAppDispatch, useAppState } from "./reducer";
+import { useAppCableSubscription, useAppDispatch, useAppState } from "./reducer";
 
 const SubComponent = () => {
   const { something } = useAppState();
   const dispatch = useAppDispatch();
+  const channel = useAppCableSubscription(dispatch, "ExampleChannel");
 
   const handleDoSomething = () => {
     const newSomething = "changed";
@@ -11,10 +12,15 @@ const SubComponent = () => {
     dispatch({ something: newSomething, type: "doSomething" });
   };
 
+  const sendUpstreamMessage = () => {
+    channel.send({ message: "upstream" });
+  };
+
   return(
-    <div onClick={handleDoSomething}>
-      {something}
-    </div>
+    <>
+      <div onClick={handleDoSomething}>{something}</div>
+      <div onClick={sendUpstreamMessage}>Send Upstream</div>
+    </>
   );
 };
 

package/Reducer/Example/reducer.tsx

@@ -1,7 +1,7 @@
 import { Draft } from "immer";
 import * as ReducerHandlers from "./reducerHandlers";
 import { AppState, ServerResponse } from "./types";
-import { buildReducer, RailsAppAction } from "../";
+import { buildReducer, CableAction, RailsAppAction } from "../";
 
 // If you want to add additional data to the server response, use type `RailsAppAction<ServerResponse>`.
 // Otherwise, just use type `RailsAppAction`.
@@ -9,6 +9,7 @@ import { buildReducer, RailsAppAction } from "../";
 // If you need to access the available `type`s for your defined AppAction, use `AppActionType<AppAction>`
 //
 export type AppAction =
+  | CableAction
   | RailsAppAction<ServerResponse>
   | { type: "doSomething"; something: string };
 
@@ -20,10 +21,16 @@ export const reducer = (draft: Draft<AppState>, action: AppAction): void => {
     draft.something = action.something;
 
     break;
+  case "receivedCable": break;
   case "saveComplete": break;
   case "saveFailed": break;
   default: return type satisfies never;
   }
 };
 
-export const { AppProvider, useAppDispatch, useAppState } = buildReducer(reducer, Object.values(ReducerHandlers));
+export const {
+  AppProvider,
+  useAppCableSubscription,
+  useAppDispatch,
+  useAppState,
+} = buildReducer(reducer, Object.values(ReducerHandlers));

package/Reducer/types.ts

@@ -21,10 +21,7 @@ export interface GenericAppAction {
   type: string;
 }
 
-export interface CableAction {
-  data: object;
-  type: "receivedCable";
-}
+export type CableAction = { data: object; type: "receivedCable" };
 
 export type RailsAppAction<R extends RailsResponse = RailsResponse> =
   | { type: "saveComplete"; res: R }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unitedstatespowersquadrons/components",
-  "version": "1.2.8-pre.1",
+  "version": "1.2.8",
   "description": "USPS shared React components library",
   "main": "index.tsx",
   "scripts": {