@socialgest/rn-widget 0.0.1

package/src/models/app.models.ts

@@ -0,0 +1,120 @@
+export interface Bot {
+  name: string;
+  photo: string;
+}
+
+export interface InitProperties {
+  primaryColor: string;
+  primaryTextColor: string;
+  photoHeight: number;
+  buttonWidthAndHeight: number;
+  mainTittle: string;
+  mainDescription: string;
+  mainPhoto: string;
+  Xposition: number;
+  yposition: number;
+  buttonIconColor: string;
+  buttonImageWidthAndHeight: string | number;
+  textColor: string;
+  avgTime: number;
+  chatFirstMessage: string | null;
+  lastUrl: string;
+  showQuitButton: boolean;
+  whiteMark: boolean;
+  noMessagesIcon: boolean;
+  defaultIcon: boolean | null;
+  buttonIcon: null | string;
+  showOperatorsInfo: null | boolean;
+  showOperatorName: null | boolean;
+  url_helpcenter: string;
+}
+
+export interface Labels {
+  conversations_label: string;
+  label_time: string;
+  time_answer: string;
+  see_all_link: string;
+  new_chat_button: string;
+  main_init_chat_label: string;
+  footer_label: string;
+  chat_placeholder: string;
+  form_policy_label: string;
+  form_policy_link: string;
+  form_policy_button: string;
+  close_tittle: string;
+  close_tittle_bold: string;
+  close_paragraph_1: string;
+  close_paragraph_2: string;
+  close_paragraph_3: string;
+  close_paragraph_link: string;
+  no_form_sent_message: string;
+  option: string;
+  help_center_label: string;
+  help_center_search: string;
+  other_channels: string;
+  time_ago: string;
+  minute: string;
+  minutes: string;
+  ago: string;
+  hours: string;
+  hour: string;
+  days: string;
+  day: string;
+  not_articles: string;
+  reconnect: string;
+  not_conection: string;
+  operador: string;
+  see_more: string;
+  not_results_for: string;
+  not_results: string;
+  click_chat: string;
+  attached_file: string;
+  retry_message: string;
+  cancel: string;
+  error_send_message: string;
+  operator: string;
+}
+
+export interface FormChatField {
+  required: boolean;
+}
+
+export interface FormChat {
+  fields: FormChatField[];
+  formMessage: null | string;
+  urlPrivacyPolicy: any;
+  sent: null | boolean;
+}
+
+export interface User {
+  sent: boolean;
+  chatFirstMessage: string;
+  user: any | object;
+}
+export interface MessageFloat {
+  messages: any;
+  tikketId: string;
+  since: null | string;
+}
+
+export interface AppState {
+  bot: Bot;
+  bots: any[];
+  loading_msj_bot: boolean;
+  token: string;
+  channelId: string;
+  feedBack: any;
+  channels_button: any[];
+  initProperties: InitProperties;
+  quick_replies: boolean | any;
+  FormChat: FormChat;
+  errors: any[];
+  socket: string;
+  category: any[];
+  user_init: any | null;
+  user: any | null | User;
+  labels: Labels;
+  openWindow: null | boolean;
+  openMessageFloat: null | boolean;
+  messageFloat: null | MessageFloat;
+}

package/src/models/articles.models.ts

@@ -0,0 +1,3 @@
+export interface ArticlesState {
+  articles: any[];
+}

package/src/models/chat.models.ts

@@ -0,0 +1,11 @@
+export interface ChatState {
+  tikketId: string | null;
+  typingUser: string | null;
+  typing: boolean;
+  operator: any;
+  detail: any[];
+  typeHeader: string;
+  closed: boolean;
+  textBoxMessage: string;
+  feedBack: boolean;
+}

package/src/models/chatBoard.models.ts

@@ -0,0 +1,8 @@
+export interface ChatBoardState {
+  loading: boolean;
+  showBoard: boolean;
+  boardView: string;
+  bigHeader: boolean;
+  lastView: string;
+  defaultTikketLoaded: boolean;
+}

package/src/models/chatHistory.models.ts

