app-tutor-ai-consumer 1.7.0 → 1.8.1

package/.github/workflows/production.yml

@@ -95,7 +95,7 @@ jobs:
         uses: newrelic/deployment-marker-action@v2.5.1
         env:
           VERSION: ${{ env.VERSION }}
-          NEW_RELIC_API_KEY: NRAK-NX0XDEQLIGCEWTLWS6EQ17B4VY1
+          NEW_RELIC_API_KEY: ${{ secrets.NEW_RELIC_API_KEY }}
           NEW_RELIC_DEPLOYMENT_ENTITY_GUID: Mjc1MDN8QVBNfEFQUExJQ0FUSU9OfDEwOTUyNjI4MTc
         with:
           apiKey: ${{ env.NEW_RELIC_API_KEY }}
@@ -139,7 +139,7 @@ jobs:
                               "textButton": {
                                 "onClick": {
                                   "openLink": {
-                                    "url": "https://github.com/Hotmart-Org/app-club-consumer/actions/runs/${{ github.run_id }}"
+                                    "url": "https://github.com/Hotmart-Org/app-tutor-ai-consumer/actions/runs/${{ github.run_id }}"
                                   }
                                 },
                                 "text": "Follow this deploy"

package/.github/workflows/rollback.yml

@@ -57,7 +57,7 @@ jobs:
         uses: newrelic/deployment-marker-action@v2.5.1
         env:
           ROLLBACK_VERSION: ${{ github.event.inputs.rollbackVersion }}
-          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 }}
@@ -104,7 +104,7 @@ jobs:
         uses: newrelic/deployment-marker-action@v2.5.1
         env:
           ROLLBACK_VERSION: ${{ github.event.inputs.rollbackVersion }}
-          NEW_RELIC_API_KEY: NRAK-NX0XDEQLIGCEWTLWS6EQ17B4VY1
+          NEW_RELIC_API_KEY: ${{ secrets.NEW_RELIC_API_KEY }}
           NEW_RELIC_DEPLOYMENT_ENTITY_GUID: Mjc1MDN8QVBNfEFQUExJQ0FUSU9OfDEwOTUyNjI4MTc
         with:
           apiKey: ${{ env.NEW_RELIC_API_KEY }}

package/.github/workflows/staging.yml

@@ -123,12 +123,17 @@ jobs:
                 cdn-url: ${{ env.CLOUDFRONT_URL }}
 
     staging-notification:
-        name: 'Staging Notification'
-        runs-on: [buildstaging-iac]
-        needs: ['deploy-staging']
-        steps:
+      name: 'Staging Notification'
+      runs-on: [buildstaging-iac]
+      needs: ['deploy-staging']
+      steps:
         - name: Checkout
           uses: actions/checkout@v4
+          with:
+            token: ${{ secrets.CI_GH_TOKEN }}
+            fetch-depth: 0
+            ref: ${{ env.BRANCH_REF }}
+            fetch-tags: true
 
         - name: Extract version from package.json
           run: |
@@ -146,7 +151,57 @@ jobs:
             apiKey: ${{ env.NEW_RELIC_API_KEY }}
             guid: ${{ env.NEW_RELIC_DEPLOYMENT_ENTITY_GUID }}
             version: ${{ env.VERSION }}
-            user: '${{ github.actor }}'
-            changelog: 'https://github.com/${{ github.repository }}/blob/main/CHANGELOG.md'
-            commit: '${{ github.sha }}'
-            description: 'Deploy: ${{env.APP_NAME}} v${{env.VERSION}} - ${{ github.ref_name }}'
+            user: "${{ github.actor }}"
+            changelog: "https://github.com/${{ github.repository }}/blob/master/CHANGELOG.md"
+            commit: "${{ github.sha }}"
+            description: "Deploy: ${{env.APP_NAME}} v${{ env.VERSION }} - ${{ github.ref_name }}"
+
+        - 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/CHANGELOG.md

