app-tutor-ai-consumer 1.3.0 → 1.5.0

package/.github/workflows/staging-staging.yml

@@ -0,0 +1,148 @@
+name: Deploy Staging (staging branch)
+run-name: "Staging deployment: ${{ github.ref_type }} ${{ github.ref_name }} by @${{ github.actor }}"
+
+concurrency: staging-${{ github.ref }}
+
+on:
+  push:
+    branches:
+      - staging/**
+
+env:
+  APP_NAME: app-tutor-ai-consumer
+  BUCKET_NAME: app-club-microfrontends
+  AWS_DEFAULT_REGION: us-east-1
+  CLOUDFRONT_ACCOUNT_ID: "449466460580"
+  CLOUDFRONT_DISTRIBUTION: "E19SXB8YMSF4QX"
+  CLOUDFRONT_URL: https://app-club-microfrontends.buildstaging.com
+  GH_TOKEN: ${{ secrets.CI_GH_TOKEN }}
+  SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
+  LANG_ENV: staging
+
+jobs:
+  deploy-staging:
+        name: Deploy Staging
+        runs-on: [buildstaging-high-iac]
+        steps:
+            - name: Checkout
+              uses: actions/checkout@v4
+              with:
+                token: ${{ secrets.CI_GH_TOKEN }}
+                fetch-depth: 0
+                ref: ${{ env.BRANCH_REF }}
+                fetch-tags: true
+
+            - name: Restore Cache
+              uses: Hotmart-Org/actions/cache@master
+              with:
+                bucket: buildstaging-pipeline-cache
+                cache-key: "${{ hashFiles('package.json') }}"
+                restore: true
+                mount: 'node_modules/'
+
+            - name: Setup Node.js
+              uses: actions/setup-node@v4
+              with:
+                node-version-file: '.nvmrc'
+
+            - name: Retrieve .npmrc
+              uses: Hotmart-Org/actions/codeartifact@master
+              with:
+                npmrc: ${{ secrets.NPM_RC }}
+                fontawesome-registry-token: ${{ secrets.FONTAWESOME_REGISTRY_TOKEN }}
+
+            - name: install-dependencies
+              run: npm ci --include=optional
+
+            - name: Rebuild Cache
+              uses: Hotmart-Org/actions/cache@master
+              with:
+                bucket: buildstaging-pipeline-cache
+                cache-key: "${{ hashFiles('package.json') }}"
+                rebuild: true
+                mount: 'node_modules/'
+
+            - name: pre-build-staging
+              run: |
+                echo "${{ env.LANG_ENV }}"
+                rm -rf public/locales 
+                mkdir public/locales 
+                npm run fetch-langs
+
+            - name: build-staging
+              run: npm run build:staging
+
+            - name: Deploy Microfrontend s3 - ${{ env.APP_NAME }}
+              uses: Hotmart-Org/actions/s3/microfrontend/deploy@master
+              with:
+                bucket-name: ${{ env.BUCKET_NAME }}
+                app-name: ${{ env.APP_NAME }}
+                package-json-path: ./package.json
+                bundle-source: ./dist
+                account-id: ${{ env.CLOUDFRONT_ACCOUNT_ID }}
+                cdn-distribution: ${{ env.CLOUDFRONT_DISTRIBUTION }}
+                cdn-url: ${{ env.CLOUDFRONT_URL }}
+
+  staging-notification:
+    name: 'Staging Notification'
+    runs-on: [buildstaging-iac]
+    needs: ['deploy-staging']
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Extract version from package.json
+        run: |
+          VERSION=$(cat package.json | jq -r .version)
+          echo "Extracted version: $VERSION"
+          echo "VERSION=$VERSION" >> $GITHUB_ENV
+
+      - name: Notify Google Chat
+        uses: Hotmart-Org/actions/notification@master
+        env:
+          VERSION: ${{ env.VERSION }}
+        with:
+          type: 'Original'
+          author: true
+          webhook-chat: 'https://chat.googleapis.com/v1/spaces/AAAA1nvOyjo/messages?key=AIzaSyDdI0hCZtE6vySjMm-WEfRq3CPzqKqqsHI&token=uuL7DA8zTxUkJjQa39HIM0TYVZV0DvneZ0mklNhEr5M'
+          body: |
+            {
+              "text": "🚧 *[STAGING] app-tutor-ai-consumer v${{ env.VERSION }}*: staging deploy: ${{ github.ref_name }}",
+              "cards": [
+                {
+                  "header": {
+                    "title": "Started by ${{ github.actor }}"
+                  },
+                  "sections": [
+                    {
+                      "widgets": [
+                        {
+                          "buttons": [
+                            {
+                              "textButton": {
+                                "onClick": {
+                                  "openLink": {
+                                    "url": "${{ github.server_url }}/${{ github.repository }}/commit/${{ github.sha }}"
+                                  }
+                                },
+                                "text": "View commit"
+                              }
+                            },
+                            {
+                              "textButton": {
+                                "onClick": {
+                                  "openLink": {
+                                    "url": "https://github.com/Hotmart-Org/app-tutor-ai-consumer/actions/runs/${{ github.run_id }}"
+                                  }
+                                },
+                                "text": "Follow this deploy"
+                              }
+                            }
+                          ]
+                        }
+                      ]
+                    }
+                  ]
+                }
+              ]
+            }

package/.github/workflows/staging.yml

@@ -5,7 +5,6 @@ on:
     push:
         branches:
             - main
-            - staging/*
 
 concurrency: staging
 
@@ -141,7 +140,7 @@ jobs:
           uses: newrelic/deployment-marker-action@v2.5.1
           env:
             VERSION: ${{ env.VERSION }}
-            NEW_RELIC_API_KEY: NRAK-14TLYFWRA5RCKUGK4A3TJSAPU78
+            NEW_RELIC_API_KEY: ${{ secrets.NEW_RELIC_API_KEY }}
             NEW_RELIC_DEPLOYMENT_ENTITY_GUID: Mjc1MDN8QVBNfEFQUExJQ0FUSU9OfDEwOTE1MDMzMTE
           with:
             apiKey: ${{ env.NEW_RELIC_API_KEY }}

package/CHANGELOG.md

@@ -1,3 +1,28 @@
+# [1.5.0](https://github.com/Hotmart-Org/app-tutor-ai-consumer/compare/v1.4.0...v1.5.0) (2025-07-10)
+
+### Bug Fixes
+
+- scrolling PR issues ([d2a8faa](https://github.com/Hotmart-Org/app-tutor-ai-consumer/commit/d2a8faac05c79d1b18f793981d69036687fefa0e))
+
+### Features
+
+- add infinite scroll UI ([8c86dd8](https://github.com/Hotmart-Org/app-tutor-ai-consumer/commit/8c86dd8043d0f10e8deae787e6f8870555f5c5f2))
+- adding specific pipiline to staging branch ([bee74d3](https://github.com/Hotmart-Org/app-tutor-ai-consumer/commit/bee74d37721e8900163409b5cd493a213c92fa8d))
+- adding styles ([2a33e03](https://github.com/Hotmart-Org/app-tutor-ai-consumer/commit/2a33e035f1e4b146cc7b03ba9f201a2f494bc31b))
+- adding styles file ([ef4d4ec](https://github.com/Hotmart-Org/app-tutor-ai-consumer/commit/ef4d4ec50c010f39dfba154b084cbe0dc9ece05b))
+
+# [1.4.0](https://github.com/Hotmart-Org/app-tutor-ai-consumer/compare/v1.3.0...v1.4.0) (2025-06-26)
+
+### Bug Fixes
+
+- pr issues ([74efaec](https://github.com/Hotmart-Org/app-tutor-ai-consumer/commit/74efaecaec56aa84808325cb05bc50bd0b50a6ef))
+- pr issues ([ab7a3a8](https://github.com/Hotmart-Org/app-tutor-ai-consumer/commit/ab7a3a80a5d45b857effb2d281d9523d9789af98))
+
+### Features
+
+- add tutor message markdown support ([4328fc4](https://github.com/Hotmart-Org/app-tutor-ai-consumer/commit/4328fc402c47f501ddd9761f612325515fc8c6e2))
+- add tutor messages and profile service ([213611b](https://github.com/Hotmart-Org/app-tutor-ai-consumer/commit/213611b570a163c27d980a83a8a8a4dd2cf6e077))
+
 # [1.3.0](https://github.com/Hotmart-Org/app-tutor-ai-consumer/compare/v1.2.0...v1.3.0) (2025-06-24)
 
 ### Bug Fixes

package/config/rspack/rspack.config.js

@@ -46,7 +46,7 @@ module.exports = async function (env) {
       path: paths.DIST,
       publicPath: bundlePath,
       pathinfo: !productionMode,
-      filename: `[name].[fullhash].${fileVersion}.js`,
+      filename: `remoteEntry.js`,
       chunkFilename: `[name].[fullhash].chunk.${fileVersion}.js`,
       sourceMapFilename: `[name].[fullhash].${fileVersion}.js.map`,
       clean: true
@@ -166,6 +166,10 @@ module.exports = async function (env) {
       new rspack.HtmlRspackPlugin({
         template: path.resolve(paths.PUBLIC, 'index.html'),
         favicon: path.resolve(paths.PUBLIC, 'favicon.ico')
+      }),
+      new rspack.CssExtractRspackPlugin({
+        filename: productionMode ? `app-tutor-ai-consumer.css` : '[name].[contenthash].css',
+        chunkFilename: productionMode ? '[id].[contenthash].css' : '[id].[contenthash].css'
       })
     ].concat(await getEnvironmentPlugins(!productionMode)),
     watchOptions: {

package/config/vitest/__mocks__/icons.tsx

@@ -0,0 +1,3 @@
+vi.mock('@/src/lib/components/icons', () => ({
+  Icon: vi.fn(({ name }) => <div data-test='lazy-icon'>{name}</div>)
+}))

package/config/vitest/__mocks__/intersection-observer.ts

@@ -0,0 +1,10 @@
+beforeEach(() => {
+  const mockIntersectionObserver = vi.fn()
+  mockIntersectionObserver.mockReturnValue({
+    observe: () => null,
+    unobserve: () => null,
+    disconnect: () => null
+  })
+
+  window.IntersectionObserver = mockIntersectionObserver
+})

package/config/vitest/__mocks__/sparkie.tsx

@@ -1,12 +1,3 @@
-vi.mock('@hotmart/sparkie', () => {
-  const Sparkie = vi.fn()
+import SparkieMock from '@/src/modules/sparkie/__tests__/sparkie.mock'
 
-  Sparkie.prototype.destroy = vi.fn()
-  Sparkie.prototype.init = vi.fn()
-  Sparkie.prototype.off = vi.fn()
-  Sparkie.prototype.on = vi.fn()
-  Sparkie.prototype.listener = { trackTyping: vi.fn() }
-  Sparkie.prototype.setAPIToken = vi.fn()
-
-  return { default: Sparkie }
-})
+vi.mock('@hotmart/sparkie', () => ({ default: SparkieMock }))

package/config/vitest/__mocks__/use-init-sparkie.tsx

@@ -0,0 +1,14 @@
+import { useInitSparkie } from '@/src/modules/widget/hooks/use-init-sparkie'
+
+vi.mock('@/src/modules/widget/hooks/use-init-sparkie/use-init-sparkie', () => ({
+  useInitSparkie: vi.fn()
+}))
+
+beforeEach(() => {
+  vi.mocked(useInitSparkie).mockReturnValue({
+    data: true,
+    isError: false,
+    isLoading: false,
+    refetch: vi.fn()
+  } as unknown as ReturnType<typeof useInitSparkie>)
+})

package/config/vitest/setupTests.ts

@@ -1,18 +1,23 @@
+import 'dayjs/locale/pt-br'
 import '@testing-library/jest-dom/vitest'
 
 import { cleanup, configure } from '@testing-library/react'
 
 import { serviceWorker } from '@/src/config/tests/worker'
+import { initDayjs } from '@/src/config/dayjs'
+import * as I18n from '@/src/config/i18n'
 
 configure({ testIdAttribute: 'data-test' })
 
 beforeEach(() => {
   cleanup()
+  vi.spyOn(I18n, 't').mockImplementation((...args) => args[0])
 })
 
 // Start worker before all tests
-beforeAll(() => {
+beforeAll(async () => {
   serviceWorker.listen()
+  await initDayjs('pt-br')
 })
 
 //  Close serviceWorker after all tests

package/config/vitest/vitest.config.mts

@@ -12,7 +12,10 @@ export default defineConfig({
       './config/vitest/setupTests.ts',
       './config/vitest/__mocks__/i18n.tsx',
       './config/vitest/__mocks__/sparkie.tsx',
-      './config/vitest/polyfills/global.js',
+      './config/vitest/__mocks__/icons.tsx',
+      './config/vitest/__mocks__/intersection-observer.ts',
+      './config/vitest/__mocks__/use-init-sparkie.tsx',
+      './config/vitest/polyfills/global.js'
     ],
     coverage: {
       include: ['src/**/*.{js,mjs,cjs,ts,mts,cts,jsx,tsx}'],
