@trycourier/react-hooks

• Overview
• Types

Overview

@trycourier/react-hooks exist as a separate package so that you can build your own interface using our api and state management without having to install all the dependencies that @trycourier/react-inbox or other react-dom based packages include.

This also enables using this package with react-native in a much simpler way.

Types

const inbox: IInbox & IInboxActions = useInbox();

interface ITab {
  filters: {
    isRead?: boolean;
  };
  label: string;
  id: string;
}

interface IMessage {
  unread?: number;
  messageId: string;
  created: number;
  title: string;
  body: string;
  blocks?: Array<IActionBlock | ITextBlock>;
  icon?: string;
  read?: boolean;
  data?: {
    clickAction: string;
  };
  trackingIds?: {
    clickTrackingId: string;
    deliveredTrackingId: string;
    readTrackingId: string;
    unreadTrackingId: string;
  };
}

interface IInboxActions {
  init: (inbox: IInbox) => void;
  toggleInbox: (isOpen?: boolean) => void;
  setView: (view: "messages" | "preferences") => void;
  setCurrentTab: (newTab: ITab) => void;
  fetchMessages: (params?: IFetchMessagesParams) => void;
  getMessageCount: (params?: IGetMessagesParams) => void;
  markMessageRead: (messageId: string, trackingId: string) => Promise<void>;
  markMessageUnread: (messageId: string, trackingId: string) => Promise<void>;
  markAllAsRead: () => void;
}

interface IInbox {
  isOpen?: boolean;
  tabs?: ITab[];
  currentTab?: ITab;
  isLoading?: boolean;
  messages?: Array<IMessage>;
  startCursor?: string;
  unreadMessageCount?: number;
  view?: "messages" | "preferences";
}