react-use-zendesk
Version:
React Zendesk Web Widget integration written in typescript
160 lines (155 loc) • 5.94 kB
TypeScript
import React, { PropsWithChildren } from 'react';
type AbstractMessagingEvent = {
createdAt: number;
id: string;
};
type EventMessagingOpenedClosed = AbstractMessagingEvent & {
type: "messagingOpened" | "messagingClosed";
};
type EventMessagingProactiveMessageDisplayed = AbstractMessagingEvent & {
type: "proactiveMessageDisplayed";
payload: {
proactiveMessageId: number;
campaignId: string;
};
};
type EventMessagingProactiveMessageClicked = AbstractMessagingEvent & {
type: "proactiveMessageClicked";
payload: {
proactiveMessageId: number;
campaignId: string;
};
};
type EventMessagingConversationStarted = AbstractMessagingEvent & {
type: "conversationStarted";
payload: {
conversation: {
id: string;
};
};
};
type EventMessagingConversationOpened = AbstractMessagingEvent & {
type: "conversationOpened";
payload: {
conversation: {
id: string | null;
};
};
};
type EventMessagingNewConversationButtonClicked = AbstractMessagingEvent & {
type: "newConversationButtonClicked";
payload: {
newConversationSource: string;
};
};
type EventMessagingConversationWithAgentRequested = AbstractMessagingEvent & {
type: "conversationWithAgentRequested";
payload: {
conversation: {
id: string;
};
};
};
type EventMessagingConversationAgentAssigned = AbstractMessagingEvent & {
type: "conversationAgentAssigned";
payload: {
conversation: {
id: string;
};
};
};
type EventMessagingMessagesShown = AbstractMessagingEvent & {
type: "messagesShown";
payload: {
conversation: {
id: string;
};
messages: Array<{
id: string;
received: string;
role: string;
}>;
};
};
type ZendeskProviderProps = {
apiKey: string;
onOpen?: (event: EventMessagingOpenedClosed) => void;
onClose?: (event: EventMessagingOpenedClosed) => void;
onUnreadMessages?: (count: number) => void;
onResetWidget?: () => void;
onProactiveMessageDisplayed?: (event: EventMessagingProactiveMessageDisplayed) => void;
onProactiveMessageClicked?: (event: EventMessagingProactiveMessageClicked) => void;
onConversationStarted?: (event: EventMessagingConversationStarted) => void;
onConversationOpened?: (event: EventMessagingConversationOpened) => void;
onNewConversationButtonClicked?: (event: EventMessagingNewConversationButtonClicked) => void;
onConversationWithAgentRequested?: (event: EventMessagingConversationWithAgentRequested) => void;
onConversationAgentAssigned?: (event: EventMessagingConversationAgentAssigned) => void;
onMessagesShown?: (event: EventMessagingMessagesShown) => void;
};
type ZendeskConversationField = {
id: string;
value: string | number | boolean;
};
type LoginFailedError = {
message: string;
reason: string;
type: string;
};
type ZendeskCustomizationTheme = {
theme?: {
primary?: string;
onPrimary?: string;
message?: string;
onMessage?: string;
action?: string;
onAction?: string;
businessMessage?: string;
onBusinessMessage?: string;
background?: string;
onBackground?: string;
error?: string;
onError?: string;
notify?: string;
onNotify?: string;
onSecondaryAction?: string;
};
common?: {
hideHeader?: boolean;
contentScale?: number;
};
conversationList?: {
hideNewConversationButton?: boolean;
hideHeader?: boolean;
};
messageLog?: {
hideHeader?: boolean;
};
};
type ZendeskConversationOptions = {
displayName: string;
iconUrl: string;
metadata: object;
};
type ZendeskContextValues = {
show: () => void;
hide: () => void;
open: () => void;
close: () => void;
setLocale: (newLocale: string) => void;
setZIndex: (newZIndex: number) => void;
setCookies: (range: "all" | "functional" | "none") => void;
setConversationFields: (conversationFields: Array<ZendeskConversationField>) => void;
setConversationTags: (conversationTags: Array<string>) => void;
loginUser: (jwtToken: string, loginCallback?: (error: null | LoginFailedError) => void) => void;
logoutUser: () => void;
resetWidget: () => void;
setCustomize: (customization: Partial<ZendeskCustomizationTheme>) => void;
newConversation: (conversationOptions?: Partial<ZendeskConversationOptions>) => void;
useSessionAuth: () => void;
isOpen: boolean;
unreadMessages: number | undefined;
};
type ZendeskMethod = "show" | "hide" | "open" | "close" | "unreadMessages" | "locale" | "zIndex" | "cookies" | "conversationFields" | "conversationTags" | "loginUser" | "logoutUser" | "resetWidget" | "customization" | "useSessionAuth" | "newConversation" | "proactiveMessageDisplayed" | "proactiveMessageClicked" | "conversationStarted" | "conversationOpened" | "newConversationButtonClicked" | "conversationWithAgentRequested" | "conversationAgentAssigned" | "messagesShown";
declare const ZendeskProvider: React.FC<PropsWithChildren<ZendeskProviderProps>>;
declare function useZendesk(): ZendeskContextValues;
export { type EventMessagingConversationAgentAssigned, type EventMessagingConversationOpened, type EventMessagingConversationStarted, type EventMessagingConversationWithAgentRequested, type EventMessagingMessagesShown, type EventMessagingNewConversationButtonClicked, type EventMessagingOpenedClosed, type EventMessagingProactiveMessageClicked, type EventMessagingProactiveMessageDisplayed, type LoginFailedError, type ZendeskContextValues, type ZendeskConversationField, type ZendeskConversationOptions, type ZendeskCustomizationTheme, type ZendeskMethod, ZendeskProvider, type ZendeskProviderProps, useZendesk };