@@ -0,0 +1,22 @@
+export interface LastMessage {
+  date: any;
+  msj: string;
+  name: string;
+  read: boolean;
+  typePerson: string;
+  closed?: boolean;
+}
+
+export interface Preview {
+  tikketId: string;
+  lastMessage: LastMessage;
+  operator: any;
+}
+
+export interface State {
+  previews: Preview[] | any;
+  history: any[];
+  tikkets: any[];
+  counter: number;
+  notify: boolean;
+}

package/src/models/operators.models.ts

@@ -0,0 +1,11 @@
+export interface Operator {
+  userId: string;
+  imgURL: string;
+  name: string;
+  active?: boolean;
+}
+
+export interface OperatorsState {
+  operators: Operator[];
+  randonOperators: Operator[];
+}

package/src/models/storage.models.ts

@@ -0,0 +1,15 @@
+import type { Operator } from './operators.models';
+
+export interface StorageState {
+  lang: string;
+  chat: any;
+  view: any;
+  showOpInfo: any;
+  operators: Operator[];
+  awaitMessages: any;
+  operators_complete: Operator[];
+  since: any;
+  showModal: boolean;
+  urlImage: string;
+  show_widget: boolean;
+}

package/src/redux/actions/app.actions.ts

@@ -0,0 +1,369 @@
+/** @format */
+
+import { createAction } from '@reduxjs/toolkit';
+import {
+  auth,
+  sendinputs,
+  getCategoryHelp,
+  getTokenWidget,
+  setTokenWidget,
+} from '../../services/app.services';
+import { getTikets } from '../actions/chatHistory.actions';
+import { setOperators } from './operators.actions';
+import { listenSocket } from '../../services/socket.service';
+import { setInitProps } from '../actions/chatBoard.actions';
+import { RenderChat, sendMessageHandler } from '../actions/chat.actions';
+import {
+  spanish,
+  english,
+  portuguese,
+  italian,
+  french,
+} from '../../assets/languaje';
+import { changeLoading } from '../actions/chatBoard.actions';
+import {
+  setLanguage,
+  setChat,
+  setShowOpInfo,
+  setShowOpName,
+  setOperatorsStorage,
+  setSinceStorage,
+} from '../actions/storage.actions';
+import { existProp, setSince } from '../../helpers/utils.helper';
+import type { User } from '../../models/app.models';
+
+export const responseToClient = createAction<any>('RESPONSE_TO_CLIENT');
+export const createNewChat = createAction<any>('CREATE_NEW_CHAT');
+export const setInitProperties = createAction<any>('SET_INIT_PROPERTIES');
+export const setErrors = createAction<any[]>('SET_ERRORS');
+export const cleanErrors = createAction<any[]>('CLEAN_ERRORS');
+export const updateChatPermisions = createAction<User>(
+  'UPDATE_CHAT_PERMISIONS'
+);
+export const allowSendMessage = createAction<boolean>('ALLOW_SEND_MESSAGE');
+export const showQuitButton = createAction<any>('SHOW_QUIT_BUTTON');
+export const setSocketStatus = createAction<any>('SET_SOCKET_STATUS');
+export const setWidowStatus = createAction<any>('SET_WINDOW_STATUS');
+export const setFeedBack = createAction<any>('SET_FEEDBACK');
+export const setQuickReplies = createAction<boolean | object>(
+  'SET_QUICK_REPLIES'
+);
+export const setFloatMessage = createAction<any>('SET_FLOAT_MESSAGE');
+export const setFloatMessageOC = createAction<boolean>(
+  'SET_FLOAT_MESSAGE_OPEN_OR_CLOSED'
+);
+export const setLoadingMsjBot = createAction<boolean>('SET_LOADING_MSJ_BOT');
+export const setCategoryHelp = createAction<Array<any>>('SET_CATEGORY_HELP');
+export const setChannelsButton = createAction<Array<any>>(
+  'SET_CHANNELS_BUTTON'
+);
+export const setUser = createAction<{
+  network_id: string;
+  customer_id: string;
+}>('SET_USER');
+export const changeBot = createAction<any>('CHANGE_BOT');
+
+var ln_phone = 'es';
+
+export const language_labels = (language: string) => {
+  var ln_;
+  if (language === 'keep_language') {
+    ln_ = ln_phone.includes('en')
+      ? english
+      : ln_phone.includes('it')
+      ? italian
+      : ln_phone.includes('pt')
+      ? portuguese
+      : ln_phone.includes('fr')
+      ? french
+      : spanish;
+  } else {
+    ln_ =
+      language === 'english'
+        ? english
+        : language === 'italian'
+        ? italian
+        : language === 'portuguese'
+        ? portuguese
+        : language === 'french'
+        ? french
+        : spanish;
+  }
+  return ln_;
+};
+
+export const language_value = (language: string) => {
+  var ln_;
+  if (language === 'keep_language') {
+    ln_ = ln_phone.includes('en')
+      ? 'english'
+      : ln_phone.includes('it')
+      ? 'italian'
+      : ln_phone.includes('pt')
+      ? 'portuguese'
+      : ln_phone.includes('fr')
+      ? 'french'
+      : 'spanish';
+  } else {
+    ln_ = language;
+  }
+  return ln_;
+};
+
+export const initChat =
+  (payload: any) => async (dispatch: any, getState: any) => {
+    const { channel_id, last_url, showQuitButton } = payload;
+    let update: boolean = false,
+      message: any = null;
+
+    delete payload.showQuitButton;
+    delete payload.channel_id;
+
+    if (typeof payload.user === 'undefined') {
+      delete payload.user;
+    }
+
+    if (!payload.token && !payload.update) {
+      const token: string | null = await getTokenWidget();
+      if (token) {
+        payload.token = token;
+      }
+    }
+
+    if (payload.update) {
+      update = true;
+      delete payload.update;
+    }
+
+    if (payload.messages) {
+      message = payload.messages;
+      delete payload.messages;
+    }
+    var token: string | null = null;
+
+    try {
+      const resp: any = await auth(payload, channel_id);
+      if (
+        resp?.meta?.code === 422 ||
+        (resp?.message && resp?.message === 'Unauthorized')
+      ) {
+        dispatch(
+          initChat({ channel_id, last_url, update: true, user: payload.user })
+        );
+        return;
+      }
+
+      dispatch(responseToClient(resp));
+
+      const data = {
+        channelId: channel_id,
+        token: resp.data.token,
+      };
+
+      if (!token) {
+        await setTokenWidget(resp.data.token);
+      }
+
+      const { language } = resp.data.channel_config;
+      var new_language = language_value(language);
+
+      var user_complete = resp.data.user;
+
+      if (payload.user) {
+        user_complete = Object.assign(payload.user, resp.data.user);
+      }
+
+      dispatch(setLanguage(new_language));
+      let init: any = {
+        channelId: channel_id,
+        token: resp.data.token,
+        initProps: resp.data.channel_config,
+        avgTime: 10,
+        last_url,
+        showQuitButton,
+        user: user_complete,
+        labels: language_labels(language),
+        update,
+        bots: resp.data.bot,
+      };
+
+      if (!existProp(resp.data, 'bot')) {
+        init.bot = {
+          name: resp.data.channel.name,
+          photo:
+            'https://dashboard.tikket.net/assets/images/portrait-placeholder.png',
+        };
+      } else {
+        var index = resp.data.bot.length === 3 ? 2 : 1;
+
+        init.bot = Array.isArray(resp.data.bot)
+          ? resp.data.bot[resp.data.bot.length - index].bot
+          : resp.data.bot.bot;
+
+        dispatch(changeBot(init.bot));
+      }
+
+      if (resp?.meta?.code === 200) {
+        const chat = getState().Storage.chat;
+        const sessionView = getState().Storage.view;
+
+        if (resp.data.user) {
+          let user = {
+            network_id: resp.data.user?.network_id,
+            customer_id: resp.data.user?.customer_id,
+          };
+          dispatch(setUser(user));
+        }
+
+        if (init.initProps.url_helpcenter && !message) {
+          try {
+            const respCategory = await getCategoryHelp(
+              init.initProps.url_helpcenter
+            );
+
+            if (!respCategory.error) {
+              dispatch(setCategoryHelp(respCategory.data));
+            }
+          } catch (error) {}
+        }
+        dispatch(
+          setChannelsButton(
+            init.initProps.channel_buttons ? init.initProps.channel_buttons : []
+          )
+        );
+        dispatch(setInitProperties(init));
+        dispatch(setInitProps({ view: 'main', sessionView }));
+
+        dispatch(setChat(init.save_chats));
+        dispatch(setShowOpInfo(init.initProps.show_operators_info));
+
+        if (init.initProps.operator_name) {
+          dispatch(setShowOpName(init.initProps.operator_name));
+        }
+        dispatch(setOperators(resp.data.operators));
+        dispatch(setOperatorsStorage(resp.data.operators));
+
+        if (message) {
+          message.token = resp.data.token;
+          message.resend = true;
+          dispatch(sendMessageHandler(message));
+        }
+
+        let token = resp.data.token;
+        listenSocket(channel_id, token);
+
+        if (init.initProps.save_chats && !message) {
+          dispatch(getTikets(data));
+        }
+
+        if (chat !== null) {
+          dispatch(RenderChat(JSON.parse(chat)));
+          const since = setSince(chat.detail.date);
+          dispatch(setSinceStorage(since));
+        }
+      }
+
+      return resp;
+    } catch (error) {}
+  };
+
+export const reconectSocket = () => async (dispatch: any, getState: any) => {
+  dispatch(changeLoading());
+  const channelId = getState().app.channelId;
+  const token = getState().app.token;
+  listenSocket(channelId, token);
+  dispatch(changeLoading());
+};
+
+export const updateFormUser =
+  (payload: any) => async (dispatch: any, getState: any) => {
+    const { last_url, showQuitButton } = payload;
+
+    const channelId = getState().app.channelId;
+    const token = getState().app.token;
+
+    delete payload.channel_id;
+    delete payload.showQuitButton;
+
+    const resp = await sendinputs(token, channelId, payload);
+
+    if (resp?.meta?.code === 200) {
+      const { language } = resp.data.channel_config;
+
+      dispatch(setLanguage(language));
+
+      let init: any = {
+        channelId,
+        token: resp.data.token ? resp.data.token : token,
+        initProps: resp.data.channel_config,
+        avgTime: 10,
+        last_url,
+        showQuitButton,
+        user: resp.data.user ? resp.data.user : payload.user,
+        labels: language_labels(language),
+        updateUser: true,
+      };
+
+      let updateUser = {
+        sent: true,
+        chatFirstMessage: resp.data.channel_config.welcome_message,
+        user: resp.data.user ? resp.data.user : payload.user,
+      };
+
+      dispatch(updateChatPermisions(updateUser));
+
+      dispatch(
+        setChannelsButton(
+          init.initProps.channel_buttons ? init.initProps.channel_buttons : []
+        )
+      );
+      dispatch(setInitProperties(init));
+      dispatch(setChat(init.save_chats));
+      dispatch(setShowOpInfo(init.initProps.show_operators_info));
+      if (init.initProps.operator_name) {
+        dispatch(setShowOpName(init.initProps.operator_name));
+      }
+      dispatch(setOperators(resp.data.operators));
+      dispatch(setOperatorsStorage(resp.data.operators));
+    }
+  };
+
+export const sendChatForm =
+  (payload: any) => async (dispatch: any, getState: any) => {
+    dispatch(changeLoading());
+    const channelId = getState().app.channelId;
+    const token = getState().app.token;
+    const user = getState().app.user_init;
+
+    if (user) {
+      Object.assign(payload.user, user);
+    }
+
+    const resp = await sendinputs(token, channelId, payload);
+
+    if (resp?.meta?.code === 200) {
+      const { language } = resp.data.channel_config;
+      var new_language = language_value(language);
+      dispatch(setLanguage(new_language));
+      let init = {
+        channelId,
+        token: resp.data.token ? resp.data.token : token,
+        initProps: resp.data.channel_config,
+        avgTime: 10,
+        last_url: payload.last_url,
+        user: resp.data.user ? resp.data.user : payload.user,
+        updateUser: true,
+        labels: language_labels(language),
+      };
+
+      dispatch(setInitProperties(init));
+      const data = {
+        sent: true,
+        chatFirstMessage: resp.data.channel_config.welcome_message,
+        user: resp.data.user ? resp.data.user : payload.user,
+      };
+
+      dispatch(updateChatPermisions(data));
+    }
+    dispatch(changeLoading());
+  };

package/src/redux/actions/articles.actions.ts

@@ -0,0 +1,3 @@
+import { createAction } from '@reduxjs/toolkit';
+
+export const listArticles = createAction<any[]>('LIST_ARTICLES');