@@ -28,7 +31,7 @@ export default defineConfig({
         'src/**/*.builder.ts*',
         'src/app-injector.tsx',
         'src/bootstrap.tsx',
-        'src/index.ts',
+        'src/index.ts'
       ],
       reporter: ['text', 'html'],
       provider: 'istanbul',
@@ -36,13 +39,15 @@ export default defineConfig({
         branches: 3,
         lines: 3,
         functions: 3,
-        statements: 3,
-      },
+        statements: 3
+      }
     },
+    testTimeout: 10000,
+    hookTimeout: 10000,
     env: {
       ...config({
-        path: './environments/.env.test',
-      }).parsed,
-    },
-  },
+        path: './environments/.env.test'
+      }).parsed
+    }
+  }
 })

package/environments/.env.test

@@ -39,3 +39,5 @@ AUTH_CLIENT_SECRET=
 
 # BUNDLE
 BUNDLE_PATH=
+
+VITE_REACT_QUERY_EXPERIMENTAL_PREFETCH_IN_RENDER=true

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "app-tutor-ai-consumer",
-  "version": "1.3.0",
+  "version": "1.5.0",
   "main": "index.js",
   "scripts": {
     "dev": "rspack serve --env=development --config config/rspack/rspack.config.js",
@@ -8,9 +8,9 @@
     "generate-icon-types": "ts-node scripts/generate-icon-types.js",
     "postgenerate-icon-types": "npm run format",
     "prebuild": "npm run generate-icon-types",
-    "build": "rspack build --mode=production --env=production --config config/rspack/rspack.config.js",
+    "build": "NODE_ENV=production rspack build --mode=production --env=production --config config/rspack/rspack.config.js",
     "prebuild:staging": "npm run generate-icon-types",
-    "build:staging": "rspack build --mode=production --env=staging --config config/rspack/rspack.config.js",
+    "build:staging": "NODE_ENV=staging rspack build --mode=production --env=staging --config config/rspack/rspack.config.js",
     "prebuild:start": "npm run build",
     "build:start": "NODE_ENV=production rspack preview --config config/rspack/rspack.config.js --port 4200",
     "test": "vitest --config config/vitest/vitest.config.mts",
@@ -54,6 +54,7 @@
     "@testing-library/user-event": "~14.6.1",
     "@types/axios": "~0.9.36",
     "@types/chance": "~1.1.6",
+    "@types/linkify-it": "~5.0.0",
     "@types/node": "~24.0.0",
     "@types/react": "~19.1.7",
     "@types/react-dom": "~19.1.6",
@@ -107,12 +108,20 @@
     "@tanstack/react-query": "~5.80.6",
     "@tanstack/react-query-persist-client": "~5.80.7",
     "clsx": "~2.1.1",
+    "dayjs": "~1.11.13",
     "i18next": "~25.2.1",
     "i18next-resources-to-backend": "~1.2.1",
     "jotai": "~2.12.5",
+    "linkify-it": "~5.0.0",
+    "prism-react-renderer": "~2.4.1",
     "react": "~19.1.0",
     "react-dom": "~19.1.0",
-    "react-i18next": "~15.5.2"
+    "react-i18next": "~15.5.2",
+    "react-markdown": "~10.1.0",
+    "rehype-raw": "~7.0.0",
+    "rehype-sanitize": "~6.0.0",
+    "remark-breaks": "~4.0.0",
+    "remark-gfm": "~4.0.1"
   },
   "optionalDependencies": {
     "@rollup/rollup-linux-x64-gnu": "4.6.1",

package/public/index.html

@@ -6,13 +6,12 @@
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
     <link
-      href="https://fonts.googleapis.com/css?family=Nunito:400,700"
-      rel="stylesheet"
-    />
+      href="https://fonts.googleapis.com/css?family=Nunito:400,700&display=swap"
+      rel="stylesheet" />
     <title>App Tutor AI Consumer</title>
   </head>
 
-  <body>
+  <body class="bg-ai-dark">
     <div id="root"></div>
   </body>
 </html>

package/src/@types/declarations.d.ts

@@ -7,11 +7,20 @@ declare module '*.css'
 
 declare module '*.css?inline'
 
-declare module '*.png'
+declare module '*.png' {
+  const content: string
+  export default content
+}
 
-declare module '*.jpg'
+declare module '*.jpg' {
+  const content: string
+  export default content
+}
 
-declare module '*.gif'
+declare module '*.gif' {
+  const content: string
+  export default content
+}
 
 declare module '*.svg?url' {
   const content: string

package/src/config/dayjs/index.ts

@@ -0,0 +1,2 @@
+export * from './init'
+export * from './utils'

package/src/config/dayjs/init.ts

@@ -0,0 +1,28 @@
+import dayjs from 'dayjs'
+import calendar from 'dayjs/plugin/calendar'
+import isBetween from 'dayjs/plugin/isBetween'
+import isToday from 'dayjs/plugin/isToday'
+import localizedFormat from 'dayjs/plugin/localizedFormat'
+import timezone from 'dayjs/plugin/timezone'
+import utc from 'dayjs/plugin/utc'
+
+import { DEFAULT_LANGUAGE } from '../i18n'
+
+export const initDayjs = async (locale: string = DEFAULT_LANGUAGE) => {
+  dayjs.extend(localizedFormat)
+  dayjs.extend(utc)
+  dayjs.extend(timezone)
+  dayjs.extend(isBetween)
+  dayjs.extend(isToday)
+  dayjs.extend(calendar)
+
+  const lng = locale.match(/^pt/i) ? 'pt-br' : locale
+
+  try {
+    await import(`dayjs/locale/${lng}`)
+    dayjs.locale(lng)
+  } catch {
+    await import(`dayjs/locale/${DEFAULT_LANGUAGE}`)
+    dayjs.locale(DEFAULT_LANGUAGE)
+  }
+}

package/src/config/dayjs/utils/format-fulldate.ts

@@ -0,0 +1,7 @@
+import dayjs from 'dayjs'
+
+export const formatFullDate = (timestamp?: dayjs.ConfigType) => {
+  const time = dayjs(timestamp)
+
+  return time.format('L')
+}

package/src/config/dayjs/utils/format-time.ts

@@ -0,0 +1,20 @@
+import dayjs from 'dayjs'
+
+import { t } from '@/src/config/i18n'
+
+export const formatTime = (timestamp: dayjs.ConfigType, ignoreTime = false) => {
+  const time = dayjs(timestamp)
+
+  if (!time.isValid()) {
+    return 'Invalid date'
+  }
+
+  const daysDiff = dayjs().diff(time, 'day')
+
+  return time.calendar(null, {
+    sameDay: ignoreTime ? `[${t('general.today')}]` : 'LT',
+    lastDay: `[${t('general.yesterday')}]`,
+    lastWeek: daysDiff <= 7 ? 'dddd' : 'L',
+    sameElse: 'L'
+  })
+}

package/src/config/dayjs/utils/index.ts

@@ -0,0 +1,2 @@
+export * from './format-fulldate'
+export * from './format-time'

package/src/config/styles/global.css

@@ -75,12 +75,30 @@
   --hc-color-neutral-1000: #000000;
   --ai-color-primary: #a095ec;
   --ai-color-secondary: #6ba1f0;
-  --ai-color-dark: #111925;
-  --ai-color-chat-response: #26202f;
+  --ai-color-dark: #1a1c1f;
+  --ai-color-chat-response: #1e1926;
+
+  /* Size */
+  --hc-size-spacing-2: 0.5rem;
+  --hc-size-border-medium: 0.5rem;
 }
 
 #hotmart-app-tutor-ai-consumer-root {
-  composes: scrollbar from './shared-styles.module.css';
+  & *::-webkit-scrollbar {
+    width: var(--hc-size-spacing-2);
+    height: var(--hc-size-spacing-2);
+  }
+
+  & *::-webkit-scrollbar-track {
+    background: transparent;
+  }
+
+  & *::-webkit-scrollbar-thumb {
+    background: var(--hc-color-neutral-800);
+    border-radius: var(--hc-size-border-medium);
+    border: calc(var(--hc-size-border-medium) / 2) solid transparent;
+  }
+
   font-family:
     'Nunito Sans',
     -apple-system,

package/src/config/tanstack/query-client.ts

@@ -21,7 +21,8 @@ export const queryClient = new QueryClient({
           (statusCode < HttpCodes.BAD_REQUEST || statusCode >= HttpCodes.INTERNAL_SERVER_ERROR) &&
           failureCount <= maxRetries
         )
-      }
+      },
+      retryDelay: (attemptIndex) => Math.min(1000 * 2 ** attemptIndex, 30000)
     }
   }
 })

