@opensumi/ide-debug 2.24.6-next-1686045771.0 → 2.24.6

package/src/browser/preferences/launch.view.tsx

@@ -1,494 +0,0 @@
-import { IChangeEvent, withTheme } from '@rjsf/core';
-import { GenericObjectType, RJSFSchema, StrictRJSFSchema, SubmitButtonProps } from '@rjsf/utils';
-import validator from '@rjsf/validator-ajv8';
-import cls from 'classnames';
-import lodashGet from 'lodash/get';
-import throttle from 'lodash/throttle';
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
-import AutoSizer from 'react-virtualized-auto-sizer';
-
-import { Button, ComponentContextProvider, RecycleList } from '@opensumi/ide-components';
-import {
-  localize,
-  getIcon,
-  useInjectable,
-  IJSONSchemaRegistry,
-  ISchemaContributions,
-  IJSONSchema,
-  IJSONSchemaSnippet,
-  IJSONSchemaMap,
-  isUndefined,
-  Disposable,
-  Schemes,
-  CommandService,
-  isObject,
-} from '@opensumi/ide-core-browser';
-import { EDITOR_COMMANDS } from '@opensumi/ide-core-browser';
-import { EDirection, SplitPanel } from '@opensumi/ide-core-browser/lib/components';
-import { MenuActionList } from '@opensumi/ide-core-browser/lib/components/actions/index';
-import { LabelMenuItemNode } from '@opensumi/ide-core-browser/lib/menu/next/menu.interface';
-import { acquireAjv } from '@opensumi/ide-core-browser/lib/utils/schema';
-import { ReactEditorComponent } from '@opensumi/ide-editor/lib/browser/index';
-
-import { DebugConfiguration } from '../../common/debug-configuration';
-import { launchExtensionSchemaUri } from '../../common/debug-schema';
-import { ILaunchService } from '../../common/debug-service';
-import { DebugConfigurationManager } from '../debug-configuration-manager';
-import { parseSnippet } from '../debugUtils';
-
-import { CheckboxWidget } from './components/checkbox-widget';
-import { AnyOfField } from './components/fields/any-of-field';
-import { ArrayField } from './components/fields/array-field';
-import { ObjectField } from './components/fields/object-filed';
-import { TitleField } from './components/fields/title-field';
-import { SelectWidget } from './components/select-widget';
-import { TextWidget } from './components/text-widget';
-import styles from './launch.module.less';
-import { LaunchService } from './launch.service';
-import { ConfigurationItemsModel } from './model/configuration-items';
-import { WrapIfAdditionalTemplate } from './templates/additional-template';
-import { ArrayFieldItemTemplate } from './templates/array-field-item-template';
-import { ArrayFieldTemplate } from './templates/array-field-template';
-import { BaseInputTemplate } from './templates/base-input-template';
-import {
-  MoveUpButton,
-  MoveDownButton,
-  RemoveButton,
-  AddItemButton,
-  AddButton,
-  CopyButton,
-} from './templates/button-template';
-import { DescriptionFieldTemplate } from './templates/description-field-template';
-import { FieldTemplate } from './templates/field-template';
-import { ObjectFieldTemplate } from './templates/object-field-template';
-
-export const LaunchViewContainer: ReactEditorComponent<any> = ({ resource }) => {
-  const { uri } = resource;
-  const schemaRegistry = useInjectable<IJSONSchemaRegistry>(IJSONSchemaRegistry);
-  const debugConfigurationManager = useInjectable<DebugConfigurationManager>(DebugConfigurationManager);
-  const launchService = useInjectable<LaunchService>(ILaunchService);
-  const commandService = useInjectable<CommandService>(CommandService);
-
-  const [currentConfigurationIndex, serCurrentConfigurationIndex] = useState<number>();
-  const [schemaContributions, setSchemaContributions] = useState<IJSONSchema>();
-  const [inputConfigurationItems, setInputConfigurationItems] = useState<ConfigurationItemsModel[]>([]);
-
-  useEffect(() => {
-    const disposed = new Disposable();
-
-    disposed.addDispose(
-      schemaRegistry.onDidChangeSchema((uri: string) => {
-        if (uri === launchExtensionSchemaUri) {
-          handleSchemaSnippets(schemaRegistry.getSchemaContributions());
-        }
-      }),
-    );
-
-    disposed.addDispose(
-      debugConfigurationManager.onDidChange(async () => {
-        handleInputConfigurationItems();
-      }),
-    );
-
-    handleSchemaSnippets(schemaRegistry.getSchemaContributions());
-    handleInputConfigurationItems();
-
-    return () => disposed.dispose();
-  }, []);
-
-  const fileUri = useMemo(() => uri.withScheme(Schemes.file), [uri]);
-
-  const handleSchemaSnippets = useCallback(
-    (contributions: ISchemaContributions) => {
-      const launchExtension = contributions.schemas[launchExtensionSchemaUri];
-
-      if (!launchExtension) {
-        return;
-      }
-
-      setSchemaContributions(launchExtension);
-    },
-    [schemaContributions],
-  );
-
-  const handleInputConfigurationItems = useCallback(() => {
-    const all = debugConfigurationManager.all;
-    if (!Array.isArray(all)) {
-      return;
-    }
-
-    setInputConfigurationItems(
-      all.map((config) => new ConfigurationItemsModel(config.configuration.name, config.configuration)),
-    );
-  }, []);
-
-  const snippetItems = useMemo(() => {
-    if (!schemaContributions) {
-      return [];
-    }
-
-    const snippets: IJSONSchemaSnippet[] = lodashGet(schemaContributions, [
-      'properties',
-      'configurations',
-      'items',
-      'defaultSnippets',
-    ] as (keyof IJSONSchema)[]);
-    return snippets || [];
-  }, [schemaContributions]);
-
-  const onSelectedConfiguration = useCallback((current: ConfigurationItemsModel, index: number) => {
-    const { configuration } = current;
-    if (!configuration) {
-      return;
-    }
-
-    launchService.nextNewFormData(configuration, false);
-
-    serCurrentConfigurationIndex(index);
-  }, []);
-
-  const currentSnippetItem = useMemo(() => {
-    if (inputConfigurationItems && !isUndefined(currentConfigurationIndex)) {
-      const current = inputConfigurationItems[currentConfigurationIndex];
-      if (!current) {
-        return undefined;
-      }
-
-      const { configuration, description, label } = current;
-      if (!configuration) {
-        return;
-      }
-
-      return {
-        body: configuration,
-        description,
-        label,
-      };
-    }
-    return undefined;
-  }, [inputConfigurationItems, currentConfigurationIndex]);
-
-  const onAddConfigurationItems = useCallback(
-    async (newItems: ConfigurationItemsModel) => {
-      const { configuration } = newItems;
-      await debugConfigurationManager.insertConfiguration(fileUri, configuration);
-      commandService.executeCommand(EDITOR_COMMANDS.SAVE_URI.id, fileUri);
-    },
-    [snippetItems],
-  );
-
-  const scheduleUpdateConfigurationsInResource = throttle(
-    async (data, currentConfigurationIndex) =>
-      await launchService.modifyConfigurationsInResource(fileUri, data, currentConfigurationIndex),
-    100,
-  );
-
-  const onFormChange = useCallback(
-    async (data: IChangeEvent) => {
-      const { formData } = data;
-      if (!formData || isUndefined(currentConfigurationIndex)) {
-        return;
-      }
-
-      scheduleUpdateConfigurationsInResource(data, currentConfigurationIndex);
-    },
-    [currentConfigurationIndex, currentSnippetItem],
-  );
-
-  return (
-    <ComponentContextProvider value={{ getIcon, localize }}>
-      <div className={styles.launch_container}>
-        <SplitPanel
-          id='launch-container'
-          resizeHandleClassName={styles.devider}
-          className={styles.launch_panel}
-          direction={EDirection.LeftToRight}
-        >
-          <LaunchIndexs
-            data-sp-defaultSize={240}
-            data-sp-minSize={150}
-            inputConfigurationItems={inputConfigurationItems}
-            snippetItems={snippetItems}
-            onSelectedConfiguration={onSelectedConfiguration}
-            onAddConfigurationItems={onAddConfigurationItems}
-            currentConfigurationIndex={currentConfigurationIndex}
-          />
-          <LaunchBody
-            data-sp-flex={1}
-            snippetItem={currentSnippetItem}
-            schemaContributions={schemaContributions}
-            onChange={onFormChange}
-          />
-        </SplitPanel>
-      </div>
-    </ComponentContextProvider>
-  );
-};
-
-const LaunchIndexs = ({
-  snippetItems,
-  onSelectedConfiguration,
-  onAddConfigurationItems,
-  inputConfigurationItems,
-  currentConfigurationIndex,
-}: {
-  snippetItems: IJSONSchemaSnippet[];
-  onSelectedConfiguration: (data: ConfigurationItemsModel, index: number) => void;
-  onAddConfigurationItems: (data: ConfigurationItemsModel) => void;
-  inputConfigurationItems: ConfigurationItemsModel[];
-  currentConfigurationIndex: number | undefined;
-}) => {
-  const [menuOpen, setMenuOpen] = React.useState<boolean>(false);
-  const [configurationItems, setConfigurationItems] = useState<ConfigurationItemsModel[]>(inputConfigurationItems);
-
-  useEffect(() => {
-    setConfigurationItems([...inputConfigurationItems]);
-  }, [inputConfigurationItems]);
-
-  const handleConfigurationItemsClick = useCallback((data: ConfigurationItemsModel, index: number) => {
-    onSelectedConfiguration(data, index);
-  }, []);
-
-  const template = ({ data, index }) => (
-    <div
-      key={index}
-      className={cls(styles.configuration_item, currentConfigurationIndex === index ? styles.selected : '')}
-      onClick={() => handleConfigurationItemsClick(data, index)}
-    >
-      <div className={styles.configuration_wrapper}>
-        <span className={styles.configuration_description}>{(data as ConfigurationItemsModel).label}</span>
-      </div>
-    </div>
-  );
-
-  const handleMenuItemClick = useCallback(
-    (item: LabelMenuItemNode) => {
-      setMenuOpen(false);
-
-      const { label } = item;
-      const findItem = snippetItems.find((snippet) => snippet.label === label);
-      if (!findItem) {
-        return;
-      }
-
-      const { body } = findItem;
-      if (!isObject(body)) {
-        return;
-      }
-
-      // 将 body 里一些形如 ${1:xxxx} 这样的符号给过滤掉
-      const parseBody: DebugConfiguration = Object.keys(body).reduce((pre: DebugConfiguration, cur: string) => {
-        const curValue = body[cur];
-
-        if (typeof curValue === 'string') {
-          pre[cur] = parseSnippet(curValue);
-        } else if (Array.isArray(curValue)) {
-          pre[cur] = curValue.map((value: any) => {
-            if (typeof value == 'string') {
-              return parseSnippet(value);
-            }
-            return value;
-          });
-        }
-
-        return pre;
-      }, body);
-
-      const itemModel = new ConfigurationItemsModel(findItem.label!, parseBody);
-      itemModel.setDescription(findItem.description || '');
-
-      onAddConfigurationItems(itemModel);
-    },
-    [configurationItems, snippetItems],
-  );
-
-  const handleVisibleChange = (visible: boolean) => {
-    setMenuOpen(visible);
-  };
-
-  const snippetMenu = useMemo(
-    () => (
-      <MenuActionList
-        data={snippetItems.map((item) => new LabelMenuItemNode(item.label!))}
-        afterClick={(item: LabelMenuItemNode) => handleMenuItemClick(item)}
-      />
-    ),
-    [snippetItems, configurationItems],
-  );
-
-  return (
-    <div className={styles.launch_indexes_container}>
-      <AutoSizer className={styles.configuration_items_box}>
-        {({ width, height }) =>
-          configurationItems.length === 0 ? (
-            <div style={{ width }} className={styles.not_configuration_content}>
-              {localize('debug.action.no.configuration')}
-            </div>
-          ) : (
-            <RecycleList width={width} height={height} data={configurationItems} template={template} />
-          )
-        }
-      </AutoSizer>
-      <div className={styles.foot_box}>
-        <Button
-          className={styles.button}
-          placement={'topCenter'}
-          menu={snippetMenu}
-          moreVisible={menuOpen}
-          onVisibleChange={handleVisibleChange}
-        >
-          {localize('debug.action.add.configuration')}
-        </Button>
-      </div>
-    </div>
-  );
-};
-
-const Form = withTheme({
-  widgets: {
-    TextWidget,
-    SelectWidget,
-    CheckboxWidget,
-  },
-  fields: {
-    ObjectField,
-  },
-});
-
-const LaunchBody = ({
-  snippetItem,
-  schemaContributions,
-  onChange,
-}: {
-  snippetItem?: IJSONSchemaSnippet;
-  schemaContributions?: IJSONSchema;
-  onChange: (data: IChangeEvent, id?: string) => void;
-}) => {
-  if (!snippetItem) {
-    return <div className={styles.no_onfiguration}>{localize('debug.action.no.configuration')}</div>;
-  }
-
-  const launchService = useInjectable<LaunchService>(ILaunchService);
-
-  const schemaProperties: IJSONSchema | undefined = useMemo(() => {
-    const ajv = acquireAjv();
-    // 1. 先从 schema 中找出 oneOf 池
-    const oneOfPool: IJSONSchema[] =
-      lodashGet(schemaContributions, ['properties', 'configurations', 'items', 'oneOf'] as (keyof IJSONSchema)[]) || [];
-
-    // 2. 再从 snippetItem body 中找出符合条件的 oneOf（可能存在多个，如果有多个就只取第一个）
-    const findOneOf = oneOfPool.find((oneOf) => {
-      const { body } = snippetItem;
-      return ajv!.validate(oneOf, body);
-    });
-
-    if (findOneOf) {
-      launchService.setRawSchemaProperties(findOneOf);
-      return findOneOf;
-    }
-
-    return;
-  }, [snippetItem, schemaContributions]);
-
-  const schema: RJSFSchema | undefined = useMemo(() => {
-    if (!(schemaProperties && schemaProperties.properties)) {
-      return;
-    }
-
-    const { label, body, description } = snippetItem;
-    const { properties, required } = schemaProperties;
-
-    const snippetProperties = Object.keys(body).reduce((pre: IJSONSchemaMap, cur: string) => {
-      const curProp = properties![cur];
-
-      if (curProp?.type === 'array' && isUndefined(curProp?.items)) {
-        curProp.items = { type: 'string' };
-      }
-
-      // 如果 type 是数组，则取第一个
-      if (Array.isArray(curProp?.type)) {
-        curProp.type = curProp.type![0] || 'string';
-      }
-
-      // 去掉 anyof 中的空对象
-      if (Array.isArray(curProp?.anyOf)) {
-        curProp.anyOf = curProp.anyOf.filter((c) => Object.keys(c).length > 0);
-      }
-
-      // 如果 type 是 object 且存在 additionalProperties 时，固定将其设置为 additionalProperties: { type: 'string' }
-      if (curProp?.type === 'object' && !isUndefined(curProp?.additionalProperties)) {
-        curProp.additionalProperties = { type: 'string' };
-      }
-
-      // 将 markdownDescription 赋给 description
-      if (!curProp?.description && curProp?.markdownDescription) {
-        curProp.description = curProp.markdownDescription;
-      }
-
-      pre[cur] = curProp;
-      return pre;
-    }, {});
-
-    const schema = {
-      title: label,
-      type: 'object',
-      required,
-      description,
-      properties: snippetProperties,
-    } as StrictRJSFSchema;
-
-    launchService.nextNewSchema(schema);
-
-    return schema;
-  }, [snippetItem, schemaProperties]);
-
-  const hanldeAddItem = useCallback(
-    (item: LabelMenuItemNode) => {
-      if (!(schemaProperties && schemaProperties.properties)) {
-        return;
-      }
-
-      if (!(schema && schema.properties)) {
-        return;
-      }
-
-      const { label } = item;
-      launchService.addNewItem(label);
-    },
-    [snippetItem, schemaProperties, schema],
-  );
-
-  return (
-    <div className={styles.launch_schema_body_container}>
-      {schema && schemaProperties && (
-        <Form
-          formData={snippetItem.body}
-          schema={schema}
-          validator={validator}
-          fields={{ AnyOfField, OneOfField: AnyOfField, ArrayField }}
-          onChange={onChange}
-          templates={{
-            ArrayFieldTemplate,
-            ArrayFieldItemTemplate,
-            DescriptionFieldTemplate,
-            FieldTemplate,
-            ObjectFieldTemplate,
-            WrapIfAdditionalTemplate,
-            BaseInputTemplate,
-            TitleFieldTemplate: TitleField,
-            ButtonTemplates: {
-              MoveUpButton,
-              MoveDownButton,
-              RemoveButton,
-              SubmitButton: (
-                props: React.PropsWithChildren<SubmitButtonProps<unknown, RJSFSchema, GenericObjectType>>,
-              ) => <AddItemButton {...props} onAddClick={hanldeAddItem}></AddItemButton>,
-              AddButton,
-              CopyButton,
-            },
-          }}
-        />
-      )}
-    </div>
-  );
-};

