feat: manually mirror opencoze's code from bytedance

Change-Id: I09a73aadda978ad9511264a756b2ce51f5761adf

frontend/packages/data/common/reporter/src/components/error-boundary/error-boundary.tsx

@@ -0,0 +1,62 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+import React, { type FC, type PropsWithChildren } from 'react';
+
+import { logger, ErrorBoundary } from '@coze-arch/logger';
+import { I18n } from '@coze-arch/i18n';
+import { IllustrationNoAccess } from '@douyinfe/semi-illustrations';
+
+import { type DataNamespace } from '../../constants';
+
+import s from './index.module.less';
+
+interface FallbackComponentProps {
+  namespace: DataNamespace;
+}
+export const ErrorFallbackComponent: FC<FallbackComponentProps> = ({
+  namespace,
+}) => (
+  <div className={s.wrapper}>
+    <div className={s.content}>
+      <IllustrationNoAccess width={140} height={140} />
+      <div className={s.title}>
+        {I18n.t('data_error_title', { module: namespace })}
+      </div>
+      <div className={s.paragraph}>{I18n.t('data_error_msg')}</div>
+    </div>
+  </div>
+);
+
+export interface DataErrorBoundaryProps {
+  namespace: DataNamespace;
+}
+export const DataErrorBoundary: FC<
+  PropsWithChildren<DataErrorBoundaryProps>
+> = ({ children, namespace }) => (
+  <ErrorBoundary
+    onError={error => {
+      logger.persist.error({
+        eventName: `${namespace}_error_boundary`,
+        error,
+      });
+    }}
+    errorBoundaryName={`${namespace}-error-boundary`}
+    FallbackComponent={() => <ErrorFallbackComponent namespace={namespace} />}
+  >
+    {children}
+  </ErrorBoundary>
+);

frontend/packages/data/common/reporter/src/components/error-boundary/index.module.less

@@ -0,0 +1,30 @@
+/* stylelint-disable declaration-no-important */
+.wrapper {
+  width: 100%;
+  height: 100%;
+}
+
+.content {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+
+  margin: auto;
+  padding-top: 35.39vh;
+}
+
+.title {
+  margin-top: 24px !important;
+  margin-bottom: 4px !important;
+
+  font-size: 16px !important;
+  font-weight: 600 !important;
+  line-height: 22px !important;
+}
+
+.paragraph {
+  margin-bottom: 24px !important;
+  font-size: 12px !important;
+  line-height: 16px !important;
+  color: #1d1c2399 !important;
+}

frontend/packages/data/common/reporter/src/constants.ts

@@ -0,0 +1,24 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+export enum DataNamespace {
+  KNOWLEDGE = 'knowledge',
+  DATABASE = 'database',
+  FILEBOX = 'filebox',
+  VARIABLE = 'variable',
+  TIMECAPSULE = 'timeCapsule',
+  MEMORY = 'memory',
+}

frontend/packages/data/common/reporter/src/index.ts

@@ -0,0 +1,24 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+export {
+  DataErrorBoundary,
+  ErrorFallbackComponent,
+  type DataErrorBoundaryProps,
+} from './components/error-boundary/error-boundary';
+
+export { DataNamespace } from './constants';
+export { dataReporter } from './reporter';

frontend/packages/data/common/reporter/src/reporter/data-reporter.ts

@@ -0,0 +1,78 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+import { get } from 'lodash-es';
+import type { ErrorEvent, CustomEvent } from '@coze-arch/logger';
+
+import { type DataNamespace } from '../constants';
+import { reporterFun } from './utils';
+
+enum ParamsIndex {
+  SPACE_ID = 1,
+  KNOWLEDGE_ID = 3,
+  DOCUMENT_ID = 5,
+}
+
+/**
+ * 与use-data-reporter区分使用
+ * use-data-reporter用于组件场景
+ * data-reporter用于ts/js场景
+ */
+class DataReporter {
+  /**
+   * 获取公共的meta信息
+   */
+  getMeta() {
+    const pathName = window.location.pathname;
+    const reg = /\/space\/(\d+)\/knowledge(\/(\d+)(\/(\d+))?)?/gi;
+    const regRes = reg.exec(pathName);
+    const meta = {
+      spaceId: get(regRes, ParamsIndex.SPACE_ID),
+      knowledgeId: get(regRes, ParamsIndex.KNOWLEDGE_ID),
+      documentId: get(regRes, ParamsIndex.DOCUMENT_ID),
+    };
+
+    return meta;
+  }
+
+  /**
+   * 错误事件上报
+   * @param namespace
+   * @param event
+   */
+  errorEvent<EventEnum extends string>(
+    namespace: DataNamespace,
+    event: ErrorEvent<EventEnum>,
+  ) {
+    const meta = this.getMeta();
+    reporterFun({ type: 'error', namespace, event, meta });
+  }
+
+  /**
+   * 自定义事件上报
+   * @param namespace
+   * @param event
+   */
+  event<EventEnum extends string>(
+    namespace: DataNamespace,
+    event: CustomEvent<EventEnum>,
+  ) {
+    const meta = this.getMeta();
+    reporterFun({ type: 'custom', namespace, event, meta });
+  }
+}
+
+export const dataReporter = new DataReporter();

frontend/packages/data/common/reporter/src/reporter/index.ts

@@ -0,0 +1,17 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+export { dataReporter } from './data-reporter';

frontend/packages/data/common/reporter/src/reporter/utils.ts

@@ -0,0 +1,55 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+import {
+  reporter,
+  type CustomEvent,
+  type ErrorEvent,
+} from '@coze-arch/logger';
+
+import { type DataNamespace } from '../constants';
+export const reporterFun = <EventEnum extends string>(
+  params: {
+    namespace: DataNamespace;
+    meta: { [key: string]: unknown };
+  } & (
+    | {
+        type: 'error';
+        event: ErrorEvent<EventEnum>;
+      }
+    | {
+        type: 'custom';
+        event: CustomEvent<EventEnum>;
+      }
+  ),
+) => {
+  const { type, namespace, event, meta } = params;
+  const { meta: inputMeta, ...rest } = event;
+  const eventParams = {
+    namespace,
+    meta: {
+      ...meta,
+      ...inputMeta,
+    },
+    ...rest,
+  };
+
+  if (type === 'error') {
+    reporter.errorEvent(eventParams as ErrorEvent<EventEnum>);
+  } else {
+    reporter.event(eventParams);
+  }
+};

frontend/packages/data/common/reporter/src/typings.d.ts

@@ -0,0 +1,20 @@
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+ 
+declare module '*.less' {
+  const resource: { [key: string]: string };
+  export = resource;
+}