app-tutor-ai-consumer 1.18.1 → 1.18.2

package/CHANGELOG.md

@@ -1,3 +1,5 @@
+## [1.18.2](https://github.com/Hotmart-Org/app-tutor-ai-consumer/compare/v1.18.1...v1.18.2) (2025-07-28)
+
 ## [1.18.1](https://github.com/Hotmart-Org/app-tutor-ai-consumer/compare/v1.18.0...v1.18.1) (2025-07-24)
 
 # [1.18.0](https://github.com/Hotmart-Org/app-tutor-ai-consumer/compare/v1.17.0...v1.18.0) (2025-07-24)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "app-tutor-ai-consumer",
-  "version": "1.18.1",
+  "version": "1.18.2",
   "main": "index.js",
   "scripts": {
     "dev": "rspack serve --env=development --config config/rspack/rspack.config.js",

package/src/lib/components/icons/gallery.svg

@@ -0,0 +1,3 @@
+<svg width="13" height="14" viewBox="0 0 13 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6.7166 0.880408C6.88983 0.963668 7 1.13886 7 1.33106V3.83106H9.23488C9.93358 3.83106 10.5944 4.14867 11.0309 4.69426L12.8904 7.01871C13.0105 7.1688 13.0339 7.37442 12.9507 7.54765C12.8674 7.72089 12.6922 7.83106 12.5 7.83106H10V10.0659C10 10.7646 9.6824 11.4255 9.1368 11.8619L6.81235 13.7215C6.66227 13.8416 6.45664 13.865 6.28341 13.7817C6.11018 13.6985 6 13.5233 6 13.3311V10.8311H3.76513C3.06643 10.8311 2.40561 10.5135 1.96913 9.96786L0.10957 7.64341C-0.0104977 7.49332 -0.0339069 7.2877 0.0493531 7.11447C0.132613 6.94123 0.307802 6.83106 0.500005 6.83106H3V4.59618C3 3.89748 3.31761 3.23666 3.86321 2.80019L6.18766 0.940625C6.33774 0.820557 6.54337 0.797148 6.7166 0.880408ZM1.54032 7.83106L2.75 9.34316C2.9967 9.65154 3.37021 9.83106 3.76513 9.83106H6V7.83106H1.54032ZM6 6.83106H4V4.59618C4 4.20127 4.17952 3.82776 4.4879 3.58105L6 2.37137V6.83106ZM7 7.83106V12.2907L8.51211 11.0811C8.82049 10.8344 9 10.4609 9 10.0659V7.83106H7ZM7 6.83106V4.83106H9.23488C9.6298 4.83106 10.0033 5.01058 10.25 5.31896L11.4597 6.83106H7Z" fill="currentColor"/>
+</svg>

package/src/lib/components/icons/icon-names.d.ts

@@ -11,4 +11,4 @@ export type ValidIconNames =
   | 'stop'
   | 'warning'
   | 'interrogation'
-  | 'book'
+  | 'gallery'

package/src/lib/components/icons/interrogation.svg

@@ -1,9 +1,3 @@
-<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M8 0.73584C3.5625 0.73584 0 4.32959 0 8.73584C0 13.1733 3.5625 16.7358 8 16.7358C12.4062 16.7358 16 13.1733 16 8.73584C16 4.32959 12.4062 0.73584 8 0.73584ZM8 15.7358C4.125 15.7358 1 12.6108 1 8.73584C1 4.89209 4.125 1.73584 8 1.73584C11.8438 1.73584 15 4.89209 15 8.73584C15 12.6108 11.8438 15.7358 8 15.7358ZM7.5 11.4858C7.0625 11.4858 6.75 11.8296 6.75 12.2358C6.75 12.6733 7.0625 12.9858 7.5 12.9858C7.90625 12.9858 8.25 12.6733 8.25 12.2358C8.25 11.8296 7.90625 11.4858 7.5 11.4858ZM8.90625 4.73584H7.0625C5.90625 4.73584 5 5.67334 5 6.82959V7.11084C5 7.39209 5.21875 7.61084 5.5 7.61084C5.75 7.61084 6 7.39209 6 7.11084V6.82959C6 6.23584 6.46875 5.73584 7.0625 5.73584H8.90625C9.5 5.73584 10 6.23584 10 6.82959C10 7.20459 9.78125 7.57959 9.4375 7.76709L7.5625 8.70459C7.21875 8.89209 7 9.26709 7 9.67334V10.2358C7 10.5171 7.21875 10.7358 7.5 10.7358C7.75 10.7358 8 10.5171 8 10.2358V9.67334C8 9.64209 8 9.61084 8.03125 9.57959L9.90625 8.64209C10.5625 8.26709 11 7.57959 11 6.82959C11 5.67334 10.0625 4.73584 8.90625 4.73584Z" fill="url(#paint0_linear_21475_7939)"/>
-<defs>
-<linearGradient id="paint0_linear_21475_7939" x1="0" y1="8.73584" x2="16" y2="8.73584" gradientUnits="userSpaceOnUse">
-<stop stop-color="#44D0FF"/>
-<stop offset="1" stop-color="#B48EFF"/>
-</linearGradient>
-</defs>
+<svg width="12" height="13" viewBox="0 0 12 13" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6 1.83105C3.23858 1.83105 1 4.06963 1 6.83105C1 9.59248 3.23858 11.8311 6 11.8311C8.76142 11.8311 11 9.59248 11 6.83105C11 4.06963 8.76142 1.83105 6 1.83105ZM6 12.8311C2.68629 12.8311 0 10.1448 0 6.83105C0 3.51735 2.68629 0.831055 6 0.831055C9.31371 0.831055 12 3.51735 12 6.83105C12 10.1448 9.31371 12.8311 6 12.8311ZM6 8.83105C6.41421 8.83105 6.75 9.16684 6.75 9.58105C6.75 9.99527 6.41421 10.3311 6 10.3311C5.58579 10.3311 5.25 9.99527 5.25 9.58105C5.25 9.16684 5.58579 8.83105 6 8.83105ZM5 5.33105C5 4.77877 5.44772 4.33105 6 4.33105H6.5C7.05228 4.33105 7.5 4.77877 7.5 5.33105V5.49772C7.5 5.95796 7.1269 6.33105 6.66667 6.33105C6.02233 6.33105 5.5 6.85339 5.5 7.49772V7.83105H6.5V7.49772C6.5 7.40567 6.57462 7.33105 6.66667 7.33105C7.67919 7.33105 8.5 6.51024 8.5 5.49772V5.33105C8.5 4.22649 7.60457 3.33105 6.5 3.33105H6C4.89543 3.33105 4 4.22649 4 5.33105H5Z" fill="currentColor"/>
 </svg>

package/src/modules/widget/components/greetings-card/greetings-card.tsx

@@ -1,10 +1,6 @@
 import clsx from 'clsx'
 import { useTranslation } from 'react-i18next'
 
-import { AIAvatar } from '../ai-avatar'
-
-import styles from './styles.module.css'
-
 export type GreetingsCardProps = {
   tutorName: string
   author: string
@@ -15,23 +11,31 @@ function GreetingsCard({ author, tutorName, isDarkTheme = false }: GreetingsCard
   const { t } = useTranslation()
 
   return (
-    <div className='flex flex-col items-center justify-center text-neutral-900'>
+    <div className='flex flex-col items-center justify-center'>
       <div className='flex flex-col items-center justify-center gap-4 text-center'>
-        <AIAvatar
-          className={clsx('rounded-full border-4 border-neutral-100', {
-            'bg-[#E7EDF2]/80': !isDarkTheme,
-            'bg-neutral-200': isDarkTheme
-          })}
-        />
         <div className='flex flex-col gap-2'>
-          <span className='text-base font-light'>
+          <span
+            className={clsx('text-base font-light', {
+              'text-white': isDarkTheme,
+              'text-gray-900': !isDarkTheme
+            })}>
             {t('general.greetings.hello', { name: author })}
           </span>
-          <h3 className={clsx('text-xl', styles.faceTxt)}>
+          <h3
+            className={clsx('text-xl font-bold', {
+              'text-white': isDarkTheme,
+              'text-gray-900': !isDarkTheme
+            })}>
             {t('general.greetings.firstMessage', { tutorName })}
           </h3>
         </div>
-        <p className='text-sm font-normal text-neutral-600'>{t('general.greetings.description')}</p>
+        <p
+          className={clsx('text-sm font-normal', {
+            'text-gray-400': isDarkTheme,
+            'text-neutral-600': !isDarkTheme
+          })}>
+          {t('general.greetings.description')}
+        </p>
       </div>
     </div>
   )

package/src/modules/widget/components/information-page/constants.ts

@@ -12,6 +12,10 @@ export const infoItems: InfoItem[] = [
     titleKey: 'info.what_it_does_question',
     descKey: 'info.what_it_does_answer'
   },
-  { icon: 'book', titleKey: 'info.how_it_learns_question', descKey: 'info.how_it_learns_answer' },
-  { icon: 'warning', titleKey: 'info.limitations_question', descKey: 'info.limitations_answer' }
+  {
+    icon: 'gallery',
+    titleKey: 'info.how_it_learns_question',
+    descKey: 'info.how_it_learns_answer'
+  },
+  { icon: 'info', titleKey: 'info.limitations_question', descKey: 'info.limitations_answer' }
 ]

package/src/modules/widget/components/information-page/information-card/information-card.tsx

@@ -1,3 +1,5 @@
+import clsx from 'clsx'
+
 import { Icon } from '@/src/lib/components'
 import type { ValidIconNames } from '@/src/lib/components/icons/icon-names'
 
@@ -5,18 +7,33 @@ export type InformationCardProps = {
   icon: ValidIconNames
   title: string
   description: string
+  isDarkMode: boolean
 }
 
-function InformationCard({ icon, title, description }: InformationCardProps) {
+function InformationCard({ icon, title, description, isDarkMode }: InformationCardProps) {
   return (
-    <div className='flex gap-3 border-b border-white/10 pb-5 last:border-none'>
-      <div className='flex h-5 w-5 items-start justify-center'>
+    <div
+      className={clsx('flex justify-center gap-3 border-b pb-5 last:border-none', {
+        'border-white/10': isDarkMode,
+        'border-black/10': !isDarkMode
+      })}>
+      <div
+        className={clsx('flex h-5 w-5 items-start justify-center', {
+          'text-white': isDarkMode,
+          'text-neutral-900': !isDarkMode
+        })}>
         <Icon name={icon} width={16} height={16} />
       </div>
 
       <div className='flex flex-col gap-1'>
-        <p className='text-sm font-bold'>{title}</p>
-        <p className='text-xs text-gray-300'>{description}</p>
+        <p className='text-sm font-bold text-neutral-900'>{title}</p>
+        <p
+          className={clsx('text-xs', {
+            'text-gray-300': isDarkMode,
+            'text-gray-500': !isDarkMode
+          })}>
+          {description}
+        </p>
       </div>
     </div>
   )

package/src/modules/widget/components/information-page/information-page.tsx

@@ -1,3 +1,4 @@
+import clsx from 'clsx'
 import { useTranslation } from 'react-i18next'
 
 import { Icon } from '@/src/lib/components'
@@ -12,10 +13,15 @@ function WidgetInformationPage() {
   const { t } = useTranslation()
   const [, setWidgetTabs] = useWidgetTabsAtom()
   const [settings] = useWidgetSettingsAtom()
+  const isDarkMode = settings?.config?.theme === 'dark'
 
   return (
     <PageLayout className='p-5 text-white'>
-      <div className='relative mb-8 flex h-12 items-center justify-center'>
+      <div
+        className={clsx('relative mb-8 flex h-12 items-center justify-center', {
+          'text-white': isDarkMode,
+          'text-neutral-700': !isDarkMode
+        })}>
         <button
           className='absolute left-0'
           aria-label='Return Button'
@@ -25,11 +31,17 @@ function WidgetInformationPage() {
         <h1 className='mx-auto font-bold'>{t('info.title')}</h1>
       </div>
 
-      <div className='mb-8 flex justify-center'>
+      <div className='mb-10 flex justify-center'>
         <div className='flex flex-col items-center gap-2'>
           <AIAvatar />
 
-          <h3 className='font-bold'>{settings?.tutorName ?? ''}</h3>
+          <h3
+            className={clsx('font-bold', {
+              'text-white': isDarkMode,
+              'text-neutral-700': !isDarkMode
+            })}>
+            {settings?.tutorName ?? t('general.name')}
+          </h3>
         </div>
       </div>
 
@@ -40,6 +52,7 @@ function WidgetInformationPage() {
             icon={item.icon}
             title={t(item.titleKey)}
             description={t(item.descKey)}
+            isDarkMode={isDarkMode}
           />
         ))}
       </div>

package/src/modules/widget/components/starter-page/starter-page.tsx

@@ -71,7 +71,6 @@ function WidgetStarterPage() {
           <WidgetHeader
             enabledButtons={['archive', 'info', 'close']}
             tutorName={settings?.tutorName}
-            showContent={false}
           />
 
           <div className='my-auto'>

package/src/modules/widget/components/greetings-card/styles.module.css

@@ -1,3 +0,0 @@
-.faceTxt {
-  composes: gradientText from '../../../../config/styles/utilities/text-utilities.module.css';
-}