package/src/browser/preferences/model/configuration-items.ts

@@ -1,24 +0,0 @@
-import { uuid } from '@opensumi/ide-core-common';
-
-import { DebugConfiguration } from '../../../common';
-
-export class ConfigurationItemsModel {
-  private _uniqueID: string;
-  private _description: string;
-
-  public get uniqueID(): string {
-    return this._uniqueID;
-  }
-
-  public get description(): string {
-    return this._description;
-  }
-
-  constructor(readonly label: string, readonly configuration: DebugConfiguration) {
-    this._uniqueID = uuid(6);
-  }
-
-  public setDescription(data: string): void {
-    this._description = data;
-  }
-}

package/src/browser/preferences/templates/additional-template.tsx

@@ -1,77 +0,0 @@
-import {
-  ADDITIONAL_PROPERTY_FLAG,
-  FormContextType,
-  RJSFSchema,
-  StrictRJSFSchema,
-  WrapIfAdditionalTemplateProps,
-} from '@rjsf/utils';
-import React, { FocusEvent, useCallback } from 'react';
-
-import { Input } from '@opensumi/ide-components';
-import { formatLocalize } from '@opensumi/ide-core-common';
-
-import styles from './json-templates.module.less';
-
-export const WrapIfAdditionalTemplate = <
-  T = any,
-  S extends StrictRJSFSchema = RJSFSchema,
-  F extends FormContextType = any,
->(
-  props: WrapIfAdditionalTemplateProps<T, S, F>,
-) => {
-  const {
-    children,
-    classNames,
-    style,
-    disabled,
-    id,
-    label,
-    onKeyChange,
-    onDropPropertyClick,
-    readonly,
-    registry,
-    schema,
-  } = props;
-  const { readonlyAsDisabled = true } = registry.formContext;
-  const { templates } = registry;
-  const { RemoveButton } = templates.ButtonTemplates;
-  // 如果是用户手动添加 property 则存在该标识
-  const isPropertyFlag = ADDITIONAL_PROPERTY_FLAG in schema;
-
-  if (!isPropertyFlag) {
-    return (
-      <div className={classNames} style={style}>
-        {children}
-      </div>
-    );
-  }
-
-  const handleBlur = useCallback(
-    ({ target }: FocusEvent<HTMLInputElement>) => onKeyChange(target.value),
-    [onKeyChange],
-  );
-
-  return (
-    <div className={classNames} style={style}>
-      <div className={styles.additional_field_template}>
-        <div className={styles.form_additional_container}>
-          <div className={styles.form_additional}>
-            <Input
-              className={styles.form_control}
-              defaultValue={label}
-              value={label}
-              placeholder={formatLocalize('debug.launch.view.template.input.placeholder', 'Key')}
-              disabled={disabled || (readonlyAsDisabled && readonly)}
-              id={`${id}-key`}
-              name={`${id}-key`}
-              onBlur={!readonly ? handleBlur : undefined}
-              type='text'
-            />
-          </div>
-          <div className={styles.form_additional_children}>{children}</div>
-          <RemoveButton disabled={disabled || readonly} onClick={onDropPropertyClick(label)} registry={registry} />
-        </div>
-      </div>
-    </div>
-  );
-};