@@ -1,3 +1,11 @@
+## [1.8.1](https://github.com/Hotmart-Org/app-tutor-ai-consumer/compare/v1.8.0...v1.8.1) (2025-07-15)
+
+# [1.8.0](https://github.com/Hotmart-Org/app-tutor-ai-consumer/compare/v1.7.0...v1.8.0) (2025-07-14)
+
+### Features
+
+- changing notifications and keys ([57312bc](https://github.com/Hotmart-Org/app-tutor-ai-consumer/commit/57312bc069bc1f9ba0fefde00f252f615e52efa4))
+
 # [1.7.0](https://github.com/Hotmart-Org/app-tutor-ai-consumer/compare/v1.6.0...v1.7.0) (2025-07-11)
 
 ### Features

package/package.json

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

package/public/index.html

@@ -12,6 +12,6 @@
   </head>
 
   <body class="bg-ai-dark">
-    <div id="root"></div>
+    <div id="c3po-app-widget"></div>
   </body>
 </html>

package/src/development-bootstrap.tsx

@@ -8,7 +8,7 @@ import { devMode } from './lib/utils'
 if (devMode) {
   window.TOKEN = process.env.TOKEN ?? ''
   void (async () => {
-    await window.startChatWidget('root', {
+    await window.startChatWidget('c3po-app-widget', {
       hotmartToken: window.TOKEN,
       locale: LANGUAGES.PT_BR,
       conversationId: '21506473-a93c-4b38-9c32-68a5ca37ce73', // OWNER

package/src/lib/hooks/use-ref-client-height/use-ref-client-height.tsx

@@ -1,18 +1,18 @@
-import { type RefObject, useEffect, useState } from 'react'
+import { type RefObject, useEffect, useMemo, useState } from 'react'
 
 import { useThrottle } from '@/src/lib/hooks'
 
 function useRefClientHeight<T extends HTMLElement>(
   refElement: RefObject<T | null>,
-  defaultHeight = '100vh'
+  defaultHeight = 0
 ) {
-  const [clientHeight, setClientHeight] = useState(defaultHeight)
+  const [clientHeight, setClientHeight] = useState<number>(defaultHeight)
 
   const { throttledCallback: resizeHandler } = useThrottle({
     callback: () => {
       if (!refElement?.current?.clientHeight) return
 
-      setClientHeight(`${refElement?.current.clientHeight}px`)
+      setClientHeight(refElement.current.clientHeight)
     },
     delay: 650
   })
@@ -32,7 +32,7 @@ function useRefClientHeight<T extends HTMLElement>(
     }
   }, [refElement, resizeHandler])
 
-  return clientHeight
+  return useMemo(() => clientHeight, [clientHeight])
 }
 
 export default useRefClientHeight

package/src/modules/messages/components/messages-list/messages-list.tsx

@@ -1,7 +1,6 @@
 import { lazy, useCallback, useRef } from 'react'
 import clsx from 'clsx'
 
-import { useRefClientHeight } from '@/src/lib/hooks'
 import { useWidgetLoadingAtomValue } from '@/src/modules/widget'
 import { useAllMessages, useManageScroll } from '../../hooks'
 import { useSkeletonRef } from '../../hooks/use-skeleton-ref'
@@ -22,7 +21,6 @@ const ScrollToBottomButton = lazy(
 
 function MessagesList() {
   const scrollerRef = useRef<HTMLDivElement>(null)
-  const scrollerClientHeight = useRefClientHeight(scrollerRef)
   const scrollToButtonRef = useRef<HTMLButtonElement>(null)
   const { allMessages, messagesQuery } = useAllMessages()
   const widgetIsLoading = useWidgetLoadingAtomValue()
@@ -41,12 +39,7 @@ function MessagesList() {
   }, [])
 
   return (
-    <div
-      ref={scrollerRef}
-      className={clsx(
-        'relative mx-2 flex flex-col gap-2 overflow-auto p-4',
-        `h-[${scrollerClientHeight}]`
-      )}>
+    <div ref={scrollerRef} className='relative mx-2 my-4 flex flex-col gap-2 overflow-auto px-4'>
       <MessageItemLoading show={messagesQuery.isFetching} />
 
       <MessageItemEndOfScroll

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

@@ -4,6 +4,7 @@ import { isTextEmpty } from '@/src/lib/utils/is-text-empty'
 import { ChatInput, MessagesList, useChatInputValueAtom } from '@/src/modules/messages/components'
 import { useAllMessages, useSendTextMessage } from '@/src/modules/messages/hooks'
 import { useWidgetLoadingAtomValue, useWidgetTabsValueAtom } from '../../store'
+import { PageLayout } from '../page-layout'
 
 function ChatPage() {
   const widgetTabs = useWidgetTabsValueAtom()
@@ -27,9 +28,8 @@ function ChatPage() {
   }
 
   return (
-    <>
-      <MessagesList />
-      <div className='border-t border-t-neutral-700 px-5 py-4'>
+    <PageLayout
+      asideChild={
         <ChatInput
           name='new-chat-msg-input'
           ref={chatInputRef}
@@ -38,9 +38,9 @@ function ChatPage() {
           inputDisabled={messagesQuery?.isLoading}
           buttonDisabled={messagesQuery?.isLoading || !value.trim()}
         />
-      </div>
-    </>
+      }>
+      <MessagesList />
+    </PageLayout>
   )
 }
-
 export default ChatPage

package/src/modules/widget/components/container/container.tsx

@@ -7,10 +7,8 @@ function WidgetContainer() {
   useSubscribeMessageReceivedEvent()
 
   return (
-    <div className='flex min-h-svh flex-col items-center justify-center'>
-      <div className='grid h-svh w-full grid-rows-[1fr_max-content]'>
-        {WIDGET_TABS[widgetTabs.currentTab]}
-      </div>
+    <div className='flex h-full flex-col items-center justify-stretch overflow-hidden'>
+      {WIDGET_TABS[widgetTabs.currentTab]}
     </div>
   )
 }

package/src/modules/widget/components/index.ts

@@ -2,4 +2,5 @@ export * from './ai-avatar'
 export * from './chat-page'
 export * from './container'
 export * from './greetings-card'
+export * from './page-layout'
 export * from './scroll-to-bottom-button'

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

@@ -4,6 +4,7 @@ import { useTranslation } from 'react-i18next'
 import TutorOnboardingSVG from '@/public/assets/svg/tutor-onboarding.svg?url'
 import { Button } from '@/src/lib/components'
 import { useWidgetTabsAtom } from '../../store'
+import { PageLayout } from '../page-layout'
 
 import styles from './styles.module.css'
 
@@ -12,8 +13,8 @@ function WidgetOnboardingPage() {
   const { t } = useTranslation()
 
   return (
-    <>
-      <div className={styles.bg}>
+    <PageLayout>
+      <div className={clsx('flex-1', styles.bg)}>
         <div className='mx-4 flex h-full flex-col justify-center gap-6 px-0.5'>
           <div className='mx-auto max-w-[67%]'>
             <img src={TutorOnboardingSVG} aria-hidden />
@@ -33,7 +34,7 @@ function WidgetOnboardingPage() {
           {t('general.buttons.start')}
         </Button>
       </div>
-    </>
+    </PageLayout>
   )
 }
 

package/src/modules/widget/components/page-layout/index.ts

@@ -0,0 +1,2 @@
+export * from './page-layout'
+export { default as PageLayout } from './page-layout'

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

@@ -0,0 +1,27 @@
+import clsx from 'clsx'
+import type { PropsWithChildren, ReactNode } from 'react'
+
+export type PageLayoutProps = PropsWithChildren<{
+  asideChild?: ReactNode
+  className?: string
+}>
+function PageLayout({ asideChild, children, className }: PageLayoutProps) {
+  return (
+    <div
+      className={clsx(
+        'grid-areas-[main_aside] grid h-full min-h-0 w-full grid-cols-1 grid-rows-[1fr_auto]',
+        className
+      )}>
+      <div className='grid-area-[main] flex min-h-0 flex-col overflow-y-auto overflow-x-hidden'>
+        {children}
+      </div>
+      {asideChild && (
+        <div className='grid-area-[aside] flex-shrink-0 border-t border-t-neutral-700 px-5 py-4'>
+          {asideChild}
+        </div>
+      )}
+    </div>
+  )
+}
+
+export default PageLayout

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

@@ -4,6 +4,7 @@ import { useRefEventListener } from '@/src/lib/hooks'
 import { ChatInput, useChatInputValueAtom } from '@/src/modules/messages/components'
 import { useWidgetSettingsAtom, useWidgetTabsAtom } from '../../store'
 import { GreetingsCard } from '../greetings-card'
+import { PageLayout } from '../page-layout'
 
 function WidgetStarterPage() {
   const [settings] = useWidgetSettingsAtom()
@@ -23,18 +24,18 @@ function WidgetStarterPage() {
   })
 
   return (
-    <>
-      <div className='flex flex-col justify-center px-5 py-4'>
-        <GreetingsCard author={settings?.author ?? ''} tutorName={settings?.tutorName ?? ''} />
-      </div>
-      <div className='border-t border-t-neutral-700 px-5 py-4'>
+    <PageLayout
+      asideChild={
         <ChatInput
           name='new-chat-msg-input'
           ref={chatInputRef}
           onSend={() => setWidgetTabs('chat')}
         />
+      }>
+      <div className='flex flex-col justify-center px-5 py-4'>
+        <GreetingsCard author={settings?.author ?? ''} tutorName={settings?.tutorName ?? ''} />
       </div>
-    </>
+    </PageLayout>
   )
 }