Function Header

agent-flow/src/components/Header.jsx:27–180

({shape, data, shapeStatus})

 * @constructor
 */
export const Header = ({shape, data, shapeStatus}) => {
  const {t} = useTranslation();
  const [edit, setEdit] = useState(false);
  const [isAdvancedConfigurationOpen, setAdvancedConfigurationOpen] = useState(false);
  const inputRef = useRef(null);
  const dispatch = useDispatch();

  useEffect(() => {
    inputRef.current && inputRef.current.focus({
      cursor: 'end',
    });
  });

  const onInputBlur = () => {
    if (inputRef.current.input.value === '') {
      return;
    }
    if (shape.page.sm.getShapes(s => s.id !== shape.id).some(s => s.text === inputRef.current.input.value)) {
      message.error(t('nodeTextDuplicate'));
      return;
    }
    shape.text = inputRef.current.input.value;
    shape.page.triggerEvent({
      type: EVENT_NAME.NODE_NAME_CHANGED,
      value: {
        id: shape.id,
        name: shape.text,
      },
    });
    setEdit(false);
  };

  /**
   * menu点击事件.
   *
   * @param e 事件对象.
   */
  const onMenuClick = (e) => {
    const m = shape.drawer.getToolMenus().find(t => t.key === e.key);
    if (m.action) {
      if (e.key === 'rename') {
        m.action(setEdit);
      } else if (e.key === 'advancedConfiguration') {
        m.action(setAdvancedConfigurationOpen);
      } else {
        m.action();
      }
    }
  };

  /**
   * 获取文本组件，处于编辑态时，需要能修改标题；否则只展示标题.
   *
   * @return {JSX.Element} 标题组件.
   */
  const getTitle = () => {
    if (edit) {
      return (<>