InvokeAI/invokeai/frontend/web/src/features/controlLayers/hooks/useEntityTitle.ts

import { createSelector } from '@reduxjs/toolkit';
import { useAppSelector } from 'app/store/storeHooks';
import { selectCanvasSlice, selectEntity } from 'features/controlLayers/store/selectors';
import type { CanvasEntityIdentifier } from 'features/controlLayers/store/types';
import { useMemo } from 'react';
import { useTranslation } from 'react-i18next';
import { assert } from 'tsafe';

const createSelectName = (entityIdentifier: CanvasEntityIdentifier) =>
  createSelector(selectCanvasSlice, (canvas) => {
    const entity = selectEntity(canvas, entityIdentifier);
    if (!entity) {
      return null;
    }
    return entity.name;
  });

export const useEntityTitle = (entityIdentifier: CanvasEntityIdentifier) => {
  const { t } = useTranslation();
  const selectName = useMemo(() => createSelectName(entityIdentifier), [entityIdentifier]);
  const name = useAppSelector(selectName);

  const title = useMemo(() => {
    if (name) {
      return name;
    }

    switch (entityIdentifier.type) {
      case 'inpaint_mask':
        return t('controlLayers.inpaintMask');
      case 'control_layer':
        return t('controlLayers.controlLayer');
      case 'raster_layer':
        return t('controlLayers.rasterLayer');
      case 'reference_image':
        return t('controlLayers.globalReferenceImage');
      case 'regional_guidance':
        return t('controlLayers.regionalGuidance');
      default:
        assert(false, 'Unexpected entity type');
    }
  }, [entityIdentifier.type, name, t]);

  return title;
};