@stack-spot/ai-chat-widget 1.0.0-dev.1771433237688 → 1.0.0-dev.1776445984345

package/src/components/FreemiumSensitiveDataInfo.tsx

@@ -0,0 +1,36 @@
+import { Column, Icon, Link, Row, Text } from '@stack-spot/citric-react'
+import { useTranslate } from '@stack-spot/portal-translate'
+import { checkIsTrial } from '../utils/check-is-trial'
+
+export const FreemiumSensitiveDataInfo = () => {
+  const isTrial = checkIsTrial()
+  const t = useTranslate(dictionary)
+  if (!isTrial) return
+
+  return (
+    <Row gap={8} pb={3} pt={3} w="100%" justifyContent="center" alignItems="center">
+      <Column>
+        <Icon icon="InfoCircle" color="light.700" />
+      </Column>
+      <div>
+        <Text style={{ lineHeight: '14px', marginRight: '2px' }} color="light.700" appearance="microtext1">{t.information}</Text>
+        <Link target="_blank" color="light.700" style={{ lineHeight: '14px' }} appearance="microtext1" href={t.policiesLink}>
+          {t.seePolices}
+        </Link>
+      </div>
+    </Row>
+  )
+}
+
+const dictionary = {
+  en: {
+    information: 'For personal use only. Avoid entering corporate or sensitive data.',
+    seePolices: 'View Terms and Conditions',
+    policiesLink: 'https://stackspot.com/en/stackspot-terms-and-conditions-ai',
+  },
+  pt: {
+    information: 'Conta para uso pessoal. Evite inserir dados corporativos ou sensíveis.',
+    seePolices: 'Ver Termos e Condições',
+    policiesLink: 'https://stackspot.com/pt/termos-e-condicoes-da-plataforma-stackspot-ai',
+  },
+} as const

package/src/components/Selector/styled.ts

@@ -111,6 +111,10 @@ export const SelectorBox = styled.div<{ $tabsCount: number }>`
       overflow-y: auto;
       flex: 1;
 
+      .infinite-scroll-component, .infinite-scroll-component__outerdiv {
+        min-height: 272px;
+      }
+
       li {
         display: flex;
         flex-direction: row;

package/src/components/form/DescribedRadioGroup.tsx

@@ -55,7 +55,7 @@ export function DescribedRadioGroup<T>({ initialValue, options: opt, data, empty
 
   useEffect(() => {
     if (!isEqual(opt, options)) {
-      setOptions(opt)
+      setOptions([...opt])
     }
   }, [opt])
 
@@ -93,12 +93,10 @@ export function DescribedRadioGroup<T>({ initialValue, options: opt, data, empty
                         listFavorites,
                         onAddFavorite: async (...args) => {
                           const res = await onAddFavorite(...args)
-                          setOptions([...options]) // forces options re-rendering
                           return res
                         },
                         onRemoveFavorite: async (...args) => {
                           const res = await onRemoveFavorite?.(...args)
-                          setOptions([...options]) // forces options re-rendering
                           return res ?? false
                         },
                       }} />}

package/src/views/MessageInput/ModelSwitcher/index.tsx

@@ -2,8 +2,7 @@ import { CitricIconOutline, CitricIconSocial } from '@stack-spot/citric-icons'
 import { Button, Column, FieldGroup, Icon, Input, ProgressCircular, Row } from '@stack-spot/citric-react'
 import { SelectionList } from '@stack-spot/portal-components/SelectionList'
 import { agentToolsClient, genAiInferenceClient } from '@stack-spot/portal-network'
-import { useMemo, useState } from 'react'
-import { CSSProperties } from 'styled-components'
+import { CSSProperties, useMemo, useState } from 'react'
 import { useCurrentChat, useCurrentChatState } from '../../../context/hooks'
 import { useMessageInputDictionary } from '../dictionary'
 import { RowWrapperStyled, stylesModelSwitcher } from '../styled'

package/src/views/MessageInput/ModelSwitcher/utils.tsx

@@ -24,6 +24,26 @@ export const providerIcon: Record<string, CitricIconSocial | CitricIconOutline>
   anthropic: 'Anthropic',
 }
 
+
+const getModelsList = (agent?: AgentCoreWithSingleVersionResponse2, models?: PaginatedResponseLlmModelsResponse) => {
+  if (agent?.visibility_level === 'built_in') {
+    return models?.items 
+  }
+
+  if (agent?.version?.available_llm_models && agent?.version?.available_llm_models.length > 0) {
+    return models?.items.filter((model) => 
+      agent?.version?.available_llm_models?.find((modelAvailable) => modelAvailable.model_id === model.id))
+  }
+
+  if (agent?.version?.model_id) {
+    return models?.items.filter((model) => model.id === agent?.version?.model_id)
+  }
+
+  return models?.items.filter(model =>
+    model.resources.some(resource => resource.name === 'agents' && resource.is_default === true),
+  )
+}
+
 export function getListModelsData(
   chat: ChatState, 
   setVisibleMenu: Dispatch<React.SetStateAction<boolean>>, 
@@ -32,12 +52,11 @@ export function getListModelsData(
 
   const chatSelectedModelId = chat.get('selected_model_id')
   
-  const listModelsToShow = agent?.visibility_level !== 'built_in' && !!agent?.version?.model_id ? 
-    models?.items.filter((model) => agent?.version?.available_llm_models?.find((modelAvailable) => modelAvailable.model_id === model.id)) : 
-    models?.items
+  const listModelsToShow = getModelsList(agent, models)
 
   const modelAvailableDefault = agent?.version?.available_llm_models?.find((model) => 
     (model.is_default || model.model_id === agent.version?.model_id))
+
   const modelListData = parseModelList(chat, setVisibleMenu, listModelsToShow, modelAvailableDefault?.model_id)
   
   if (agent?.visibility_level === 'built_in' || !agent?.version?.model_id) {