@tellescope/react-components 1.188.0 → 1.189.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tellescope/react-components",
-  "version": "1.188.0",
+  "version": "1.189.0",
   "description": "",
   "main": "./lib/cjs/index.js",
   "module": "./lib/esm/index.js",
@@ -47,13 +47,13 @@
     "@reduxjs/toolkit": "^1.6.2",
     "@stripe/react-stripe-js": "^2.9.0",
     "@stripe/stripe-js": "^1.52.1",
-    "@tellescope/constants": "^1.188.0",
-    "@tellescope/sdk": "^1.188.0",
-    "@tellescope/types-client": "^1.188.0",
-    "@tellescope/types-models": "^1.188.0",
-    "@tellescope/types-utilities": "^1.188.0",
-    "@tellescope/utilities": "^1.188.0",
-    "@tellescope/validation": "^1.188.0",
+    "@tellescope/constants": "^1.189.0",
+    "@tellescope/sdk": "^1.189.0",
+    "@tellescope/types-client": "^1.189.0",
+    "@tellescope/types-models": "^1.189.0",
+    "@tellescope/types-utilities": "^1.189.0",
+    "@tellescope/utilities": "^1.189.0",
+    "@tellescope/validation": "^1.189.0",
     "@typescript-eslint/eslint-plugin": "^4.33.0",
     "@typescript-eslint/parser": "^4.33.0",
     "css-to-react-native": "^3.0.0",
@@ -84,7 +84,7 @@
     "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0",
     "react-native": "^0.65.0 || ^0.66.0 || ^0.67.0 || ^0.68.0 || ^0.71.0"
   },
-  "gitHead": "53980cf431ca6a0961fe95d3e6ec24115e31c136",
+  "gitHead": "f7e7f3107237f5c850d62a6ec78b0d557ba2e71f",
   "publishConfig": {
     "access": "public"
   }

package/src/Forms/forms.tsx