package/src/browser/preferences/templates/array-field-item-template.tsx

@@ -1,90 +0,0 @@
-import {
-  ArrayFieldTemplateItemType,
-  FieldTemplateProps,
-  FormContextType,
-  RJSFSchema,
-  StrictRJSFSchema,
-} from '@rjsf/utils';
-import cls from 'classnames';
-import React, { Fragment, useMemo } from 'react';
-
-import styles from './json-templates.module.less';
-
-const BTN_GRP_STYLE = {
-  width: '100%',
-};
-
-const BTN_STYLE = {
-  width: 'calc(100% / 4)',
-};
-
-export const ArrayFieldItemTemplate = <
-  T = any,
-  S extends StrictRJSFSchema = RJSFSchema,
-  F extends FormContextType = any,
->(
-  props: ArrayFieldTemplateItemType<T, S, F>,
-) => {
-  const {
-    className,
-    children,
-    disabled,
-    hasCopy,
-    hasMoveDown,
-    hasMoveUp,
-    hasRemove,
-    hasToolbar,
-    index,
-    onCopyIndexClick,
-    onDropIndexClick,
-    onReorderClick,
-    readonly,
-    registry,
-  } = props;
-  const { CopyButton, MoveDownButton, MoveUpButton, RemoveButton } = registry.templates.ButtonTemplates;
-
-  const onCopyClick = useMemo(() => onCopyIndexClick(index), [index, onCopyIndexClick]);
-  const onRemoveClick = useMemo(() => onDropIndexClick(index), [index, onDropIndexClick]);
-  const onArrowUpClick = useMemo(() => onReorderClick(index, index - 1), [index, onReorderClick]);
-  const onArrowDownClick = useMemo(() => onReorderClick(index, index + 1), [index, onReorderClick]);
-
-  return (
-    <div key={`array-item-${index}`} className={cls(className, styles.array_field_item_template)}>
-      <div className={styles.control_field}>{React.cloneElement(children, { name: '' })}</div>
-
-      {hasToolbar && (
-        <div className={styles.toolbar}>
-          <div style={BTN_GRP_STYLE}>
-            {(hasMoveUp || hasMoveDown) && (
-              <MoveUpButton
-                disabled={disabled || readonly || !hasMoveUp}
-                onClick={onArrowUpClick}
-                style={BTN_STYLE}
-                registry={registry}
-              />
-            )}
-            {(hasMoveUp || hasMoveDown) && (
-              <MoveDownButton
-                disabled={disabled || readonly || !hasMoveDown}
-                onClick={onArrowDownClick}
-                style={BTN_STYLE}
-                registry={registry}
-              />
-            )}
-            {hasCopy && (
-              <CopyButton disabled={disabled || readonly} onClick={onCopyClick} style={BTN_STYLE} registry={registry} />
-            )}
-            {hasRemove && (
-              <RemoveButton
-                disabled={disabled || readonly}
-                onClick={onRemoveClick}
-                style={BTN_STYLE}
-                registry={registry}
-              />
-            )}
-          </div>
-        </div>
-      )}
-    </div>
-  );
-};