diff --git a/README.md b/README.md index 4bdacde..d02efdb 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,7 @@ # Eduzz UI + UI padrão das aplicações, aqui você vai encontrar: + * [Layout](#layout) * [App Loader](#app-loader) @@ -131,6 +133,7 @@ function MyComponent() { ## Props ### Layout props + | prop | tipo | obrigatório | padrão | descrição | |-------------------------|----------------------------------------|-------------|-----------|----------------------------------------------------------------------------------| | mode | `'light' \| 'dark'` | `false` | `'light'` | Modo (Dark ou Light mode) | @@ -182,15 +185,43 @@ function MyComponent() { | prop | tipo | obrigatório | padrão | descrição | |-----------------|----------|-------------|--------|------------------------------------------------------| -| hyperflowConfig | `object` | `true` | - | Tokens dos canais do Hyperflow | +| hyperflowConfig | `HyperflowConfig` | `true` | - | Tokens dos canais do Hyperflow | | flowId | `string` | `true` | - | Id do flow do Hyperflow | -| currentUser | `object` | `true` | - | Dados do usuário que serão enviados para o Hyperflow | +| currentUser | `CurrentUser` | `true` | - | Dados do usuário que serão enviados para o Hyperflow | + +```ts +export type CurrentUser = { + tag: string; + belt: string; + isClubeBlack: boolean; + id: number; + name: string; + email: string; + isAccessPolicy: boolean; +} & ( + | { + isAccessPolicy: true; + originalUserId: number; + originalUserName: string; + originalUserEmail: string; + } + | { isAccessPolicy: false } +); + +type HyperflowConfig = { + chatUnityID: string; + chatBlackID: string; + chatEliteID: string; + flowId: string; +}; +``` ### Topbar.ModeSwitcher props + | prop | tipo | obrigatório | padrão | descrição | |--------------------|----------|-------------|--------|-------------------------------------------------------------| -| tooltip | `string` | `false` | `'Tema'` | Texto para o tooltip do botão. mode) | -| badgeDot | `boolean` | `false` | `false` | Se um badgeDot deve ser adicionado ao botão . | +| tooltip| `string`| `false`| `'Tema'`| Texto para o tooltip do botão. mode | +| badgeDot| `boolean`| `false`| `false`| Se um badgeDot deve ser adicionado ao botão .| ### Sidebar props @@ -225,7 +256,6 @@ function MyComponent() {