@@ -322,7 +322,7 @@ export const QuestionForField = ({
           <Dropdown field={field} value={value.answer.value as any} onChange={onFieldChange as ChangeHandler<'Dropdown'>} form={form}/>
         )
         : field.type === 'Database Select' ? (
-          <DatabaseSelect field={field} value={value.answer.value as any} onChange={onFieldChange as ChangeHandler<'Database Select'>} 
+          <DatabaseSelect field={field} disabled={value.disabled} value={value.answer.value as any} onChange={onFieldChange as ChangeHandler<'Database Select'>} 
             onDatabaseSelect={handleDatabaseSelect}
             responses={responses} form={form}
           />

package/src/Forms/inputs.tsx

@@ -1899,7 +1899,7 @@ const get_other_answers = (_value?: DatabaseSelectResponse[], typing?: string) =
   return []
 }
 
-export const DatabaseSelectInput = ({ field, value: _value, onChange, onDatabaseSelect, responses, size }: FormInputProps<'Database Select'> & {
+export const DatabaseSelectInput = ({ field, value: _value, onChange, onDatabaseSelect, responses, size, disabled }: FormInputProps<'Database Select'> & {
   responses: FormResponseValue[],
 }) => {
   const [typing, setTyping] = useState('')
@@ -2003,6 +2003,7 @@ export const DatabaseSelectInput = ({ field, value: _value, onChange, onDatabase
           : label_for_database_record(field, o)
       )}
       value={value}
+      disabled={disabled}
       onChange={(_, v) => {
         if (v.length && onDatabaseSelect) {
           onDatabaseSelect(v)

package/src/inputs_shared.tsx

@@ -6,7 +6,7 @@ import { ALL_ACCESS, HEALTHIE_TITLE, UNSEARCHABLE_FIELDS } from "@tellescope/con
 import { SearchAPIProps, useSearchAPI } from "./hooks"
 import { TextFieldProps } from "./mui"
 import { AgentRecord, AllergyCode, AppointmentBookingPage, AppointmentLocation, AutomationTrigger, CalendarEventTemplate, CallHoldQueue, ChatRoom, Database, DatabaseRecord, DiagnosisCode, Enduser, EnduserOrder, FaxLog, File, Form, FormGroup, Forum, Journey, ManagedContentRecord, MessageTemplateSnippet, Organization, PrescriptionRoute, SuggestedContact, Template, Ticket, TicketQueue, User, UserNotification, Waitlist } from "@tellescope/types-client"
-import { Button, Checkbox, Flex, HoverPaper, LoadingButton, LoadingData, ScrollingList, SearchTextInput, Typography, useAgentRecords, useAllergyCodes, useAppointmentBookingPages, useAppointmentLocations, useAutomationTriggers, useCalendarEventTemplates, useCallHoldQueues, useChatRooms, useDatabaseRecords, useDatabases, useDiagnosisCodes, useEnduserOrders, useEndusers, useFaxLogs, useFiles, useFormGroups, useForms, useForums, useJourneys, useManagedContentRecords, useMessageTemplateSnippets, useNotifications, useOrganization, useOrganizations, usePrescriptionRoutes, useResolvedSession, useSession, useSuggestedContacts, useTemplates, useTicketQueues, useTickets, useUsers, useWaitlists, value_is_loaded } from "."
+import { Button, Checkbox, Flex, HoverPaper, LoadingButton, LoadingData, ScrollingList, SearchTextInput, Typography, useAgentRecords, useAllergyCodes, useAppointmentBookingPages, useAppointmentLocations, useAutomationTriggers, useCalendarEventTemplates, useCallHoldQueues, useChatRooms, useDatabaseRecords, useDatabases, useDiagnosisCodes, useEnduserCustomTypes, useEnduserOrders, useEndusers, useFaxLogs, useFiles, useFormGroups, useForms, useForums, useJourneys, useManagedContentRecords, useMessageTemplateSnippets, useNotifications, useOrganization, useOrganizations, usePrescriptionRoutes, useResolvedSession, useSession, useSuggestedContacts, useTemplates, useTicketQueues, useTickets, useUsers, useWaitlists, value_is_loaded } from "."
 import { SxProps } from "@mui/material"
 import { AccessPermissions, ListOfStringsWithQualifier } from "@tellescope/types-models"
 
@@ -1374,6 +1374,7 @@ export interface UserAndEnduserSelectorProps {
   limitToUsers?: User[],
   dontIncludeSelf: boolean,
   virtualizationHeight?: number,
+  showEntityType?: boolean,
 }
 export const UserAndEnduserSelector: React.JSXElementConstructor<UserAndEnduserSelectorProps> = ({
   titleInput,
@@ -1394,12 +1395,17 @@ export const UserAndEnduserSelector: React.JSXElementConstructor<UserAndEnduserS
   limitToUsers,
   dontIncludeSelf,
   virtualizationHeight,
+  showEntityType,
 }) => {
   const session = useResolvedSession()
   const [endusersLoading, { loadMore: loadMoreEndusers, doneLoading: doneLoadingEndusers }] = useEndusers()
   const [usersLoading, { loadMore: loadMoreUsers, doneLoading: doneLoadingUsers }] = useUsers({
     dontFetch: !!limitToUsers
   })
+  const [typesLoading] = useEnduserCustomTypes({ dontFetch: !showEntityType })
+  const entityTypes = useMemo(() => (
+    value_is_loaded(typesLoading) ? typesLoading.value : [] 
+  ),[typesLoading])
 
   const doneLoading = useCallback(() => 
     (excludeUsers || doneLoadingUsers()) && (excludeEndusers || doneLoadingEndusers()), 
@@ -1534,11 +1540,22 @@ export const UserAndEnduserSelector: React.JSXElementConstructor<UserAndEnduserS
             >
               <Checkbox checked={selected.includes(user.id)} />
 
-              <Typography style={{ 
-                fontWeight: selected.includes(user.id) ? 'bold' : undefined,
-              }}>
-                {user_display_name(user)}
-              </Typography>
+              <Flex flex={1} column alignItems="flex-end" justifyContent="center">
+                <Typography style={{ 
+                  fontWeight: selected.includes(user.id) ? 'bold' : undefined,
+                }}>
+                  {user_display_name(user)}
+                </Typography>
+
+                {showEntityType && (user as Enduser).customTypeId &&
+                  <Typography style={{ 
+                    fontWeight: selected.includes(user.id) ? 'bold' : undefined,
+                    fontSize: 12.5,
+                  }}>
+                    {entityTypes.find(t => t.id === (user as Enduser).customTypeId)?.title}
+                  </Typography> 
+                }
+              </Flex>
             </Flex>
             </HoverPaper>
           )}