feat(ui): fix tooltips for custom types

We need to hold onto the original type of the field so they don't all just show up as "Unknown".

invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/fields/FieldHandle.tsx

@@ -47,8 +47,8 @@ const FieldHandle = (props: FieldHandleProps) => {
     isConnectionStartField,
     connectionError,
   } = props;
-  const { name, type } = fieldTemplate;
-  const { color: typeColor, title } = FIELDS[type];
+  const { name, type, originalType } = fieldTemplate;
+  const { color: typeColor } = FIELDS[type];
 
   const styles: CSSProperties = useMemo(() => {
     const isCollectionType = COLLECTION_TYPES.includes(type);
@@ -102,13 +102,18 @@ const FieldHandle = (props: FieldHandleProps) => {
 
   const tooltip = useMemo(() => {
     if (isConnectionInProgress && isConnectionStartField) {
-      return title;
+      return originalType;
     }
     if (isConnectionInProgress && connectionError) {
-      return connectionError ?? title;
+      return connectionError ?? originalType;
     }
-    return title;
-  }, [connectionError, isConnectionInProgress, isConnectionStartField, title]);
+    return originalType;
+  }, [
+    connectionError,
+    isConnectionInProgress,
+    isConnectionStartField,
+    originalType,
+  ]);
 
   return (
     <Tooltip

invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/fields/FieldTooltipContent.tsx

@@ -1,15 +1,13 @@
 import { Flex, Text } from '@chakra-ui/react';
 import { useFieldData } from 'features/nodes/hooks/useFieldData';
 import { useFieldTemplate } from 'features/nodes/hooks/useFieldTemplate';
-import { FIELDS } from 'features/nodes/types/constants';
 import {
   isInputFieldTemplate,
   isInputFieldValue,
 } from 'features/nodes/types/types';
 import { startCase } from 'lodash-es';
 import { memo, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
-
 interface Props {
   nodeId: string;
   fieldName: string;
@@ -49,7 +47,7 @@ const FieldTooltipContent = ({ nodeId, fieldName, kind }: Props) => {
           {fieldTemplate.description}
         </Text>
       )}
-      {fieldTemplate && <Text>Type: {FIELDS[fieldTemplate.type].title}</Text>}
+      {fieldTemplate && <Text>Type: {fieldTemplate.originalType}</Text>}
       {isInputTemplate && <Text>Input: {startCase(fieldTemplate.input)}</Text>}
     </Flex>
   );

invokeai/frontend/web/src/features/nodes/types/types.ts

@@ -191,6 +191,7 @@ export type OutputFieldTemplate = {
   type: FieldType;
   title: string;
   description: string;
+  originalType: string; // used for custom types
 } & _OutputField;
 
 export const zInputFieldValueBase = zFieldValueBase.extend({
@@ -863,6 +864,7 @@ export type InputFieldTemplateBase = {
   description: string;
   required: boolean;
   fieldKind: 'input';
+  originalType: string; // used for custom types
 } & _InputField;
 
 export type AnyInputFieldTemplate = InputFieldTemplateBase & {

invokeai/frontend/web/src/features/nodes/util/fieldTemplateBuilders.ts

@@ -1170,7 +1170,8 @@ export const buildInputFieldTemplate = (
   nodeSchema: InvocationSchemaObject,
   fieldSchema: InvocationFieldSchema,
   name: string,
-  fieldType: FieldType
+  fieldType: FieldType,
+  originalType: string
 ) => {
   const {
     input,
@@ -1192,6 +1193,7 @@ export const buildInputFieldTemplate = (
     ui_order,
     ui_choice_labels,
     item_default,
+    originalType,
   };
 
   const baseField = {

invokeai/frontend/web/src/features/nodes/util/parseSchema.ts

@@ -119,6 +119,9 @@ export const parseSchema = (
           return inputsAccumulator;
         }
 
+        // stash this for custom types
+        const originalType = fieldType;
+
         if (fieldType === 'WorkflowField') {
           withWorkflow = true;
           return inputsAccumulator;
@@ -154,7 +157,8 @@ export const parseSchema = (
           schema,
           property,
           propertyName,
-          fieldType as FieldType // we have already checked that fieldType is a valid FieldType, and forced it to be Unknown if not
+          fieldType as FieldType, // we have already checked that fieldType is a valid FieldType, and forced it to be Unknown if not
+          originalType
         );
 
         if (!field) {
@@ -223,6 +227,22 @@ export const parseSchema = (
 
         let fieldType = property.ui_type ?? getFieldType(property);
 
+        if (!fieldType) {
+          logger('nodes').warn(
+            {
+              node: type,
+              fieldName: propertyName,
+              fieldType,
+              field: parseify(property),
+            },
+            'Missing output field type'
+          );
+          return outputsAccumulator;
+        }
+
+        // stash for custom types
+        const originalType = fieldType;
+
         if (!isFieldType(fieldType)) {
           logger('nodes').debug(
             { fieldName: propertyName, fieldType, field: parseify(property) },
@@ -241,6 +261,7 @@ export const parseSchema = (
           ui_hidden: property.ui_hidden ?? false,
           ui_type: property.ui_type,
           ui_order: property.ui_order,
+          originalType,
         };
 
         return outputsAccumulator;