- # App Loader Loader de aplicação padrão. @@ -280,4 +310,4 @@ function App() { | prop | tipo | obrigatório | padrão | |--------------|------------------|-------------|--------------| | logo | `url\|ReactNode` | `false` | `Eduzz Logo` | -| logoDarkMode | `url\|ReactNode` | `false` | `Eduzz Logo` | \ No newline at end of file +| logoDarkMode | `url\|ReactNode` | `false` | `Eduzz Logo` | diff --git a/Topbar/HyperflowSupportChat/chat.tsx b/Topbar/HyperflowSupportChat/chat.tsx index 7b35483..f16419e 100644 --- a/Topbar/HyperflowSupportChat/chat.tsx +++ b/Topbar/HyperflowSupportChat/chat.tsx @@ -1,23 +1,7 @@ import useExternalScript from './import'; +import { CurrentUser, HyperflowConfig, HyperflowParams, SupportChatProps } from './types'; -type HyperflowParams = { - id?: number; - name?: string; - email?: string; - eliteChatToken?: string; - original_id?: number; - original_name?: string; - original_email?: string; - sender?: string; -}; - -interface SupportChatProps { - jwtToHyperflow: string; - currentUser: any; - hyperflowConfig: any; -} - -function getChatTokenID(currentUser: any, hyperflowConfig: any) { +function getChatTokenID(currentUser: CurrentUser, hyperflowConfig: HyperflowConfig) { const chatUnityID = hyperflowConfig.chatUnityID; const chatBlackID = hyperflowConfig.chatBlackID; const chatEliteID = hyperflowConfig.chatEliteID; @@ -33,26 +17,26 @@ const HyperflowSupportChat: React.FC = ({ jwtToHyperflow, curr const hyperflow = useExternalScript('https://webchat.hyperflow.global/sdk.js'); const chatToken = getChatTokenID(currentUser, hyperflowConfig); - if (hyperflow === 'ready') { - Hyperflow.init(chatToken).on('getStarted', () => { - const params: HyperflowParams = { - id: currentUser?.id, - name: currentUser?.name.split(' ')[0], - email: currentUser?.email, - sender: jwtToHyperflow - }; - - if (currentUser?.isAccessPolicy) { - params.original_id = currentUser?.originalUserId; - params.original_name = currentUser?.originalUserName?.split(' ')[0]; - params.original_email = currentUser?.originalUserEmail; - } - - Hyperflow.initFlow(hyperflowConfig.flowId, params); - }); + if (hyperflow !== 'ready') { + return null; } - return null; + Hyperflow.init(chatToken).on('getStarted', () => { + const params: HyperflowParams = { + id: currentUser.id, + name: currentUser.name.split(' ')[0], + email: currentUser.email, + sender: jwtToHyperflow + }; + + if (currentUser?.isAccessPolicy) { + params.original_id = currentUser?.originalUserId; + params.original_name = currentUser?.originalUserName?.split(' ')[0]; + params.original_email = currentUser?.originalUserEmail; + } + + Hyperflow.initFlow(hyperflowConfig.flowId, params); + }); }; export default HyperflowSupportChat; diff --git a/Topbar/HyperflowSupportChat/index.tsx b/Topbar/HyperflowSupportChat/index.tsx index 26fad2a..5408076 100644 --- a/Topbar/HyperflowSupportChat/index.tsx +++ b/Topbar/HyperflowSupportChat/index.tsx @@ -1,10 +1,5 @@ import HyperflowSupportChat from './chat'; - -export interface TopbarHyperflowSupportChatProps { - jwtToHyperflow?: string; - currentUser?: any; - hyperflowConfig?: any; -} +import { TopbarHyperflowSupportChatProps } from './types'; const TopbarHyperflowSupportChat = ({ jwtToHyperflow, @@ -12,7 +7,6 @@ const TopbarHyperflowSupportChat = ({ hyperflowConfig }: TopbarHyperflowSupportChatProps) => { if (!jwtToHyperflow) return null; - return ( ); diff --git a/Topbar/HyperflowSupportChat/types.ts b/Topbar/HyperflowSupportChat/types.ts new file mode 100644 index 0000000..135e48a --- /dev/null +++ b/Topbar/HyperflowSupportChat/types.ts @@ -0,0 +1,46 @@ +export type CurrentUser = { + tag: string; + belt: string; + isClubeBlack: boolean; + id: number; + name: string; + email: string; + isAccessPolicy: boolean; +} & ( + | { + isAccessPolicy: true; + originalUserId: number; + originalUserName: string; + originalUserEmail: string; + } + | { isAccessPolicy: false } +); + +export type HyperflowConfig = { + chatUnityID: string; + chatBlackID: string; + chatEliteID: string; + flowId: string; +}; + +export type TopbarHyperflowSupportChatProps = { + jwtToHyperflow: string; + currentUser: CurrentUser; + hyperflowConfig: HyperflowConfig; +}; + +export type HyperflowParams = { + id: number; + name: string; + email: string; + original_id?: number; + original_name?: string; + original_email?: string; + sender: string; +}; + +export type SupportChatProps = { + jwtToHyperflow: string; + currentUser: CurrentUser; + hyperflowConfig: HyperflowConfig; +}; diff --git a/_dev/App.tsx b/_dev/App.tsx index de1aeae..e136364 100644 --- a/_dev/App.tsx +++ b/_dev/App.tsx @@ -37,7 +37,27 @@ function App() { }} > - + diff --git a/package.json b/package.json index f5e695b..e855456 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@eduzz/ui-layout", - "version": "1.4.1", + "version": "1.4.2", "keywords": [ "eduzz", "react",