package/src/config/tanstack/query-provider.tsx

@@ -10,7 +10,7 @@ function QueryProvider({ children, showDevTools = true }: QueryProviderProps) {
   return (
     <PersistQueryClientProvider client={queryClient} persistOptions={{ persister }}>
       {children}
-      {showDevTools && <ReactQueryDevtools />}
+      {showDevTools && <ReactQueryDevtools buttonPosition='top-right' />}
     </PersistQueryClientProvider>
   )
 }

package/src/config/tests/handlers.ts

@@ -1,10 +1,16 @@
 import { http, HttpResponse } from 'msw'
 
+import { ProfileEndpoints } from '@/src/modules/profile'
+import ProfileAPIPropsBuilder from '@/src/modules/profile/__tests__/profile-api-props.builder'
+
 export const handlers = [
   http.all('https://tracking-api.buildstaging.com/rest/track/event/json/sync', () => {
     return HttpResponse.json({ ok: true })
   }),
   http.all('https://c3po-api-auth.buildstaging.com/v1/auth/sparkie', () => {
     return HttpResponse.json({ ok: true })
+  }),
+  http.all(ProfileEndpoints.getProfile(), () => {
+    return HttpResponse.json(new ProfileAPIPropsBuilder())
   })
 ]

package/src/config/tests/utils.tsx

@@ -11,13 +11,14 @@ import MockRequest from './mockRequest'
 
 const customRender = (
   ui: React.ReactElement,
-  { shallow, withQueryProvider = true, ...options }: IExtendedRenderOptions = {}
+  { shallow, withQueryProvider = true, withProvider, ...options }: IExtendedRenderOptions = {}
 ) => ({
   user: userEvent.setup(),
   ...render(
     setupComponents(ui, {
       shallow,
-      withQueryProvider
+      withQueryProvider,
+      withProvider
     }),
     options
   )

package/src/config/tests/wrappers.tsx

@@ -7,7 +7,10 @@ export const testQueryClient = new QueryClient({
   defaultOptions: {
     queries: {
       retry: false,
-      refetchOnWindowFocus: false
+      gcTime: 0,
+      staleTime: 0,
+      refetchOnWindowFocus: false,
+      experimental_prefetchInRender: true
     },
     mutations: {
       retry: false

package/src/index.tsx

@@ -1,19 +1,45 @@
+import './config/styles/global.css'
+import './config/styles/index.css'
+
 import { StrictMode } from 'react'
 import { createRoot } from 'react-dom/client'
 
+import { initDayjs } from './config/dayjs'
 import { initLanguage } from './config/i18n'
+import { initAxios } from './config/request/api'
+import { productionMode } from './lib/utils'
 import { Main } from './main'
 import { TutorWidgetEvents, TutorWidgetEventTypes } from './modules/widget'
 import type { StartTutorWidgetProps } from './types'
 
+const loadMainStyles = () => {
+  const isProduction = productionMode
+  const bundlePath = !isProduction
+    ? `${process.env.BUNDLE_PATH}/`
+    : `${process.env.BUNDLE_PATH}/${process.env.APP_NAME}/_current/`
+
+  const cssPath = `${bundlePath}app-tutor-ai-consumer.css`
+
+  if (!document.querySelector(`link[href="${cssPath}"]`)) {
+    const linkElement = document.createElement('link')
+    linkElement.rel = 'stylesheet'
+    linkElement.href = cssPath
+    document.head.appendChild(linkElement)
+  }
+}
+
 window.startTutorWidget = async ({
   elementId = 'tutor-chat-app-widget',
   settings
 }: StartTutorWidgetProps) => {
+  loadMainStyles()
+
   const rootElement = document.getElementById(elementId) as HTMLElement
   const root = createRoot(rootElement)
 
+  initAxios(settings.hotmartToken)
   await initLanguage(settings.locale)
+  await initDayjs(settings.locale)
 
   if (root)
     root.render(

package/src/lib/components/icons/arrow-down.svg

@@ -0,0 +1,5 @@
+<svg viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M13.9748 9.83038L8.47139 15.0179C8.37759 15.1116 8.25251 15.1429 8.1587 15.1429C8.03362 15.1429 7.90855 15.1116 7.81474 15.0179L2.31136 9.83038C2.09248 9.64288 2.09248 9.33038 2.28009 9.11163C2.46771 8.89288 2.7804 8.89288 2.96802 9.08038L7.65839 13.4554L7.65839 1.67413C7.65839 1.39288 7.87728 1.14288 8.12743 1.14288C8.37759 1.14288 8.65901 1.39288 8.65901 1.67413L8.65901 13.4554L13.3181 9.08038C13.5057 8.89288 13.8184 8.89288 14.006 9.11163C14.1937 9.33038 14.1937 9.64288 13.9748 9.83038Z"
+    fill="currentColor" />
+</svg>