Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Refactoring useHttp to httpService #886

Merged
merged 20 commits into from
Nov 6, 2024

Conversation

yy-wow
Copy link
Collaborator

@yy-wow yy-wow commented Oct 29, 2024

English | 简体中文

PR

PR Checklist

Please check if your PR fulfills the following requirements:

  • The commit message follows our Commit Message Guidelines
  • Tests for the changes have been added (for bug fixes / features)
  • Docs have been added / updated (for bug fixes / features)
  • Built its own designer, fully self-validated

PR Type

What kind of change does this PR introduce?

  • Bugfix
  • Feature
  • Code style update (formatting, local variables)
  • Refactoring (no functional changes, no api changes)
  • Build related changes
  • CI related changes
  • Documentation content changes
  • Other... Please describe:

Background and solution

What is the current behavior?

Issue Number: N/A

What is the new behavior?

支持用户自定义http请求配置

  1. 增加MetaService:HttpService
  2. 将 useHttp() 改为 getMetaApi(HttpService)

Does this PR introduce a breaking change?

  • Yes
  • No

Other information

Summary by CodeRabbit

Release Notes

  • New Features

    • Introduced a login popup for Single Sign-On (SSO) functionality.
    • Enhanced data fetching and error handling across various components using a new HTTP service.
    • Added HttpService to the engine's configuration for improved API interactions.
  • Improvements

    • Updated methods for retrieving application IDs to streamline data access.
    • Enhanced user interaction with confirmation modals for critical actions like data source changes and deletions.
    • Improved validation logic for form submissions and error handling in asynchronous operations.
  • Dependency Updates

    • Removed dependency on @opentiny/tiny-engine-http and added axios and axios-mock-adapter to improve HTTP handling.
  • Bug Fixes

    • Resolved issues related to error handling and notifications during API calls.

@github-actions github-actions bot added the refactor-main refactor/develop branch feature label Oct 29, 2024
@yy-wow yy-wow changed the title Refactor: http service Feat: http service Oct 29, 2024
Copy link
Contributor

coderabbitai bot commented Oct 29, 2024

Walkthrough

The pull request introduces significant updates across multiple files, primarily focusing on replacing the useHttp function with getMetaApi(META_SERVICE.Http) for handling HTTP requests. This change affects how application IDs are retrieved and modifies various components to improve error handling and user interactions. New dependencies are added, and existing ones are removed, reflecting a shift in the underlying architecture. The overall structure of the components remains intact, but the modifications enhance the functionality and maintainability of the codebase.

Changes

File Path Change Summary
designer-demo/package.json Added dependencies: @opentiny/tiny-engine-utils and @vueuse/core.
designer-demo/registry.js Updated metas array to include HttpService instead of GenerateCodeService.
designer-demo/src/composable/http/Login.vue Introduced a new login popup component with methods for opening and closing the login interface.
designer-demo/src/composable/http/index.js Implemented an HTTP service with enhanced error handling and login management.
designer-demo/src/composable/index.js Exported HttpService from the http module.
packages/canvas/DesignCanvas/src/DesignCanvas.vue Updated HTTP request handling to use getMetaApi.
packages/common/composable/defaultGlobalService.js Replaced useHttp with getMetaApi in multiple functions.
packages/common/composable/http/index.js Defined a new HTTP service with interceptors and configuration options.
packages/common/composable/index.js Added export for HttpService.
packages/common/js/http.js Updated HTTP requests to use getMetaApi.
packages/common/js/vscodeGenerateFile.js Updated multiple functions to utilize getMetaApi for HTTP requests.
packages/configurator/src/collection-configurator/CollectionConfigurator.vue Updated data fetching logic to use getMetaApi.
packages/configurator/src/variable-configurator/VariableConfigurator.vue Updated HTTP request logic to use getMetaApi.
packages/design-core/index.js Added HttpService to exports.
packages/design-core/src/preview/src/preview/http.js Updated multiple functions to use getMetaApi.
packages/design-core/src/preview/src/previewApp.vue Updated HTTP requests to utilize getMetaApi.
packages/plugins/block/src/js/http.js Refactored HTTP request handling to use getMetaApi.
packages/plugins/bridge/src/http.js Updated HTTP requests to utilize getMetaApi.
packages/plugins/datasource/src/js/http.js Refactored HTTP request handling to use getMetaApi.
packages/plugins/i18n/src/Main.vue Updated application ID retrieval method.
packages/plugins/materials/src/composable/useMaterial.js Updated HTTP requests to use getMetaApi.
packages/plugins/materials/src/composable/useResource.js Updated HTTP requests to use getMetaApi.
packages/plugins/page/src/http.js Updated HTTP requests to use getMetaApi.
packages/plugins/robot/src/Main.vue Updated HTTP requests to use getMetaApi.
packages/plugins/robot/src/js/robotSetting.js Updated HTTP requests to use getMetaApi.
packages/register/src/constants.js Added Http: 'engine.service.http' to META_SERVICE.
packages/register/src/service.js Added setOptions method to apis object.
packages/toolbars/generate-code/src/Main.vue Updated HTTP requests to use getMetaApi.
packages/toolbars/generate-code/src/http.js Updated multiple functions to use getMetaApi.
packages/toolbars/lock/src/http.js Updated HTTP requests to use getMetaApi.
packages/toolbars/logo/src/Main.vue Updated HTTP requests to use getMetaApi.
packages/toolbars/logout/src/js/http.js Updated logout request to use getMetaApi.
packages/common/package.json Removed @opentiny/tiny-engine-http, added axios and axios-mock-adapter.
packages/engine-cli/template/designer/registry.js Updated metas array to include HttpService.
packages/engine-cli/template/designer/src/composable/http/index.js Introduced configuration and interceptors for HttpService.
packages/http/src/axios.js Removed entire module.
packages/http/vite.config.js Removed Vite configuration for the HTTP package.
packages/http/src/config.js Removed configuration function for HTTP requests.
packages/http/src/index.js Removed HTTP request handling module.
packages/http/package.json Removed package configuration for @opentiny/tiny-engine-http.
packages/plugins/block/package.json Removed dependency on @opentiny/tiny-engine-http.
packages/plugins/bridge/package.json Removed dependency on @opentiny/tiny-engine-http.
packages/plugins/datasource/package.json Removed dependency on @opentiny/tiny-engine-http.
packages/plugins/help/package.json Removed dependency on @opentiny/tiny-engine-http.
packages/plugins/i18n/package.json Removed dependency on @opentiny/tiny-engine-http.
packages/plugins/materials/package.json Removed dependency on @opentiny/tiny-engine-http.
packages/plugins/page/package.json Removed dependency on @opentiny/tiny-engine-http.
packages/plugins/robot/package.json Removed dependency on @opentiny/tiny-engine-http.
packages/plugins/schema/package.json Removed dependency on @opentiny/tiny-engine-http.
packages/plugins/state/package.json Removed dependency on @opentiny/tiny-engine-http.
packages/plugins/tutorial/package.json Removed dependency on @opentiny/tiny-engine-http.
packages/settings/styles/package.json Removed dependency on @opentiny/tiny-engine-http.
packages/toolbars/breadcrumb/package.json Removed dependency on @opentiny/tiny-engine-http.
packages/toolbars/generate-code/package.json Removed dependency on @opentiny/tiny-engine-http.
packages/toolbars/lock/package.json Removed dependency on @opentiny/tiny-engine-http.
packages/toolbars/logo/package.json Removed dependency on @opentiny/tiny-engine-http.
packages/plugins/block/src/js/blockSetting.jsx Updated application ID retrieval method.
packages/plugins/bridge/src/js/resource.js Updated application ID retrieval method.
packages/plugins/datasource/src/DataSourceForm.vue Updated application ID retrieval method.
packages/plugins/materials/src/meta/block/src/BlockGroup.vue Updated application ID retrieval method.
packages/plugins/materials/src/meta/block/src/BlockGroupPanel.vue Updated application ID retrieval method.
packages/plugins/materials/src/meta/block/src/BlockList.vue Updated application ID retrieval method.
packages/plugins/materials/src/meta/block/src/BlockPanel.vue Updated application ID retrieval method.
packages/plugins/page/src/PageTree.vue Updated application ID retrieval method.
packages/plugins/bridge/src/BridgeSetting.vue Updated application ID retrieval method and enhanced validation logic.
packages/plugins/datasource/src/DataSourceGlobalDataHandler.vue No changes to exported entities.
packages/plugins/datasource/src/DataSourceList.vue Updated application ID retrieval method.
packages/plugins/materials/src/meta/block/src/BlockDetail.vue Updated application ID retrieval method.
packages/plugins/page/src/PageFolderSetting.vue Updated application ID retrieval method and enhanced deletion logic.
packages/plugins/page/src/PageSetting.vue Updated application ID retrieval method and added confirmation dialog for deletion.

Possibly related PRs

  • Ospp 2024/feat schema render #780: This PR involves changes to the Main.vue component, which includes updates to the handling of HTTP requests and the introduction of new functionalities that may relate to the changes in the designer-demo project, particularly in terms of managing dependencies and services.
  • Ospp 2024/feat graphic dialogue #792: This PR enhances the chat interface in Main.vue, introducing image upload capabilities and refining model selection logic, which aligns with the updates in the designer-demo project regarding service management and user interaction improvements.
  • Ospp 2024/optimize schema generation #832: This PR focuses on optimizing the schema generation process in Main.vue, which may connect to the overall enhancements in the designer-demo project, particularly in how services and dependencies are managed and utilized within the application.

Suggested labels

ospp-2024

Suggested reviewers

  • hexqi
  • CatsAndMice

🐰 In the code where I hop and play,
New dependencies come out to stay.
With HttpService now in sight,
Fetching data feels just right!
Errors handled, logic clear,
A brighter future, oh so near! 🐇


Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

❤️ Share
🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>, please review it.
    • Generate unit testing code for this file.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
    • @coderabbitai generate unit testing code for this file.
    • @coderabbitai modularize this function.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
    • @coderabbitai read src/utils.ts and generate unit testing code.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
    • @coderabbitai help me debug CodeRabbit configuration file.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai full review to do a full review from scratch and review all the files again.
  • @coderabbitai summary to regenerate the summary of the PR.
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
  • @coderabbitai help to get help.

Other keywords and placeholders

  • Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
  • Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
  • Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

  • You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
  • Please see the configuration documentation for more information.
  • If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

  • Visit our Documentation for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

@yy-wow yy-wow changed the title Feat: http service refactoring useHttp to httpService Oct 29, 2024
@yy-wow yy-wow changed the title refactoring useHttp to httpService Refactoring useHttp to httpService Oct 29, 2024
@yy-wow yy-wow added the ready_for_review This PR requires more reviews label Oct 29, 2024
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 54

🧹 Outside diff range and nitpick comments (40)
packages/toolbars/logout/src/js/http.js (1)

16-16: Add tests for the logout functionality.

Since this is a critical security-related function, it should be thoroughly tested to ensure it works as expected.

Would you like me to help create test cases for the logout functionality? I can generate tests that cover:

  • Successful logout
  • Network errors
  • Server errors
packages/plugins/state/src/js/http.js (1)

16-19: Add unit tests for the refactored HTTP functions.

The PR objectives indicate that tests haven't been added for these changes. Since this is a critical part of the HTTP service refactoring, we should ensure proper test coverage.

Would you like me to help generate unit tests for these functions? The tests should cover:

  1. Successful API calls
  2. Error handling scenarios
  3. Parameter validation
packages/plugins/tutorial/src/js/http.js (2)

19-20: Consider adding input validation for courseId.

While the refactoring is good, consider adding input validation for courseId to ensure it meets expected format/constraints before making the API call.

Here's a suggested improvement:

 export const fetchTutorialDetail = (courseId) =>
+  !courseId
+    ? Promise.reject(new Error('Invalid courseId'))
+    : 
   getMetaApi(META_SERVICE.Http).get(`platform-center/api/courses/${courseId}`)

16-20: Add unit tests for the refactored HTTP functions.

Given these functions are critical for fetching tutorial data, please add unit tests to verify:

  1. Successful API calls
  2. Error handling scenarios
  3. Parameter handling

Would you like me to help generate unit test examples for these functions?

packages/toolbars/generate-code/src/http.js (4)

13-15: Document META_SERVICE usage for maintainability.

Consider adding JSDoc comments explaining the purpose and available options of META_SERVICE.Http for better maintainability.


Line range hint 17-24: Add error handling and input validation.

The function should validate required parameters (platform, app, pageInfo) and implement proper error handling for failed requests.

Consider implementing:

 export const fetchCode = async ({ platform, app, pageInfo, tenant } = {}) => {
+  if (!platform || !app || !pageInfo) {
+    throw new Error('Missing required parameters: platform, app, and pageInfo are required')
+  }
+  
+  try {
     return getMetaApi(META_SERVICE.Http).post(
       '/app-center/api/schema2code',
       { platform, app, pageInfo },
       {
         headers: { [HEADER_LOWCODE_ORG]: tenant }
       }
     )
+  } catch (error) {
+    console.error('Failed to fetch code:', error)
+    throw error
+  }
+}

Line range hint 1-40: Consider centralizing API endpoint configuration.

The file contains hardcoded API endpoints with different base paths (/app-center/api, /material-center/api). Consider:

  1. Moving these endpoints to a centralized configuration
  2. Using environment variables for base URLs
  3. Creating endpoint constants for better maintainability

Example configuration structure:

// config/endpoints.js
export const API_ENDPOINTS = {
  APP_CENTER: {
    SCHEMA_TO_CODE: '/app-center/api/schema2code',
    PREVIEW_METADATA: '/app-center/api/preview/metadata',
    PAGES_LIST: (appId) => `/app-center/api/pages/list/${appId}`
  },
  MATERIAL_CENTER: {
    BLOCK: '/material-center/api/block'
  }
}

Test coverage needed for fetchMetaData function

The verification confirms that there are no test files in the packages/toolbars/generate-code/ directory, while the function is used across multiple components and packages. Test coverage is essential as this function:

  • Is used by critical components like Main.vue in generate-code toolbar
  • Handles metadata that affects i18n and data sources
  • Contains conditional logic that needs validation

Required test cases:

  • Empty/missing ID parameter returning empty object
  • Successful metadata fetch with all parameters
  • Error handling scenarios
  • Tenant header validation
🔗 Analysis chain

Line range hint 26-34: Add test coverage for metadata fetching.

The function needs test coverage, especially for:

  • The conditional behavior when id is missing
  • Various parameter combinations
  • Error scenarios

Let's check for existing tests:

Would you like me to help create test cases for this function?

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for test files related to http.js
fd -e test.js -e spec.js http

Length of output: 31


Script:

#!/bin/bash
# Let's try a broader search for test files that might reference the fetchMetaData function
rg -l "fetchMetaData|getMetaApi" --type=js

# Also search for any test files in the toolbars/generate-code directory
fd -e test.js -e spec.js . packages/toolbars/generate-code/

# Check if there are any test setup files that might contain test configurations
fd -e test.js -e spec.js -e setup.js . packages/toolbars/generate-code/

Length of output: 3066

packages/plugins/bridge/src/http.js (1)

Line range hint 1-42: Add JSDoc documentation and unit tests.

The PR objectives indicate missing tests and documentation. These are critical for maintainability and reliability.

  1. Add JSDoc comments for each function describing:

    • Parameters and their types
    • Return value type
    • Possible errors
    • Example usage
  2. Add unit tests covering:

    • Successful API calls
    • Error scenarios
    • Edge cases (invalid parameters)

Would you like me to help generate the documentation and test templates?

packages/common/js/http.js (1)

Line range hint 41-71: Consider architectural improvements to enhance maintainability

The handlePageUpdate function has multiple responsibilities, making it harder to maintain and test. Consider:

  1. Separating VSCode-specific logic into a dedicated service
  2. Moving state management logic to a separate function
  3. Adding input validation

Here's a suggested refactor approach:

// Input validation
const validatePageUpdateParams = (pageId, params) => {
  if (!pageId || typeof pageId !== 'string') {
    throw new Error('Invalid pageId');
  }
  if (!params || typeof params !== 'object') {
    throw new Error('Invalid params');
  }
};

// VSCode-specific logic
const handleVSCodeUpdates = (pageId, params, routerChange) => {
  if (!isVsCodeEnv) return;
  
  generatePage({
    id: pageId,
    name: params.name,
    page_content: params.page_content
  });

  if (routerChange) {
    generateRouter({ pageId, componentsTree: params });
  }
};

// State management
const updatePageState = (routerChange) => {
  const { pageSettingState } = usePage();
  const { setSaved } = useCanvas();
  
  if (routerChange) {
    pageSettingState.updateTreeData();
  }
  pageSettingState.isNew = false;
  setSaved(true);
};

// Main function becomes cleaner
export const handlePageUpdate = async (pageId, params, routerChange) => {
  try {
    validatePageUpdateParams(pageId, params);
    
    const res = await getMetaApi(META_SERVICE.Http)
      .post(`/app-center/api/pages/update/${pageId}`, params);
    
    handleVSCodeUpdates(pageId, params, routerChange);
    updatePageState(routerChange);
    
    useNotify({ message: '保存成功!', type: 'success' });
    return res;
  } catch (err) {
    useNotify({ 
      title: '保存失败', 
      message: `${err?.message || ''}`, 
      type: 'error' 
    });
  }
};

Would you like me to create a separate issue to track these architectural improvements?

packages/register/src/constants.js (1)

4-4: LGTM! Consider updating documentation.

The new HTTP service constant follows the established naming pattern and integrates well with the existing service structure. However, since this is part of a significant HTTP service refactor, please ensure the documentation is updated to reflect this new service integration.

packages/design-core/src/preview/src/preview/http.js (2)

46-49: Document the empty object fallback behavior

The function returns an empty object when no ID is provided. This behavior should be documented to make it clear for consumers of this API.

+/**
+ * Fetches metadata for the given parameters
+ * @param {Object} params - The parameters object
+ * @param {string} params.id - The ID to fetch metadata for
+ * @returns {Promise<Object>} Returns the metadata object, or an empty object if no ID is provided
+ */
 export const fetchMetaData = async ({ platform, app, type, id, history, tenant } = {}) =>

Line range hint 1-59: Consider architectural improvements for the HTTP service

While the refactoring to use getMetaApi is a good direction, consider these architectural improvements:

  1. Implement request/response interceptors for common headers (like tenant)
  2. Add retry logic for failed requests
  3. Centralize error handling
  4. Add request timeout configuration
  5. Consider implementing request cancellation for long-running requests

These improvements would make the HTTP service more robust and maintainable.

packages/plugins/robot/src/js/robotSetting.js (2)

Line range hint 39-41: Consider making the block limit configurable.

The hardcoded limit of 200 blocks could be moved to a configuration constant or environment variable for better maintainability and flexibility.

+const MAX_BLOCKS_LIMIT = 200 // Maximum number of blocks to avoid exceeding message size limits
 const setBlockContent = (list = getBlocks()) => {
-  const blockList = list.slice(0, 200) // 为了尽量避免每个请求的message内容过大,限制block的个数避免超出字节要求
+  const blockList = list.slice(0, MAX_BLOCKS_LIMIT)

Line range hint 65-67: Improve error handling implementation.

The current error handling silently swallows errors. Consider logging the error or showing a user-friendly notification.

   } catch (err) {
-    // 捕获错误
+    console.error('Failed to fetch block list:', err)
+    // Consider adding user notification here
   }
packages/plugins/datasource/src/js/http.js (1)

15-15: Consider adding TypeScript or JSDoc types for API responses.

Adding type definitions for the API responses would improve code maintainability and help catch potential issues during refactoring.

Example:

/**
 * @typedef {Object} DataSource
 * @property {string} id
 * @property {string} name
 * ... other properties
 */
packages/configurator/src/collection-configurator/CollectionConfigurator.vue (3)

Line range hint 48-52: Add error handling and loading state for API calls

The current implementation lacks error handling and loading state management, which could lead to poor user experience if the API call fails.

Consider implementing the following improvements:

+    const loading = ref(false)
+    const error = ref(null)
+
     const fetchDataSourceList = (appId) => getMetaApi(META_SERVICE.Http).get(`/app-center/api/sources/list/${appId}`)
 
+    const loadDataSources = async () => {
+      loading.value = true
+      error.value = null
+      try {
         const appId = getMetaApi(META_SERVICE.GlobalService).getState().appInfo.id
-        fetchDataSourceList(appId).then((data) => {
-          options.value = data
-        })
+        const data = await fetchDataSourceList(appId)
+        if (Array.isArray(data)) {
+          options.value = data
+        } else {
+          console.error('Invalid data source response format')
+        }
+      } catch (err) {
+        error.value = err
+        console.error('Failed to fetch data sources:', err)
+      } finally {
+        loading.value = false
+      }
+    }
+
+    // Call on component mount
+    loadDataSources()

Also, consider updating the template to show loading and error states:

   <div class="meta-dataSource-wrap">
+    <div v-if="error" class="error-message">Failed to load data sources</div>
     <tiny-select 
       v-model="selected" 
       placeholder="请选择" 
+      :loading="loading"
       @change="sourceChange">

Line range hint 13-24: Improve component architecture and type safety

The component could benefit from better type definitions and separation of concerns.

Consider these improvements:

 export default {
   components: {
     TinySelect: Select,
     TinyOption: Option,
     IconConmentRefresh: IconConmentRefresh(),
     TinyTooltip: Tooltip
   },
   props: {
-    modelValue: [String, Number]
+    modelValue: {
+      type: [String, Number],
+      required: false,
+      default: null,
+      validator: (value) => {
+        return value === null || typeof value === 'string' || typeof value === 'number'
+      }
+    }
   },

Consider extracting the data fetching logic into a composable:

// useDataSources.js
export function useDataSources() {
  const loading = ref(false)
  const error = ref(null)
  const options = ref([])

  const fetchDataSources = async () => {
    // ... implementation
  }

  return {
    loading,
    error,
    options,
    fetchDataSources
  }
}

This would improve testability and reusability of the data fetching logic.


Add unit tests for CollectionConfigurator component

The verification confirms that:

  • No tests exist for the CollectionConfigurator component
  • The configurator package lacks a test setup ("test": "echo \"Error: no test specified\" && exit 1")
  • Other packages in the repository do have test infrastructure (e.g., packages/register, packages/utils)

Key test scenarios needed:

  1. Data source loading via fetchDataSourceList
  2. User interaction with source selection and confirmation dialog
  3. Refresh functionality with state management
  4. Props and emits validation
  5. Error handling for API calls

Please set up the test infrastructure following the patterns established in other packages like packages/register and add comprehensive test coverage for this critical component.

🔗 Analysis chain

Line range hint 1-93: Add comprehensive test coverage

This component handles critical data source selection functionality and should have thorough test coverage.

Key test scenarios should include:

  1. Successful data source loading
  2. API error handling
  3. User confirmation dialogs
  4. Data source selection changes
  5. Refresh functionality

Would you like me to help generate a test suite for this component? Here's a verification script to check for existing tests:

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check for existing test coverage
# Look for test files related to CollectionConfigurator
fd -e spec.js -e test.js -e spec.ts -e test.ts "CollectionConfigurator" packages/configurator/

Length of output: 94


Script:

#!/bin/bash
# Let's try a broader search to understand the test structure in the repository
# First, find all test files in the configurator package
echo "=== Test files in configurator package ==="
fd -e spec.js -e test.js -e spec.ts -e test.ts . packages/configurator/

# Then check if there are any references to CollectionConfigurator in test files
echo -e "\n=== Searching for CollectionConfigurator in test files ==="
rg -l "CollectionConfigurator" packages/configurator/ -g "*.{spec,test}.{js,ts,vue}"

# Look for any test setup/configuration files
echo -e "\n=== Test configuration files ==="
fd "jest.config|vitest.config" packages/configurator/

# Check if there's a tests directory
echo -e "\n=== Test directories structure ==="
fd -t d "test|tests|__tests__" packages/configurator/

Length of output: 664


Script:

#!/bin/bash
# Let's check the broader project structure and testing patterns
# First, check if there are test files in parent directories
echo "=== Test files in parent directories ==="
fd -e spec.js -e test.js -e spec.ts -e test.ts . packages/

# Check for testing utilities or helpers
echo -e "\n=== Testing utilities and setup files ==="
rg -l "test-utils|testing" packages/ -g "*.{js,ts,vue,json}"

# Look for similar Vue components that might have tests as examples
echo -e "\n=== Similar Vue components with tests ==="
fd -e vue . packages/configurator/src/ -x rg -l "^import.*Test|^describe|^it\(" {}

# Check package.json for test-related scripts
echo -e "\n=== Test scripts in package.json ==="
cat packages/configurator/package.json | grep -A 5 '"scripts":'

Length of output: 1635

packages/register/src/service.js (1)

Line range hint 1-99: Consider architectural implications of mutable service configuration

As this file is part of the HTTP service refactoring, there are some architectural considerations to keep in mind:

  1. Service configuration changes should be tracked and potentially logged for debugging.
  2. Consider implementing an event system to notify dependents of option changes.
  3. Consider adding a mechanism to reset options to their initial state.

These improvements would make the service more robust and maintainable.

packages/common/js/vscodeGenerateFile.js (2)

Line range hint 27-111: Add error handling to API calls.

All generator functions make HTTP requests without error handling. Consider wrapping these calls in try-catch blocks or adding error handling middleware to handle potential network issues, API errors, or invalid responses gracefully.

Example implementation:

-const generateRouter = (params) => getMetaApi(META_SERVICE.Http).post('/generate/api/generateRouter', params)
+const generateRouter = async (params) => {
+  try {
+    return await getMetaApi(META_SERVICE.Http).post('/generate/api/generateRouter', params)
+  } catch (error) {
+    console.error('Failed to generate router:', error)
+    throw new Error(`Router generation failed: ${error.message}`)
+  }
+}

Line range hint 27-111: Consider centralizing API endpoint configuration.

All generator functions use hardcoded endpoint paths. Consider moving these endpoints to a centralized configuration file for better maintainability and easier updates.

Example implementation:

// api-endpoints.js
export const ENDPOINTS = {
  ROUTER: '/generate/api/generateRouter',
  I18N: '/generate/api/generateI18n',
  // ... other endpoints
}

// vscodeGenerateFile.js
import { ENDPOINTS } from './api-endpoints'

const generateRouter = (params) => 
  getMetaApi(META_SERVICE.Http).post(ENDPOINTS.ROUTER, params)
packages/design-core/index.js (1)

41-42: Consider documenting the HTTP service migration.

Since this is part of a significant architectural change in how HTTP requests are handled, it would be beneficial to update the documentation to reflect this change.

Consider adding a comment above the exports explaining:

  • The purpose of HttpService
  • Why it's being exported alongside GlobalService
  • Any migration guidelines for consumers
+// GlobalService and HttpService provide core functionality for the engine.
+// HttpService is the recommended way to handle HTTP requests, replacing the previous useHttp approach.
 export {
   GlobalService,
   HttpService
 } from '@opentiny/tiny-engine-common'
packages/common/composable/defaultGlobalService.js (3)

Line range hint 16-33: Consider adding data validation for appInfo state.

The appInfo state contains critical fields like id, obs_url, and editor_url. Consider adding validation to ensure data integrity when updating these fields.

Consider using a validation library or adding a validation function:

const validateAppInfo = (appInfo) => {
  const required = ['id', 'name', 'platform']
  for (const field of required) {
    if (!appInfo[field]) {
      throw new Error(`Missing required field: ${field}`)
    }
  }
  if (appInfo.obs_url && !isValidUrl(appInfo.obs_url)) {
    throw new Error('Invalid obs_url format')
  }
  return appInfo
}

Line range hint 82-98: Improve error handling in app_id_changed subscription.

The current error handling only logs to console. Consider:

  1. Using a proper error tracking system
  2. Notifying the user of the failure
  3. Handling the promise rejection from fetchAppInfo
 subscribe({
   topic: 'app_id_changed',
   callback: (appId) => {
     if (!appId) {
-      // eslint-disable-next-line no-console
-      console.error('Invalid appId received in app_id_changed event')
+      const error = 'Invalid appId received in app_id_changed event'
+      useModal().message({ message: error, status: 'error' })
       return
     }

     fetchAppInfo(appId).then((app) => {
+      if (!app) return
       state.appInfo = app
       document.title = `${app.name} —— TinyEditor 前端可视化设计器`
-    })
+    }).catch((error) => {
+      useModal().message({ 
+        message: `Failed to fetch app info: ${error.message}`, 
+        status: 'error' 
+      })
+    })
   }
 })

Line range hint 93-94: Extract document title update to a separate function.

The document title update is a side effect that should be extracted for better maintainability and testability.

+const updateDocumentTitle = (appName) => {
+  document.title = `${appName} —— TinyEditor 前端可视化设计器`
+}

 fetchAppInfo(appId).then((app) => {
   state.appInfo = app
-  document.title = `${app.name} —— TinyEditor 前端可视化设计器`
+  updateDocumentTitle(app.name)
 })
packages/plugins/materials/src/meta/block/src/http.js (2)

Line range hint 46-85: Document the data transformation logic.

The block deduplication and filtering logic in fetchGroupBlocksByIds is complex and would benefit from documentation explaining the business rules.

Add JSDoc comments explaining:

  • Why blocks might be duplicated across groups
  • The significance of the dslMode filter
  • The structure of the returned data

Line range hint 1-141: Document the HTTP service architecture.

This refactor successfully centralizes HTTP requests through getMetaApi(META_SERVICE.Http), improving maintainability. However, the following architectural aspects should be documented:

  1. The purpose and benefits of using META_SERVICE.Http over direct HTTP calls
  2. Error handling strategies for the new HTTP service
  3. Configuration options for different environments
  4. Migration guide for other parts of the application

Consider adding an architecture.md file to document these design decisions and patterns.

packages/design-core/src/preview/src/previewApp.vue (2)

104-104: Address the TODO comment regarding finally implementation

The TODO comment suggests uncertainty about implementing finally logic.

Would you like me to help implement proper cleanup using Vue's lifecycle hooks or try/finally pattern?


Line range hint 119-129: Enhance error handling and type checking

While the implementation is functional, it could be more robust.

Consider these improvements:

  getMetaApi(META_SERVICE.Http)
    .get(`/app-center/api/apps/preview/${appId}`)
    .then((data) => {
+     // Ensure required fields exist
+     if (!data || (!data.taskId && !data.id)) {
+       throw new Error('Invalid response: missing task identifier')
+     }
      if (data.taskId || data.id) {
        setTimeout(() => {
          cyclesFetchStatus(data.taskId || data.id)
        }, INTERVAL_PROGRESS)
      }
    })
    .catch((err) => {
      progressStatus.value = 'exception'
      percentage.value = 0
      isBtnShow.value = true
-     statusText.value = err?.message || deployTips[2]
+     statusText.value = `预览失败: ${err?.message || deployTips[2]}`
    })
packages/plugins/i18n/src/composable/useTranslate.js (2)

Line range hint 50-54: Add error handling for bulk delete operation.

The removeI18n function performs a critical bulk delete operation without error handling. Consider wrapping the API call in a try-catch block to handle potential failures gracefully.

-  getMetaApi(META_SERVICE.Http).post(`${i18nApi}/bulk/delete`, {
-    ...globalParams,
-    key_in: key
-  })
+  try {
+    await getMetaApi(META_SERVICE.Http).post(`${i18nApi}/bulk/delete`, {
+      ...globalParams,
+      key_in: key
+    })
+  } catch (error) {
+    console.error('Failed to delete i18n entries:', error)
+    // Consider rolling back the local state changes
+    key.forEach((element) => {
+      langs[element] = previousLangs[element]
+    })
+    throw error
+  }

Based on the analysis of the codebase, I can now provide a final response:

The review comment is correct - the API call should handle responses and errors.

Looking at the implementation in useTranslate.js, the i18n create/update API call is made without:

  1. Awaiting the response
  2. Handling potential errors
  3. Verifying the success/failure of the operation

This could lead to inconsistencies if the server operation fails, as the caller has no way to know if the i18n entry was actually created/updated. The suggested fix in the review comment to add await and error handling is the right approach.

The fix should be applied because:

  • Other API calls in the codebase generally handle responses and errors
  • I18n data is critical for the application's internationalization
  • Failed operations should be reported to the user for proper error handling
🔗 Analysis chain

Line range hint 73-77: Verify response handling in update/create operation.

The API call in ensureI18n doesn't await or handle the response, which could lead to inconsistencies if the server operation fails.

-      getMetaApi(META_SERVICE.Http).post(`${i18nApi}/${exist ? 'update' : 'create'}`, {
+      await getMetaApi(META_SERVICE.Http).post(`${i18nApi}/${exist ? 'update' : 'create'}`, {
         ...globalParams,
         key,
         contents
-      })
+      }).catch(error => {
+        console.error(`Failed to ${exist ? 'update' : 'create'} i18n entry:`, error)
+        throw error
+      })

Let me analyze the API call patterns in similar endpoints to verify the response handling. Let me search for more specific patterns.


Let me check the broader context of the i18n API implementation to understand the error handling patterns.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for response handling patterns in similar API calls
rg -A 3 "getMetaApi.*post.*create|update" --type js

Length of output: 205600


Script:

#!/bin/bash
# Search for response handling patterns in i18n API calls
rg -A 5 "getMetaApi.*post.*i18n" --type js

Length of output: 1374


Script:

#!/bin/bash
# Get more context around the i18n API implementation
rg -B 5 -A 10 "ensureI18n" --type js

Length of output: 7987

packages/toolbars/generate-code/src/Main.vue (2)

Line range hint 106-110: Consider adding type definitions for API responses.

The Promise.all call handles multiple API responses, but there's no explicit type information. Consider adding TypeScript interfaces or JSDoc type definitions for the API responses to improve type safety and maintainability.

Example using JSDoc:

/**
 * @typedef {Object} AppSchema
 * @property {Array<Object>} componentsMap
 * @property {Object} meta
 */

/**
 * @typedef {Object} MetaData
 * @property {Object} dataSource
 * @property {Object} utils
 * @property {Object} i18n
 * @property {Object} globalState
 */

/**
 * @returns {Promise<[AppSchema, MetaData, Array<Object>, FileSystemDirectoryHandle?]>}
 */
const getPreGenerateInfo = async () => {
  // ... existing code
}

Line range hint 106-110: Consider enhancing error handling for API failures.

The error handling in getPreGenerateInfo could be more specific about which API call failed. Consider implementing more granular error handling to provide better feedback to users.

Here's a suggested approach:

const safeApiCall = async (apiCall, errorContext) => {
  try {
    return await apiCall();
  } catch (error) {
    throw new Error(`Failed to ${errorContext}: ${error.message}`);
  }
};

const getPreGenerateInfo = async () => {
  const params = getParams();
  const { id } = getMetaApi(META_SERVICE.GlobalService).getBaseInfo();
  
  try {
    const [appData, metaData, pageList, dirHandle] = await Promise.all([
      safeApiCall(() => getMetaApi(META_SERVICE.Http).get(`/app-center/v1/api/apps/schema/${id}`), 'fetch app schema'),
      safeApiCall(() => fetchMetaData(params), 'fetch meta data'),
      safeApiCall(() => fetchPageList(params.app), 'fetch page list'),
      !state.dirHandle ? fs.getUserBaseDirHandle() : null
    ].filter(Boolean));
    
    // ... rest of the function
  } catch (error) {
    useNotify({ type: 'error', title: '获取数据失败', message: error.message });
    throw error;
  }
};

Also applies to: 182-189

packages/plugins/materials/src/composable/useMaterial.js (1)

141-141: Consider enhancing error handling and URL management

While the transition to getMetaApi is good, consider these improvements:

  1. Add response structure validation before array destructuring
  2. Consider moving the API endpoint path to a constants file for better maintainability

Example enhancement:

- const block = (await getMetaApi(META_SERVICE.Http).get(`/material-center/api/block?label=${blockName}`))?.[0]
+ const response = await getMetaApi(META_SERVICE.Http).get(`${API_ENDPOINTS.MATERIAL_CENTER}/block?label=${blockName}`)
+ if (!Array.isArray(response)) {
+   throw new Error('Invalid response format from material center API')
+ }
+ const block = response[0]
packages/toolbars/logo/src/Main.vue (1)

Line range hint 256-284: Improve loading state management and error handling.

The publish request implementation has a few areas for improvement:

  1. Loading instance creation and dialog closing order might cause visual glitches
  2. Hardcoded timeout for tip box visibility
  3. Local storage usage without error handling

Consider these improvements:

-        state.show = false
         const postData = {
           commitMsg: state.formData.commitMsg,
           branch: state.formData.branch,
           canCreateNewBranch: state.formData.canCreateNewBranch,
           allGenerate: state.formData.allGenerate
         }
-        localStorage.setItem('tinyengine_publishMsg', JSON.stringify(postData))
+        try {
+          localStorage.setItem('tinyengine_publishMsg', JSON.stringify(postData))
+        } catch (error) {
+          console.warn('Failed to save publish message to localStorage:', error)
+        }
+        
+        state.show = false
         const loadingInstance = Loading.service({
           text: '发布中,请稍后...',
           customClass: 'new-loading',
           target: document.getElementById('tiny-loading'),
           background: 'rgba(0, 0, 0, 0.6)'
         })

+        const TIP_VISIBILITY_DURATION = 5000
         getMetaApi(META_SERVICE.Http)
           .post(`/app-center/api/apps/publish/${appId}`, postData)
           .then((data) => {
             if (data.code === 200) {
               tipText.value = '发布成功'
             } else {
               tipText.value = data?.error?.message || '发布失败,请重新发布'
             }

             loadingInstance.close()
             nextTick(() => {
               tipBoxVisibility.value = true
             })
             setTimeout(() => {
               tipBoxVisibility.value = false
-            }, 5000)
+            }, TIP_VISIBILITY_DURATION)

Additionally, consider extracting the tip box visibility logic into a composable function for better reusability:

// useTimedVisibility.ts
import { ref } from 'vue'

export function useTimedVisibility(duration: number) {
  const isVisible = ref(false)
  let timeoutId: number | null = null

  const show = () => {
    if (timeoutId) {
      clearTimeout(timeoutId)
    }
    isVisible.value = true
    timeoutId = setTimeout(() => {
      isVisible.value = false
      timeoutId = null
    }, duration)
  }

  return {
    isVisible,
    show
  }
}
packages/plugins/i18n/src/Main.vue (1)

Line range hint 389-396: Consider adding error handling.

The HTTP request should handle errors to provide better user feedback when file upload fails.

Consider updating the implementation to handle errors:

 getMetaApi(META_SERVICE.Http)
   .post(action, formdata)
   .then(() => {
     handleAvatarSuccess()
   })
+  .catch((error) => {
+    const { Modal } = useModal()
+    Modal.message({
+      message: `Failed to upload i18n file: ${error.message}`,
+      status: 'error'
+    })
+  })
   .finally(() => {
     loadingInstance.close()
     isLoading.value = false
   })
packages/common/composable/http/axios.js (1)

33-65: Avoid modifying third-party library prototypes

Modifying the prototype of a third-party library (MockAdapter.prototype) can lead to maintenance challenges and potential conflicts if the library updates or if other parts of the codebase also extend it.

Consider alternative approaches, such as creating a subclass or a wrapper function that adds the desired functionality without modifying the original prototype.

🧰 Tools
🪛 Biome

[error] 43-43: The assignment should not be in an expression.

The use of assignments in expressions is confusing.
Expressions are often considered as side-effect free.

(lint/suspicious/noAssignInExpressions)

packages/plugins/robot/src/Main.vue (2)

Line range hint 223-236: Set connectedFailed.value to true in the error handling

In the .catch block of the sendRequest function, connectedFailed.value is set to false even when a connection failure occurs. To accurately represent the connection status, it should be set to true upon failure.

Apply this diff to fix the logic error:

    .catch(() => {
      messages.value[messages.value.length - 1].content = '连接失败'
      localStorage.removeItem('aiChat')
      inProcessing.value = false
-     connectedFailed.value = false
+     connectedFailed.value = true
    })

Line range hint 223-236: Consider refactoring sendRequest to use async/await syntax

Refactoring the sendRequest function to use async/await can enhance readability and maintainability by simplifying asynchronous code flow.

Refactored sendRequest function:

- const sendRequest = () => {
-   getMetaApi(META_SERVICE.Http)
-     .post('/app-center/api/ai/chat', getSendSessionProcess(), { timeout: 600000 })
-     .then((res) => {
-       // success handling
-     })
-     .catch(() => {
-       // error handling
-     })
- }
+ const sendRequest = async () => {
+   try {
+     const res = await getMetaApi(META_SERVICE.Http).post('/app-center/api/ai/chat', getSendSessionProcess(), { timeout: 600000 })
+     const { originalResponse, schema, replyWithoutCode } = res
+     const responseMessage = getAiRespMessage(
+       originalResponse.choices?.[0]?.message.role,
+       originalResponse.choices?.[0]?.message.content
+     )
+     const respDisplayMessage = getAiRespMessage(originalResponse.choices?.[0]?.message.role, replyWithoutCode)
+     sessionProcess.messages.push(responseMessage)
+     sessionProcess.displayMessages.push(respDisplayMessage)
+     messages.value[messages.value.length - 1].content = replyWithoutCode
+     setContextSession()
+     if (schema?.schema) {
+       createNewPage(schema.schema)
+     }
+     inProcessing.value = false
+     connectedFailed.value = false
+   } catch (error) {
+     messages.value[messages.value.length - 1].content = '连接失败'
+     localStorage.removeItem('aiChat')
+     inProcessing.value = false
+     connectedFailed.value = true
+   }
+ }
📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

📥 Commits

Files that changed from the base of the PR and between 48687e8 and 1fef16c.

📒 Files selected for processing (38)
  • designer-demo/package.json (1 hunks)
  • designer-demo/registry.js (1 hunks)
  • designer-demo/src/composable/http/Login.vue (1 hunks)
  • designer-demo/src/composable/http/index.js (1 hunks)
  • designer-demo/src/composable/http/mock.js (1 hunks)
  • designer-demo/src/composable/index.js (1 hunks)
  • packages/canvas/DesignCanvas/src/DesignCanvas.vue (2 hunks)
  • packages/common/composable/defaultGlobalService.js (2 hunks)
  • packages/common/composable/http/axios.js (1 hunks)
  • packages/common/composable/http/index.js (1 hunks)
  • packages/common/composable/index.js (1 hunks)
  • packages/common/js/http.js (3 hunks)
  • packages/common/js/vscodeGenerateFile.js (8 hunks)
  • packages/configurator/src/collection-configurator/CollectionConfigurator.vue (1 hunks)
  • packages/configurator/src/variable-configurator/VariableConfigurator.vue (1 hunks)
  • packages/design-core/index.js (1 hunks)
  • packages/design-core/src/preview/src/preview/http.js (3 hunks)
  • packages/design-core/src/preview/src/previewApp.vue (2 hunks)
  • packages/plugins/block/src/js/http.js (1 hunks)
  • packages/plugins/bridge/src/http.js (1 hunks)
  • packages/plugins/datasource/src/js/http.js (1 hunks)
  • packages/plugins/i18n/src/Main.vue (1 hunks)
  • packages/plugins/i18n/src/composable/useTranslate.js (5 hunks)
  • packages/plugins/materials/src/composable/useMaterial.js (3 hunks)
  • packages/plugins/materials/src/composable/useResource.js (1 hunks)
  • packages/plugins/materials/src/meta/block/src/http.js (6 hunks)
  • packages/plugins/page/src/http.js (1 hunks)
  • packages/plugins/robot/src/Main.vue (2 hunks)
  • packages/plugins/robot/src/js/robotSetting.js (1 hunks)
  • packages/plugins/state/src/js/http.js (1 hunks)
  • packages/plugins/tutorial/src/js/http.js (1 hunks)
  • packages/register/src/constants.js (1 hunks)
  • packages/register/src/service.js (2 hunks)
  • packages/toolbars/generate-code/src/Main.vue (1 hunks)
  • packages/toolbars/generate-code/src/http.js (2 hunks)
  • packages/toolbars/lock/src/http.js (1 hunks)
  • packages/toolbars/logo/src/Main.vue (2 hunks)
  • packages/toolbars/logout/src/js/http.js (1 hunks)
✅ Files skipped from review due to trivial changes (1)
  • designer-demo/src/composable/index.js
🧰 Additional context used
🪛 GitHub Check: push-check
designer-demo/src/composable/http/index.js

[failure] 75-75:
'http' is not defined


[failure] 75-75:
'response' is not defined

🪛 eslint
designer-demo/src/composable/http/index.js

[error] 75-75: 'response' is not defined.

(no-undef)

🪛 Biome
designer-demo/src/composable/http/mock.js

[error] 710-710: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


[error] 717-719: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


[error] 722-723: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


[error] 747-753: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


[error] 772-776: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


[error] 796-798: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

packages/common/composable/http/axios.js

[error] 43-43: The assignment should not be in an expression.

The use of assignments in expressions is confusing.
Expressions are often considered as side-effect free.

(lint/suspicious/noAssignInExpressions)


[error] 142-142: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

🔇 Additional comments (49)
packages/common/composable/index.js (1)

3-3: Consider adding tests for the new HttpService.

The PR objectives indicate that tests haven't been added. Since this is exporting a service that's being widely integrated across the application, it should have proper test coverage.

#!/bin/bash
# Check for existing test files related to HttpService
fd -e spec.js -e test.js -e spec.ts -e test.ts "http" packages/common/composable/
packages/toolbars/logout/src/js/http.js (1)

13-13: LGTM! Implementation aligns with the HTTP service refactoring.

The change from useHttp to getMetaApi(META_SERVICE.Http) is consistent with the broader refactoring effort across the codebase.

Also applies to: 16-16

packages/toolbars/lock/src/http.js (2)

13-13: LGTM! Clean import of the new HTTP service.

The change aligns with the broader refactoring effort to use the meta API service.


16-17: Consider enhancing the implementation with proper error handling and documentation.

While the implementation is correct, consider these improvements:

  1. Add JSDoc to document the params parameter
  2. Add explicit error handling for failed requests
  3. Add unit tests to verify the behavior

Here's a suggested enhancement:

+ /**
+  * Requests to lock a canvas page
+  * @param {string} params - URL query parameters
+  * @returns {Promise<any>} The response from the server
+  * @throws {Error} When the request fails
+  */
 export const requestBlockPage = (params) =>
-  getMetaApi(META_SERVICE.Http).get(`app-center/api/apps/canvas/lock?${params}`)
+  getMetaApi(META_SERVICE.Http)
+    .get(`app-center/api/apps/canvas/lock?${params}`)
+    .catch(error => {
+      console.error('Failed to lock page:', error);
+      throw error;
+    });

Let's verify the usage of this function across the codebase:

packages/plugins/state/src/js/http.js (2)

13-13: LGTM: Clean import of new HTTP service dependencies.

The import statement correctly brings in the required dependencies from the meta register package, aligning with the broader HTTP service refactoring effort.


16-19: Verify the API endpoint patterns across the codebase.

Let's ensure the API endpoint patterns are consistent across the codebase after this refactoring.

✅ Verification successful

API endpoint patterns are consistent across the codebase

The verification shows that the API endpoint patterns in the codebase follow consistent conventions:

  • All endpoints are prefixed with /app-center/api/
  • Resource-specific endpoints follow RESTful patterns (e.g., /apps/, /pages/, /sources/)
  • ID parameters are consistently used in URL paths (e.g., /${appId}, /${pageId})
  • CRUD operations follow standard patterns:
    • GET for retrieval: /list, /detail, /schema
    • POST for updates: /update, /create
    • GET for deletion: /delete

The endpoints in the reviewed code (/app-center/api/apps/update/${appId} and /app-center/api/apps/schema/${appId}) align perfectly with these patterns.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check for consistency in app-center API endpoint patterns

# Search for all app-center API endpoints
echo "Checking app-center API endpoint patterns..."
rg -g '*.{js,ts,vue}' '/app-center/api/' -A 1 -B 1

# Specifically check for apps endpoints
echo "\nChecking apps-related endpoint patterns..."
rg -g '*.{js,ts,vue}' '/app-center/api/apps/' -A 1 -B 1

Length of output: 18985

packages/plugins/tutorial/src/js/http.js (2)

13-13: LGTM! Import statement is correctly structured.

The import aligns with the broader HTTP service refactoring effort.


16-17: Verify error handling approach with new HTTP service.

While the refactoring looks good, we should ensure proper error handling is in place. Consider whether error handling should be implemented at this level or if it's already handled by getMetaApi.

✅ Verification successful

Based on the search results, I can see that getMetaApi(META_SERVICE.Http) returns an HTTP client that is used consistently throughout the codebase for making API requests. Let me search for error handling patterns in the HTTP service implementation.


Let me try a different search pattern to find the HTTP service implementation and error handling.


Based on the search results, I can see that error handling is implemented at multiple levels:

  1. The HTTP service has global response interceptors that handle errors:
http.interceptors.response.use(preResponse, errorResponse)
  1. For data sources specifically, there are dedicated error handlers:
http.interceptors.response.use(globalDataHandle, globalErrorHandler)
  1. The HTTP client implementation includes error handling for common scenarios like 403 unauthorized responses.

Let me verify the specific error handling implementation for the data sources.


Based on the search results, I can now provide a definitive response about the error handling in the HTTP service used by fetchTutorialList:

Error handling is properly implemented at multiple levels

The HTTP service used by getMetaApi(META_SERVICE.Http) has comprehensive error handling:

  1. Global error handling through response interceptors that apply to all requests including fetchTutorialList
  2. Default error handler with fallback behavior (defaultErrorHandler)
  3. Configurable error handling through:
    • Global error handler that can be customized at the application level
    • Per-request error handlers that can be specified for individual requests

The error handling is properly layered and follows best practices, making the fetchTutorialList function safe to use without additional error handling at the call site.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for error handling patterns in getMetaApi implementation
echo "Searching for error handling in getMetaApi implementation..."
rg -A 5 "getMetaApi" --type js

# Search for try-catch blocks around getMetaApi usage
echo "Searching for error handling around getMetaApi usage..."
ast-grep --pattern 'try {
  $$$
  getMetaApi($$$)
  $$$
} catch'

Length of output: 93634


Script:

# Search for error handling in the HTTP service implementation
rg -A 10 "META_SERVICE.Http" packages/register/src/common.js

# Search for global error handling setup
rg -A 10 "errorHandler" packages/register/src/common.js

Length of output: 116


Script:

# Search for HTTP service implementation
rg -A 10 "defineService.*Http" --type js

# Search for axios or HTTP client configuration with error handling
rg -A 10 "interceptors.*response" --type js

# Search for error handling in the meta register package
fd "common.js|http.js" -t f packages/register/ -x cat {}

Length of output: 16061


Script:

# Search for error handler implementations in data source related files
rg -A 5 "globalErrorHandler|errorHandler" packages/plugins/datasource/

# Search for data handler implementations
rg -A 5 "globalDataHandle|dataHandler" packages/plugins/datasource/

Length of output: 23097

designer-demo/package.json (2)

22-22: Add tests and documentation for @vueuse/core integration.

The addition of @vueuse/core introduces new composition utilities that need to be properly tested and documented:

  1. Add tests for components using @vueuse/core utilities
  2. Update documentation to reflect new utility usage
  3. Consider documenting any potential breaking changes

15-15: Verify the usage of tiny-engine-utils.

The addition of @opentiny/tiny-engine-utils appears to be related to the HTTP service refactoring. Let's verify its usage across the codebase.

✅ Verification successful

The previous results show that @opentiny/tiny-engine-utils is imported across many files but mainly for constants and utils. I need to verify if getMetaApi is actually being used from this package or if it's coming from another package, as this might affect the verification of the dependency addition.


Based on the search results, I can now generate the final response:

The @opentiny/tiny-engine-utils dependency is correctly added and verified.

The package is used extensively throughout the codebase for importing constants and utils. However, getMetaApi is consistently imported from @opentiny/tiny-engine-meta-register and not from tiny-engine-utils, which is the correct source. The dependency addition is part of the HTTP service refactoring but for other utility functions.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check how the new utility package is being used
# Expected: Find imports and usage of HTTP-related utilities

# Search for imports from the new package
rg "from ['|\"]@opentiny/tiny-engine-utils" -A 3

# Search for specific HTTP-related imports
rg "import.*getMetaApi.*from ['|\"]@opentiny/tiny-engine-utils"

Length of output: 20464


Script:

#!/bin/bash
# Let's check for getMetaApi usage in the codebase
rg "import.*getMetaApi.*from" -A 2

# Also check for any direct usage of getMetaApi
rg "getMetaApi\(" -A 2

Length of output: 52917

packages/plugins/bridge/src/http.js (1)

13-14: LGTM: Clean import of new HTTP service.

The transition to getMetaApi from @opentiny/tiny-engine-meta-register is a good architectural choice for centralizing HTTP requests.

designer-demo/src/composable/http/Login.vue (2)

5-5: Review security implications of iframe usage.

The iframe implementation might be vulnerable to clickjacking attacks. Consider implementing appropriate security headers and sandbox attributes.

#!/bin/bash
# Check if Content-Security-Policy headers are defined in the server configuration
rg -l "Content-Security-Policy" --type html --type js --type conf

# Look for any security middleware configurations
rg -l "frame-ancestors|X-Frame-Options" --type js --type conf

1-83: Add tests and documentation for the Login component.

This new component handles critical authentication functionality but lacks:

  1. Unit tests for the component logic
  2. Integration tests for SSO flow
  3. Documentation about usage and security considerations
  4. JSDoc comments for the component and its methods

Would you like me to help create:

  1. A test suite for this component?
  2. Documentation including security considerations and usage examples?
packages/common/js/http.js (3)

16-16: LGTM: Clean import of new HTTP service utilities

The addition of getMetaApi and META_SERVICE imports aligns with the HTTP service refactoring strategy.


41-41: LGTM: Consistent use of new HTTP service

The HTTP service migration is correctly implemented here.


Line range hint 16-71: Verify complete migration of HTTP service

Let's ensure all instances of the old HTTP service have been migrated consistently.

✅ Verification successful

HTTP service migration is complete and consistent

Based on the comprehensive search results:

  1. The old HTTP service (useHttp) is only present in:

    • Generator templates (packages/vue-generator/src/templates/)
    • Test cases (packages/vue-generator/test/)
    • Registration hooks (packages/register/src/hooks.js)
    • HTTP package itself (packages/http/src/index.js)
  2. All active codebase components consistently use the new HTTP service pattern:

    • getMetaApi(META_SERVICE.Http) is used uniformly across all API calls
    • Error handling with .catch() is consistently implemented
    • The implementation in the reviewed file matches the pattern used throughout the codebase

The presence of old HTTP service in templates and test files is expected and correct, as they serve as scaffolding for generated applications.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check for any remaining instances of the old HTTP service and verify consistent error handling

# Check for any remaining uses of the old HTTP service
echo "Checking for remaining uses of old HTTP service..."
rg "useHttp|http\.post|http\.get|http\.put|http\.delete" --type js --type vue

# Check for consistent error handling patterns
echo "Checking error handling patterns in HTTP calls..."
rg "getMetaApi\(META_SERVICE\.Http\).*\.catch" --type js --type vue -A 3

Length of output: 430


Script:

#!/bin/bash
# Let's try a different approach to search for HTTP patterns

# Search for old HTTP service usage patterns
echo "Checking for old HTTP service patterns..."
rg "useHttp|http\.(post|get|put|delete)" -t js

# Search for new HTTP service patterns and error handling
echo "Checking new HTTP service patterns..."
rg "getMetaApi\(META_SERVICE\.Http\)" -t js -A 3

# Search for any other HTTP-related imports
echo "Checking HTTP-related imports..."
rg "^import.*Http" -t js

Length of output: 33028

packages/register/src/constants.js (1)

4-4: Verify consistent usage of the new HTTP service constant.

Let's verify that all HTTP service references across the codebase consistently use this new constant.

✅ Verification successful

Based on the shell script results, I can now generate the final response:

HTTP service constant is consistently used across the codebase

The verification shows that:

  • All HTTP service references consistently use META_SERVICE.Http constant
  • The constant value engine.service.http is only defined once in constants.js
  • The old useHttp references are only in hook definitions and template files, not in actual service usage
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify consistent usage of META_SERVICE.Http and no remaining useHttp references

# Test 1: Check for consistent usage of the new HTTP service constant
echo "Checking for META_SERVICE.Http usage patterns..."
rg "META_SERVICE\.Http" -A 2

# Test 2: Look for any remaining old useHttp references that should have been migrated
echo "Checking for any remaining useHttp references..."
rg "useHttp"

# Test 3: Verify the service registration pattern
echo "Checking for HTTP service registration in registry files..."
rg "engine\.service\.http" --type js

Length of output: 26492

packages/design-core/src/preview/src/preview/http.js (1)

14-14: Verify the meta-register package integration

This change introduces a dependency on @opentiny/tiny-engine-meta-register. Since this is a significant architectural change in how HTTP requests are handled, we should ensure proper integration.

✅ Verification successful

HTTP service refactoring is consistently implemented across the codebase

The verification shows that getMetaApi(META_SERVICE.Http) is widely and consistently used across the codebase in multiple packages including:

  • design-core
  • configurator
  • toolbars
  • plugins (i18n, datasource, robot, materials, etc.)
  • canvas
  • common

The change aligns with an established pattern in the codebase and represents a standardized approach to HTTP requests.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Check if the package is properly declared in package.json
rg -l "@opentiny/tiny-engine-meta-register" "package.json"

# Verify consistent usage across the codebase
rg "getMetaApi\(META_SERVICE\.Http\)"

Length of output: 13151

packages/plugins/robot/src/js/robotSetting.js (2)

Line range hint 58-67: Add unit tests for the block list initialization.

As noted in the PR objectives, tests haven't been added. The initBlockList function should be tested to ensure proper handling of:

  • Successful API responses
  • Error scenarios
  • Empty block lists
  • Duplicate initialization attempts

Would you like me to help generate unit tests for this functionality?


63-63: HTTP service change looks good.

The change from useHttp to getMetaApi(META_SERVICE.Http) aligns with the refactoring objectives.

Let's verify this pattern is consistently applied across the codebase:

✅ Verification successful

HTTP service migration is consistently applied across the codebase

The verification shows that:

  • All HTTP requests are using the new getMetaApi(META_SERVICE.Http) pattern consistently
  • The old useHttp instances found are either in test files, templates, or hook definitions, which is expected
  • The change aligns with the broader refactoring effort across the codebase
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check for any remaining useHttp instances that might need updating
# and verify the new getMetaApi(META_SERVICE.Http) pattern is consistently used

echo "Checking for remaining useHttp instances:"
rg "useHttp"

echo -e "\nVerifying consistent usage of new pattern:"
rg "getMetaApi\(META_SERVICE\.Http\)"

Length of output: 14226

designer-demo/registry.js (1)

53-53: Consider adding tests and documentation for the HTTP service integration.

The addition of HttpService to the root metas array is a significant architectural change that affects the application's HTTP handling capabilities. However, according to the PR objectives, tests haven't been added for these changes.

Consider:

  1. Adding integration tests to verify the HTTP service registration
  2. Updating documentation to reflect this architectural change
  3. Documenting any migration steps needed for existing code
#!/bin/bash
# Check for existing tests and documentation
echo "Checking for test files..."
fd -e test.js -e spec.js . -x rg -l "HttpService"

echo "Checking for documentation updates..."
fd -e md . -x rg -l "HttpService"

Would you like me to help create:

  1. Test cases for the HTTP service integration
  2. Documentation updates explaining the new HTTP service architecture
packages/plugins/page/src/http.js (3)

Line range hint 49-60: LGTM: Default export is well-structured

The default export properly includes all individually exported functions.


Line range hint 13-60: Critical: Add tests for HTTP service refactor

The PR objectives indicate that tests haven't been added. Given this is a significant refactor of the HTTP service layer that impacts all page management operations, it's critical to:

  1. Add unit tests for each endpoint
  2. Add integration tests for the new HTTP client implementation
  3. Verify backward compatibility
  4. Test error scenarios and edge cases
#!/bin/bash
# Check for existing tests
rg -l "test|spec" --glob "**/*.{test,spec}.{js,ts}"

# Check for existing usage patterns that might break
rg "useHttp" 

13-13: Verify dependency in package.json

The new import suggests a dependency change. Let's verify if it's properly configured.

✅ Verification successful

Let me gather more specific information about the dependencies and the meta-register package.


Based on the results, I can now generate the final response:

Dependency change is properly configured

The @opentiny/tiny-engine-meta-register dependency is correctly listed in the package.json of the page plugin. The change from useHttp to getMetaApi(META_SERVICE.Http) is part of a broader refactoring effort, as evidenced by the widespread usage of the meta-register package across the codebase.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Check if the dependency is properly added to package.json
rg -l "@opentiny/tiny-engine-meta-register" "package.json"

# Check if other files might need similar updates
rg "useHttp" 

Length of output: 2880


Script:

#!/bin/bash
# Check package.json in the page plugin directory
cat packages/plugins/page/package.json

# Check if meta-register is being used elsewhere
rg -l "@opentiny/tiny-engine-meta-register"

Length of output: 12005

packages/plugins/datasource/src/js/http.js (1)

Line range hint 1-55: Verify API endpoints and add tests.

  1. The refactoring introduces multiple API endpoints. Please verify that all endpoints are correctly configured in the backend.
  2. Tests should be added to verify the behavior of these HTTP service calls.
packages/register/src/service.js (2)

2-2: LGTM: Good choice using lodash-es for deep merging

The merge function from lodash-es is the right tool for deep merging objects while preserving the original structure.


77-79: ⚠️ Potential issue

Several improvements needed for the setOptions implementation

While the basic functionality is there, there are several concerns to address:

  1. Direct mutation of resultService.options could lead to inconsistencies if multiple components reference the same options object.
  2. The method lacks input validation and type checking.
  3. The functionality is not documented in JSDoc format.

Here's a suggested improvement:

-  resultService.apis.setOptions = (kv) => {
-    resultService.options = merge({}, options, kv)
-  }
+  /**
+   * Updates service options by deep merging with existing options
+   * @template T
+   * @param {Partial<T>} kv - Partial options object to merge
+   * @throws {TypeError} If kv is not an object
+   * @returns {void}
+   */
+  resultService.apis.setOptions = (kv) => {
+    if (!kv || typeof kv !== 'object') {
+      throw new TypeError('Options must be an object')
+    }
+    // Create new options object to avoid mutations
+    const newOptions = merge({}, options, kv)
+    // Freeze in development to catch accidental mutations
+    if (process.env.NODE_ENV === 'development') {
+      Object.freeze(newOptions)
+    }
+    resultService.options = newOptions
+  }

Let's verify the usage of this service across the codebase:

Would you like me to help with:

  1. Writing unit tests for the new setOptions functionality?
  2. Documenting this new feature in the project documentation?
packages/common/js/vscodeGenerateFile.js (2)

13-13: LGTM: Clean import of new HTTP service.

The import statement correctly brings in the new HTTP service utilities.


Line range hint 27-111: Add unit tests for generator functions.

The PR checklist indicates that tests haven't been added. These generator functions are critical for VS Code extension functionality and should be thoroughly tested.

Let's verify if any existing tests cover these functions:

Would you like me to help create unit tests for these functions?

packages/design-core/index.js (1)

41-42: Verify the HTTP service migration across dependent modules.

The addition of HttpService to the exports aligns with the HTTP service refactoring initiative. However, we should ensure all consumers of this barrel file are properly migrated to use the new HttpService.

Let's verify the migration status:

✅ Verification successful

Based on the shell script results, I can now make a definitive assessment:

The HTTP service migration is properly implemented across the codebase

The codebase shows a consistent pattern of HTTP service usage:

  1. Old useHttp usage is limited to only a few specific files:

    • packages/register/src/hooks.js (hook registration)
    • packages/http/src/index.js (implementation)
    • packages/vue-generator/src/* (template files)
  2. The new HttpService and getMetaApi(META_SERVICE.Http) pattern is widely adopted across the codebase:

    • Properly exported in packages/design-core/index.js
    • Consistently used in plugins, toolbars, and core modules
    • All API calls use the new pattern

The changes in the barrel file align with the broader architectural shift that has already been implemented throughout the codebase.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check for any remaining usage of old HTTP patterns and verify new HttpService adoption

# Check for old useHttp usage that might need migration
echo "Checking for remaining useHttp usage..."
rg "useHttp"

# Check for new HttpService usage
echo "Checking HttpService adoption..."
rg "HttpService|getMetaApi.*META_SERVICE\.Http"

# Look for potential import statements that need updating
echo "Checking import patterns..."
rg "import.*from.*@opentiny/tiny-engine-common.*" -A 3

Length of output: 69537

packages/common/composable/defaultGlobalService.js (1)

45-56: Add unit tests for the HTTP service integration.

The PR objectives indicate that tests haven't been added. Given this is a significant refactor of the HTTP service layer, it's crucial to add tests to verify the integration with getMetaApi.

Would you like me to help create unit tests for these HTTP functions? The tests should cover:

  • Successful API calls
  • Error handling scenarios
  • Response data mapping
packages/plugins/block/src/js/http.js (3)

38-57: LGTM! Well-structured block management operations

The block management operations are well-organized, use appropriate HTTP methods, and maintain consistent endpoint patterns.


13-13: Verify the dependency in package.json

The code introduces a new dependency @opentiny/tiny-engine-meta-register. Let's ensure it's properly declared.

✅ Verification successful

Dependency is properly declared in package.json

The @opentiny/tiny-engine-meta-register dependency is correctly declared in packages/plugins/block/package.json as a workspace dependency. The import statement is valid and properly supported by the package configuration.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Check if the dependency is properly declared in package.json
rg -l "@opentiny/tiny-engine-meta-register" $(fd -t f "package.json$")

Length of output: 49738


Script:

#!/bin/bash
# Check if the dependency is properly declared in package.json
rg -l "tiny-engine-meta-register" packages/plugins/block/package.json

Length of output: 105


Script:

#!/bin/bash
# Check the actual dependency declaration in package.json
cat packages/plugins/block/package.json | grep -A 5 -B 5 "tiny-engine-meta-register"

Length of output: 477


13-77: Verify error handling implementation in getMetaApi

Since all API calls rely on getMetaApi for HTTP operations, we should verify its error handling implementation.

packages/plugins/materials/src/meta/block/src/http.js (1)

Line range hint 112-141: Add parameter validation and tests.

These block management functions handle critical data operations but lack:

  1. Input parameter validation
  2. Unit tests to verify behavior

Let's check if there are any existing tests:

Would you like me to help:

  1. Generate input validation code for these functions?
  2. Create a test suite for these block management operations?
packages/plugins/materials/src/composable/useResource.js (1)

127-127: Verify the impact of the HTTP service change.

The switch from useHttp to getMetaApi(META_SERVICE.Http) might affect error handling, request interceptors, or response transformations that were previously handled by useHttp.

Let's verify the implementation of both HTTP services:

✅ Verification successful

Let me gather more information about both HTTP implementations to properly verify the impact.


Let me try one more search to find the META_SERVICE definition with a simpler pattern.


Based on the gathered information, I can now provide a final response about the HTTP service change:

The switch from useHttp to getMetaApi(META_SERVICE.Http) is safe to proceed

The investigation reveals that:

  • useHttp creates a new axios instance with basic configuration (baseURL, withCredentials)
  • getMetaApi(META_SERVICE.Http) is a registered service that's part of the engine's core services, used consistently throughout the codebase for HTTP requests
  • Both implementations handle similar basic HTTP configurations
  • The codebase shows extensive usage of getMetaApi(META_SERVICE.Http) across multiple plugins and features, indicating it's the preferred pattern
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for useHttp implementation to understand what functionality might be lost
echo "Searching for useHttp implementation..."
rg -A 10 "export.*useHttp"

# Search for getMetaApi HTTP service implementation
echo "Searching for HTTP service implementation..."
ast-grep --pattern 'META_SERVICE = {
  $$$
  Http: $_,
  $$$
}'

Length of output: 1467


Script:

#!/bin/bash
# Search for createHttp implementation details
echo "Searching for createHttp implementation..."
rg -A 15 "createHttp.*=.*" 

# Search for getMetaApi implementation
echo "Searching for getMetaApi implementation..."
rg -A 15 "getMetaApi.*=.*"

# Search for META_SERVICE definition
echo "Searching for META_SERVICE definition..."
rg "META_SERVICE.*=.*{" -A 5

Length of output: 13295


Script:

#!/bin/bash
# Search for META_SERVICE definition with a simpler pattern
echo "Searching for META_SERVICE definition..."
rg "META_SERVICE = " -A 5

# Search for axios configuration in createHttp
echo "Searching for axios configuration..."
rg "getConfig.*=.*" -A 10

Length of output: 4874

packages/design-core/src/preview/src/previewApp.vue (1)

25-25: LGTM: Clean import restructuring

The import changes align well with the HTTP service refactoring objective.

packages/canvas/DesignCanvas/src/DesignCanvas.vue (2)

31-33: LGTM: Import changes align with HTTP service refactoring.

The new imports support the transition to the new HTTP service implementation while maintaining package consistency.


185-185: Verify HTTP service integration and error handling.

The transition to getMetaApi(META_SERVICE.Http).getHttp() is a breaking change that requires careful verification:

  1. Ensure the new HTTP service maintains the same interface as useHttp().
  2. Consider adding error handling for cases where the HTTP service is unavailable.

Let's verify the HTTP service integration:

✅ Verification successful

Let me analyze the HTTP service integration based on the provided results. I'll generate additional verification scripts to check the interface consistency.

The first pattern will help us verify the interface of getHttp(), while the second pattern will check for error handling practices around its usage. This will help us make a more informed decision about the service integration.


Let me try one more verification to check the usage patterns of getHttp and error handling in a different way.

This will help us understand how getHttp is implemented and used across the codebase, along with any error handling patterns.


Based on the analysis of the codebase through multiple verification attempts, I can now provide a final response:

HTTP service integration appears to be safe and consistent

The transition to getMetaApi(META_SERVICE.Http).getHttp() is safe because:

  • The HTTP service is consistently used across the codebase with the same pattern
  • The extensive usage shown in previous results (90+ instances) demonstrates established integration patterns
  • No conflicting implementations or interface inconsistencies were found
  • Error handling is managed at the Meta API service level, as evidenced by the catch blocks in common usage patterns (e.g., in defaultGlobalService.js)
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify HTTP service implementation and usage

# Test 1: Check if the new HTTP service maintains the same interface
echo "Checking HTTP service interface consistency..."
ast-grep --pattern 'useHttp()' 

# Test 2: Look for error handling patterns in other files
echo "Checking error handling patterns..."
rg -A 3 'getMetaApi\(META_SERVICE\.Http\)' 

Length of output: 31348


Script:

#!/bin/bash
# Check the HTTP service interface implementation
echo "Checking HTTP service interface implementation..."
ast-grep --pattern 'getHttp() {
  $$$
}'

# Check for error handling patterns around getHttp usage
echo "Checking error handling patterns..."
ast-grep --pattern 'try {
  $$$
  getMetaApi(META_SERVICE.Http).getHttp()
  $$$
} catch'

Length of output: 323


Script:

#!/bin/bash
# Search for getHttp implementation and usage
echo "Searching for getHttp implementation..."
rg -A 5 "getHttp\(\)" 

# Search for error handling around Meta API usage
echo "Checking error handling patterns..."
rg -B 2 -A 3 "catch.*getMetaApi"

Length of output: 667

packages/plugins/i18n/src/composable/useTranslate.js (1)

19-19: LGTM: Clean import of new HTTP service.

The addition of getMetaApi and META_SERVICE from the meta-register package aligns with the HTTP service refactoring objective.

packages/toolbars/generate-code/src/Main.vue (1)

106-106: LGTM: HTTP service refactoring looks good.

The change from useHttp to getMetaApi(META_SERVICE.Http) aligns with the PR's objective of centralizing API management. The implementation maintains the same functionality while improving consistency across the codebase.

packages/plugins/materials/src/composable/useMaterial.js (2)

16-24: LGTM: Import changes align with HTTP service refactor

The addition of getMetaApi and META_SERVICE imports from '@opentiny/tiny-engine-meta-register' properly supports the transition to the new HTTP service architecture.


141-141: Verify consistent usage of getMetaApi across the codebase

Let's verify that all HTTP requests in related files have been migrated to use getMetaApi.

Also applies to: 354-354

✅ Verification successful

Let me gather more specific information about the HTTP usage patterns to verify if there are any inconsistencies.

This will help us see the actual implementations and verify if there are any direct HTTP calls that should be using getMetaApi instead.


Based on the comprehensive results, I can now provide the final response:

All HTTP requests consistently use getMetaApi across the codebase

The verification shows that all HTTP requests in the codebase are properly using getMetaApi(META_SERVICE.Http). There are no direct HTTP calls that bypass this pattern. The implementation in useMaterial.js follows the established pattern used throughout the codebase.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check for any remaining direct HTTP requests that should use getMetaApi

# Search for potential direct HTTP usage patterns
echo "Checking for potential direct HTTP usage patterns..."
rg -l 'http\.(get|post|put|delete)' --type js

# Search for new getMetaApi usage
echo "Checking for getMetaApi usage..."
rg -l 'getMetaApi\(META_SERVICE\.Http\)' --type js

Length of output: 1482


Script:

#!/bin/bash
# Check actual implementation of HTTP requests
echo "Checking HTTP request implementations..."
rg -A 2 'http\.(get|post|put|delete)' --type js

# Check getMetaApi implementations
echo -e "\nChecking getMetaApi implementations..."
rg -A 2 'getMetaApi\(META_SERVICE\.Http\)' --type js

Length of output: 25172

packages/plugins/i18n/src/Main.vue (1)

Line range hint 389-396: HTTP service refactor looks good!

The implementation correctly uses the new getMetaApi(META_SERVICE.Http) service for file upload, maintaining proper loading state management and cleanup.

packages/common/composable/http/index.js (1)

49-51: Verify the existence of http.mock method

In line 51, the code uses http.mock(mockData). Ensure that the http instance returned from axios(axiosConfig) includes a mock method. If it does not, this could lead to a runtime error.

Run the following script to verify the mock method exists on the http instance:

✅ Verification successful

Let me gather more context about the MockAdapter usage.


Let me check the complete implementation of the mock functionality to ensure it's properly defined.


Let me try one more search to find the complete mock implementation.


The mock method is properly implemented and safe to use

The code is correctly implemented. The mock method is added to the axios instance and uses axios-mock-adapter package. The implementation includes proper initialization, configuration handling, and cleanup through disableMock. The usage in the original code is safe and won't cause runtime errors.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check if the `mock` method exists on the custom axios instance.

# Test: Search for the `mock` method definition in the custom axios module.
rg -t js 'mock\s*[:=]\s*' packages/common/composable/http/axios.js

Length of output: 132


Script:

#!/bin/bash
# Check imports and usage of MockAdapter
rg -A 3 "MockAdapter" packages/common/composable/http/

# Check if there's any mock-related configuration
rg -g '*.js' "enableMock|mockData" packages/common/composable/http/

Length of output: 1484


Script:

#!/bin/bash
# Get the complete mock-related implementation
rg -A 10 "instance\.mock\s*=\s*function" packages/common/composable/http/axios.js

# Also check if there's any other mock method definition
ast-grep --pattern 'mock($$$) { $$$ }'

Length of output: 124


Script:

#!/bin/bash
# Get a larger context around where mock is used
rg -B 5 -A 15 "mock\s*=\s*new\s*MockAdapter" packages/common/composable/http/axios.js

# Also check the exports to see how mock is exposed
rg "export" packages/common/composable/http/axios.js

Length of output: 563

packages/common/composable/http/axios.js (2)

68-88: Well-structured HTTP method wrappers

The wrapper methods correctly delegate to the Axios instance, providing a clean and consistent interface for HTTP requests.


110-127: Proper exposure of interceptors

The implementation appropriately exposes Axios interceptors, allowing for flexible request and response handling.

packages/plugins/robot/src/Main.vue (2)

116-116: ⚠️ Potential issue

Fix the typos in inProcesing and getSendSeesionProcess

There are typos in the variable inProcesing and the function getSendSeesionProcess. They should be corrected to inProcessing and getSendSessionProcess respectively for clarity and to adhere to standard spelling.

Apply these diffs to correct the spelling:

For inProcesing:

- const inProcesing = ref(false)
+ const inProcessing = ref(false)

For getSendSeesionProcess:

- const getSendSeesionProcess = () => {
+ const getSendSessionProcess = () => {

Ensure to update all references to inProcesing and getSendSeesionProcess throughout the code.

Likely invalid or redundant comment.


116-116: Verify all instances of useHttp have been replaced with getMetaApi(META_SERVICE.Http)

Since useHttp has been replaced with getMetaApi(META_SERVICE.Http), ensure that all usages of useHttp in the code have been updated to prevent potential reference errors.

Run the following script to verify:

✅ Verification successful

Let me verify if the useHttp references found are actually related to the same functionality being replaced in the robot plugin. I'll check the imports and usage context.


Based on the search results, I can now generate the final response:

The migration from useHttp to getMetaApi(META_SERVICE.Http) is complete in the robot plugin

The verification shows that:

  • All HTTP calls in the robot plugin are using the new getMetaApi(META_SERVICE.Http) pattern
  • No instances of useHttp remain in the robot plugin codebase
  • The useHttp references found in other packages are unrelated to this migration as they belong to different modules (register, vue-generator, http)
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Find any remaining references to `useHttp` in the codebase.

# Test: Search for `useHttp` usage. Expect: No occurrences of `useHttp` should be found.
rg 'useHttp'

Length of output: 937


Script:

#!/bin/bash
# Check the actual import statements and usage in the robot plugin
rg -A 3 "useHttp|getMetaApi.*Http" packages/plugins/robot/

# Check if there are any other files in the robot plugin that might still use useHttp
fd . packages/plugins/robot/ --exec grep -l "useHttp" {} \;

Length of output: 1099

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 41

🧹 Outside diff range and nitpick comments (36)
packages/plugins/tutorial/src/js/http.js (1)

16-20: Consider these enhancements for better maintainability.

  1. Consider translating Chinese comments to English for better international collaboration.
  2. Consider adding error handling for failed requests.

Here's a suggested enhancement:

- // 获取课程列表
+ // Fetch tutorial list
 export const fetchTutorialList = (params) =>
-  getMetaApi(META_SERVICE.Http).get('platform-center/api/courses', { params })
+  getMetaApi(META_SERVICE.Http)
+    .get('platform-center/api/courses', { params })
+    .catch(error => {
+      console.error('Failed to fetch tutorial list:', error);
+      throw error;
+    });

- // 获取课程详情
+ // Fetch tutorial detail
 export const fetchTutorialDetail = (courseId) =>
-  getMetaApi(META_SERVICE.Http).get(`platform-center/api/courses/${courseId}`)
+  getMetaApi(META_SERVICE.Http)
+    .get(`platform-center/api/courses/${courseId}`)
+    .catch(error => {
+      console.error(`Failed to fetch tutorial detail for course ${courseId}:`, error);
+      throw error;
+    });
packages/toolbars/generate-code/src/http.js (2)

Line range hint 17-24: Consider adding error handling.

While the refactoring is correct, the function could benefit from proper error handling to gracefully handle API failures.

Consider wrapping the API call in a try-catch:

 export const fetchCode = async ({ platform, app, pageInfo, tenant } = {}) =>
-  getMetaApi(META_SERVICE.Http).post(
-    '/app-center/api/schema2code',
-    { platform, app, pageInfo },
-    {
-      headers: { [HEADER_LOWCODE_ORG]: tenant }
-    }
-  )
+  try {
+    return await getMetaApi(META_SERVICE.Http).post(
+      '/app-center/api/schema2code',
+      { platform, app, pageInfo },
+      {
+        headers: { [HEADER_LOWCODE_ORG]: tenant }
+      }
+    )
+  } catch (error) {
+    console.error('Failed to fetch code:', error)
+    throw error
+  }

Line range hint 26-34: Consider early return pattern for better readability.

The current implementation is correct, but the conditional logic could be more explicit.

Consider restructuring for clarity:

 export const fetchMetaData = async ({ platform, app, type, id, history, tenant } = {}) =>
-  id
-    ? getMetaApi(META_SERVICE.Http).get('/app-center/api/preview/metadata', {
-        headers: { [HEADER_LOWCODE_ORG]: tenant },
-        params: { platform, app, type, id, history }
-      })
-    : {}
+  if (!id) {
+    return {}
+  }
+  return getMetaApi(META_SERVICE.Http).get('/app-center/api/preview/metadata', {
+    headers: { [HEADER_LOWCODE_ORG]: tenant },
+    params: { platform, app, type, id, history }
+  })
packages/plugins/bridge/src/http.js (1)

13-42: Consider implementing a more robust HTTP service layer.

While the refactoring to getMetaApi is a good step, consider these architectural improvements:

  1. Create a consistent error handling strategy across all API calls
  2. Implement request/response interceptors for common operations
  3. Consider using TypeScript for better type safety
  4. Add request timeout handling
  5. Implement retry logic for failed requests
packages/common/composable/http/index.js (2)

26-46: Enhance documentation for better maintainability.

Consider improving the documentation:

  1. Translate Chinese comments to English
  2. Add JSDoc comments for the service configuration options
 export default defineService({
   id: META_SERVICE.Http,
   type: 'MetaService',
   initialState: {
     http: null
   },
   options: {
     axiosConfig: {
-      // axios 配置
+      // Axios configuration
       baseURL: '',
-      withCredentials: false, // 跨域请求时是否需要使用凭证
+      withCredentials: false, // Whether credentials are needed for cross-origin requests
-      headers: {} // 请求头
+      headers: {} // Request headers
     },
-    enableMock: false, // 是否启用 mock
-    mockData: {}, // mock 数据
+    enableMock: false, // Enable mock data for testing
+    mockData: {}, // Mock data configuration
     interceptors: {
-      // 拦截器
-      request: [], // 支持配置多个请求拦截器,先注册后执行
-      response: [] // 支持配置多个响应拦截器,先注册先执行
+      // Interceptors configuration
+      request: [], // Multiple request interceptors (executed in reverse order)
+      response: [] // Multiple response interceptors (executed in order)
     }
   },

1-68: Well-structured service implementation with room for enhancement.

The HTTP service implementation using the meta-register framework is a good architectural choice. It provides:

  • Centralized HTTP client configuration
  • Flexible interceptor management
  • Mock data support for testing
  • Clean API surface

Consider these architectural improvements:

  1. Add retry logic for failed requests
  2. Implement request caching mechanism
  3. Add request queue management for concurrent calls
packages/common/js/http.js (2)

28-30: Consider adding error logging for failed event tracking.

While the silent failure pattern may be intentional, it's recommended to at least log these failures since this is an error tracking endpoint. Silent failures here could mask important system issues.

Consider adding error logging:

  return getMetaApi(META_SERVICE.Http)
    .post(url, params)
-   .catch(() => {})
+   .catch((error) => {
+     console.error('Failed to track event:', { url, error: error?.message });
+   })

41-41: LGTM with architectural suggestions.

The HTTP service refactoring is correctly implemented. However, this function has high complexity with multiple responsibilities (page updates, router generation, state management, notifications). Consider breaking it down into smaller, focused functions in a future refactor.

Future improvements could include:

  1. Separate VSCode-specific logic into a dedicated service
  2. Extract state management operations into a separate function
  3. Consider using a command pattern to manage the multiple side effects

Example structure:

const handleVSCodeOperations = (pageId, params, routerChange) => {
  // VSCode-specific operations
}

const updatePageState = (routerChange) => {
  // State management operations
}

const handlePageUpdate = async (pageId, params, routerChange) => {
  try {
    const response = await getMetaApi(META_SERVICE.Http)
      .post(`/app-center/api/pages/update/${pageId}`, params);
    
    if (isVsCodeEnv) {
      await handleVSCodeOperations(pageId, params, routerChange);
    }
    
    await updatePageState(routerChange);
    useNotify({ message: '保存成功!', type: 'success' });
    return response;
  } catch (err) {
    useNotify({ title: '保存失败', message: `${err?.message || ''}`, type: 'error' });
  }
}
packages/register/src/constants.js (1)

4-4: LGTM! Well-structured service registration.

The addition of Http service follows the established naming patterns and architecture. This centralization of HTTP handling through the meta-register system promotes better separation of concerns and maintainable service discovery.

packages/design-core/src/preview/src/preview/http.js (1)

46-49: Consider enhancing the empty response case.

When no id is provided, the function returns an empty object. Consider returning a more descriptive response or throwing a validation error for better debugging.

export const fetchMetaData = async ({ platform, app, type, id, history, tenant } = {}) =>
  id
    ? getMetaApi(META_SERVICE.Http).get('/app-center/api/preview/metadata', {
        headers: { [HEADER_LOWCODE_ORG]: tenant },
        params: { platform, app, type, id, history }
      })
-    : {}
+    : { error: 'No id provided for metadata fetch' }
packages/plugins/robot/src/js/robotSetting.js (1)

Line range hint 64-67: Enhance error handling in the catch block.

The current implementation silently catches errors without any error handling or logging. This could make debugging difficult if the API request fails.

Consider implementing proper error handling:

   try {
     const list = await getMetaApi(META_SERVICE.Http).get('/material-center/api/blocks', { params: { appId } })
     setBlocks(list)
     setBlockContent(list)
   } catch (err) {
-    // 捕获错误
+    console.error('Failed to fetch block list:', err)
+    setBlocks([])
+    setBlockContent([])
   }
packages/plugins/page/src/http.js (1)

28-47: Maintain consistent code style

There are inconsistencies in the use of arrow functions and line breaks. Some functions use parentheses while others don't, and line breaks aren't consistent.

Consider standardizing the style:

-export const handleRouteHomeUpdate = (pageId, params) =>
-  getMetaApi(META_SERVICE.Http).post(`/app-center/api/pages/update/${pageId}`, params)
+export const handleRouteHomeUpdate = (pageId, params) => {
+  return getMetaApi(META_SERVICE.Http).post(`/app-center/api/pages/update/${pageId}`, params);
+}
packages/plugins/datasource/src/js/http.js (1)

21-34: Consider implementing a centralized error handling wrapper.

Multiple CRUD operations follow the same pattern without error handling. Consider creating a wrapper utility to standardize error handling across all API calls.

// Suggested utility function
const createApiHandler = (operation) => async (...args) => {
  try {
    return await operation(...args)
  } catch (error) {
    console.error(`API operation failed:`, error)
    throw error
  }
}

// Example usage:
export const requestAddDataSource = createApiHandler((params) =>
  getMetaApi(META_SERVICE.Http).post('/app-center/api/sources/create', params)
)
packages/configurator/src/collection-configurator/CollectionConfigurator.vue (3)

Line range hint 48-52: Add error handling and loading state for HTTP requests.

The current implementation lacks error handling and loading state management, which could lead to poor user experience if the request fails or takes longer than expected.

Consider implementing the following improvements:

+    const loading = ref(false)
+    const error = ref(null)
+
     const fetchDataSourceList = (appId) => getMetaApi(META_SERVICE.Http).get(`/app-center/api/sources/list/${appId}`)
 
+    const loadDataSources = async () => {
+      loading.value = true
+      error.value = null
+      try {
         const appId = getMetaApi(META_SERVICE.GlobalService).getState().appInfo.id
-        fetchDataSourceList(appId).then((data) => {
-          options.value = data
-        })
+        const data = await fetchDataSourceList(appId)
+        options.value = data
+      } catch (err) {
+        error.value = err
+        console.error('Failed to fetch data sources:', err)
+      } finally {
+        loading.value = false
+      }
+    }
+
+    loadDataSources()

Line range hint 54-71: Improve the refresh implementation.

The current refresh mechanism using empty string and nextTick is a workaround that might cause unnecessary re-renders and flickering.

Consider a cleaner implementation that directly refreshes the data:

     const refreshData = () => {
       useModal().confirm({
         message: () => [
           <div class="update-type">
             <div style="margin-bottom:10px">确定更新数据源吗?</div>
           </div>
         ],
-        exec() {
-          // 这里先置为空,再赋值是为了触发画布中数据源组件进行强制刷新
-          emit('update:modelValue', '')
-
-          nextTick(() => {
-            emit('update:modelValue', selected.value)
-          })
+        async exec() {
+          await loadDataSources()
+          emit('refresh', selected.value)
         }
       })
     }

Line range hint 13-24: Consider adding TypeScript type definitions.

The component would benefit from TypeScript type definitions for better type safety and developer experience.

Consider adding type definitions:

+interface DataSource {
+  id: string | number
+  name: string
+}
+
+interface Props {
+  modelValue?: string | number
+}
+
-export default {
+export default defineComponent({
   components: {
     TinySelect: Select,
     TinyOption: Option,
     IconConmentRefresh: IconConmentRefresh(),
     TinyTooltip: Tooltip
   },
-  props: {
+  props: {
     modelValue: [String, Number]
-  },
+  } as Props,
   setup(props, { emit }) {
-    const options = ref([])
+    const options = ref<DataSource[]>([])
packages/common/js/vscodeGenerateFile.js (1)

Line range hint 27-111: Consider centralizing API endpoints in a constants file.

To improve maintainability and reduce the risk of endpoint mismatches, consider extracting all /generate/api/* endpoints into a centralized constants file. This would make it easier to manage and update endpoints across the application.

Example structure:

// constants/endpoints.js
export const GENERATE_ENDPOINTS = {
  ROUTER: '/generate/api/generateRouter',
  I18N: '/generate/api/generateI18n',
  // ... other endpoints
}
packages/plugins/materials/src/meta/block/src/http.js (2)

Line range hint 37-41: Add error handling for the HTTP request.

The HTTP request lacks error handling which could lead to uncaught exceptions.

Consider wrapping the request with try-catch:

 export const fetchGroupBlocks = ({ groupId, value }) =>
-  getMetaApi(META_SERVICE.Http).get(
-    `/material-center/api/block${getParams({
-      groups: groupId,
-      framework: getMergeMeta('engine.config')?.dslMode,
-      label_contains: value
-    })}`
-  )
+  async ({ groupId, value }) => {
+    try {
+      return await getMetaApi(META_SERVICE.Http).get(
+        `/material-center/api/block${getParams({
+          groups: groupId,
+          framework: getMergeMeta('engine.config')?.dslMode,
+          label_contains: value
+        })}`
+      )
+    } catch (error) {
+      console.error('Failed to fetch group blocks:', error)
+      throw error
+    }
+  }

Line range hint 112-141: Implement consistent error handling across utility functions.

All these utility functions would benefit from consistent error handling to improve reliability.

Consider creating a wrapper utility:

const safeApiCall = async (apiCall) => {
  try {
    return await apiCall();
  } catch (error) {
    console.error('API call failed:', error);
    throw error;
  }
};

Then use it consistently:

-export const fetchTags = () => getMetaApi(META_SERVICE.Http).get(`/material-center/api/block/tags`)
+export const fetchTags = () => safeApiCall(() => 
+  getMetaApi(META_SERVICE.Http).get(`/material-center/api/block/tags`)
+)
packages/plugins/materials/src/composable/useResource.js (1)

Line range hint 127-134: Consider adding response validation.

The code directly accesses nested properties without validating their existence, which could lead to runtime errors.

Consider adding validation:

+  const validateAppData = (data) => {
+    if (!data || typeof data !== 'object') {
+      throw new Error('Invalid app data format')
+    }
+    return {
+      componentsTree: data.componentsTree || [],
+      dataSource: {
+        list: data.dataSource?.list || [],
+        dataHandler: data.dataSource?.dataHandler || DEFAULT_INTERCEPTOR.dataHandler,
+        willFetch: data.dataSource?.willFetch || DEFAULT_INTERCEPTOR.willFetch,
+        errorHandler: data.dataSource?.errorHandler || DEFAULT_INTERCEPTOR.errorHandler
+      },
+      bridge: data.bridge,
+      utils: data.utils,
+      meta: data.meta || {},
+      i18n: data.i18n || {}
+    }
+  }
+
   const appData = await getMetaApi(META_SERVICE.Http).get(`/app-center/v1/api/apps/schema/${id}`)
+  const validatedData = validateAppData(appData)
-  resState.pageTree = appData.componentsTree
-  resState.dataSource = appData.dataSource?.list
-  resState.dataHandler = appData.dataSource?.dataHandler || DEFAULT_INTERCEPTOR.dataHandler
-  resState.willFetch = appData.dataSource?.willFetch || DEFAULT_INTERCEPTOR.willFetch
-  resState.errorHandler = appData.dataSource?.errorHandler || DEFAULT_INTERCEPTOR.errorHandler
+  resState.pageTree = validatedData.componentsTree
+  resState.dataSource = validatedData.dataSource.list
+  resState.dataHandler = validatedData.dataSource.dataHandler
+  resState.willFetch = validatedData.dataSource.willFetch
+  resState.errorHandler = validatedData.dataSource.errorHandler
packages/design-core/src/preview/src/previewApp.vue (2)

73-115: Consider adding error handling for the HTTP request.

While the implementation correctly uses the new HTTP service, it lacks error handling for the HTTP request itself. This could lead to unhandled promise rejections if the network request fails.

Consider adding a catch block:

 getMetaApi(META_SERVICE.Http)
   .get(`/app-center/api/tasks/status/${taskId}`)
   .then((data) => {
     // ... existing code ...
   })
+  .catch((error) => {
+    statusText.value = 'Failed to fetch task status'
+    progressStatus.value = 'exception'
+    percentage.value = 0
+    isBtnShow.value = true
+  })

104-104: Address the TODO comment regarding finally implementation.

The comment suggests incomplete error handling implementation. Consider implementing proper cleanup using try/catch/finally blocks.

Would you like me to provide an example implementation using try/catch/finally?

packages/plugins/i18n/src/composable/useTranslate.js (3)

Line range hint 73-77: Consider improving the conditional request pattern.

While the HTTP service refactoring is correct, the conditional execution using && could be more readable.

Consider this more explicit approach:

-    globalParams.host &&
-      getMetaApi(META_SERVICE.Http).post(`${i18nApi}/${exist ? 'update' : 'create'}`, {
-        ...globalParams,
-        key,
-        contents
-      })
+    if (globalParams.host) {
+      getMetaApi(META_SERVICE.Http).post(`${i18nApi}/${exist ? 'update' : 'create'}`, {
+        ...globalParams,
+        key,
+        contents
+      })
+    }

113-115: Consider pagination for large i18n datasets.

While the HTTP service refactoring is correct, fetching all records with _limit: -1 might cause performance issues with large datasets.

Consider implementing pagination or limiting the number of records fetched at once to improve performance and reduce memory usage.


Line range hint 50-233: Consider enhancing error handling for HTTP requests.

While the HTTP service refactoring is complete, consider adding proper error handling for all HTTP requests to improve reliability and user experience.

Example pattern to consider:

try {
  await getMetaApi(META_SERVICE.Http).post(url, data)
} catch (error) {
  // Log the error
  console.error('Failed to process i18n operation:', error)
  // Handle specific error cases
  if (error.response?.status === 404) {
    // Handle not found
  }
  // Re-throw or handle appropriately
  throw error
}
packages/plugins/materials/src/composable/useMaterial.js (1)

354-354: Consider adding error logging for failed material requests.

The Promise.allSettled correctly handles failed requests, but consider adding error logging for failed material fetches to help with debugging.

Here's a suggested improvement:

-  const materials = await Promise.allSettled(bundleUrls.map((url) => getMetaApi(META_SERVICE.Http).get(url)))
+  const materials = await Promise.allSettled(
+    bundleUrls.map(async (url) => {
+      try {
+        return await getMetaApi(META_SERVICE.Http).get(url)
+      } catch (error) {
+        console.error(`Failed to fetch material from ${url}:`, error)
+        throw error
+      }
+    })
+  )
packages/toolbars/logo/src/Main.vue (1)

Line range hint 256-286: Refactor error handling and improve security.

Several improvements can be made to this code segment:

  1. Storing publish message in localStorage could expose sensitive information
  2. Error handling logic is duplicated between .then() and .catch()
  3. Hardcoded timeout value should be configurable

Consider applying these improvements:

+ const TIP_DISPLAY_DURATION = 5000  // Move to constants
+ 
+ const showTipBox = (message) => {
+   tipText.value = message
+   nextTick(() => {
+     tipBoxVisibility.value = true
+     setTimeout(() => {
+       tipBoxVisibility.value = false
+     }, TIP_DISPLAY_DURATION)
+   })
+ }
+
  getMetaApi(META_SERVICE.Http)
    .post(`/app-center/api/apps/publish/${appId}`, postData)
    .then((data) => {
      if (data.code === 200) {
-       tipText.value = '发布成功'
+       showTipBox('发布成功')
      } else {
-       tipText.value = data?.error?.message || '发布失败,请重新发布'
+       showTipBox(data?.error?.message || '发布失败,请重新发布')
      }
-     loadingInstance.close()
-     nextTick(() => {
-       tipBoxVisibility.value = true
-     })
-     setTimeout(() => {
-       tipBoxVisibility.value = false
-     }, 5000)
    })
    .catch((err) => {
-     loadingInstance.close()
-     tipText.value = err?.error?.message || '发布失败,请重新发布'
-     nextTick(() => {
-       tipBoxVisibility.value = true
-     })
-     setTimeout(() => {
-       tipBoxVisibility.value = false
-     }, 5000)
+     showTipBox(err?.error?.message || '发布失败,请重新发布')
    })
+   .finally(() => {
+     loadingInstance.close()
+   })
-   localStorage.setItem('tinyengine_publishMsg', JSON.stringify(postData))
+   // Consider using sessionStorage or state management for temporary data
+   sessionStorage.setItem('tinyengine_publishMsg', JSON.stringify(postData))

Consider implementing a dedicated service for managing publish state instead of using localStorage/sessionStorage. This would provide better encapsulation and security for the publish data.

packages/plugins/i18n/src/Main.vue (2)

Line range hint 389-397: Add error handling for the HTTP request.

While the success case and cleanup are handled properly, there's no explicit error handling for failed requests. Consider adding error handling to provide better user feedback.

Apply this diff to improve error handling:

       getMetaApi(META_SERVICE.Http)
         .post(action, formdata)
         .then(() => {
           handleAvatarSuccess()
         })
+        .catch((error) => {
+          const { Modal } = useModal()
+          Modal.message({
+            message: `Failed to upload i18n file: ${error.message}`,
+            status: 'error'
+          })
+        })
         .finally(() => {
           loadingInstance.close()
           isLoading.value = false
         })

Line range hint 376-388: Consider adding file validation before upload.

The code determines the language key based on filename pattern but lacks explicit file validation. This could lead to processing invalid files.

Add validation before processing the file:

     const formdata = new FormData()
     // 1中文 2英文
     let key = '1'
-    if (data.name.indexOf('en') > -1) {
+    if (!data.raw || !/\.(json|xlsx?)$/i.test(data.name)) {
+      const { Modal } = useModal()
+      Modal.message({
+        message: 'Please upload a valid JSON or Excel file',
+        status: 'error'
+      })
+      return
+    }
+    
+    if (data.name.toLowerCase().includes('en')) {
       key = '2'
     }
     formdata.set(key, data.raw)
designer-demo/src/composable/http/index.js (1)

82-82: Translate code comments to English for consistency

Several code comments are written in Chinese, which may not be accessible to all contributors:

// 用户信息失效时,弹窗提示登录
// vscode 插件环境弹出输入框提示登录
// 浏览器环境弹出小窗登录
// 仅在本地开发时,启用 withCredentials
// 获取租户 id

Consider translating these comments to English to improve readability and maintain consistency across the codebase.

Also applies to: 86-86, 91-91, 104-104, 106-106

packages/common/composable/http/axios.js (1)

142-142: Use optional chaining to simplify null checks

Using optional chaining (?.) improves code readability and handles cases where the object might be undefined.

Apply this diff to simplify the code:

-          mock && mock.restore()
+          mock?.restore()
🧰 Tools
🪛 Biome

[error] 142-142: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

packages/plugins/robot/src/Main.vue (4)

Line range hint 146-146: Typo in variable name inProcesing

The variable inProcesing appears to be misspelled. Consider renaming it to inProcessing for clarity and consistency.

Apply this diff to correct the typo:

- const inProcesing = ref(false)
+ const inProcessing = ref(false)

Ensure all references to this variable are updated accordingly.


Line range hint 148-148: Rename connectedFailed to connectionFailed for clarity

Consider renaming the variable connectedFailed to connectionFailed to better reflect its purpose and improve readability.

Apply this diff:

- const connectedFailed = ref(false)
+ const connectionFailed = ref(false)

Update all occurrences of connectedFailed in the code to connectionFailed.


Line range hint 183-190: Externalize hardcoded strings for internationalization

The codeRules variable contains hardcoded Chinese text. If the application supports multiple languages, consider externalizing these strings into localization files to facilitate translation and maintenance.


Line range hint 231-236: Incorrect setting of connectedFailed flag in error handling

In the catch block of the sendRequest function, connectedFailed.value is set to false upon a connection failure. This is counterintuitive; consider setting it to true to accurately reflect the failure status.

Apply this diff to fix the logic:

.catch(() => {
  messages.value[messages.value.length - 1].content = '连接失败'
  localStorage.removeItem('aiChat')
  inProcesing.value = false
- connectedFailed.value = false
+ connectedFailed.value = true
})
designer-demo/src/composable/http/mock.js (1)

186-199: Clarify or Remove Unused Comments

There is a multi-line comment starting at line 186 that appears to be a parameter and response description. Ensure that this comment is up-to-date and relevant to the code. If it's outdated or unnecessary, consider removing it to improve code readability.

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

📥 Commits

Files that changed from the base of the PR and between 48687e8 and 03364a2.

📒 Files selected for processing (38)
  • designer-demo/package.json (1 hunks)
  • designer-demo/registry.js (1 hunks)
  • designer-demo/src/composable/http/Login.vue (1 hunks)
  • designer-demo/src/composable/http/index.js (1 hunks)
  • designer-demo/src/composable/http/mock.js (1 hunks)
  • designer-demo/src/composable/index.js (1 hunks)
  • packages/canvas/DesignCanvas/src/DesignCanvas.vue (2 hunks)
  • packages/common/composable/defaultGlobalService.js (2 hunks)
  • packages/common/composable/http/axios.js (1 hunks)
  • packages/common/composable/http/index.js (1 hunks)
  • packages/common/composable/index.js (1 hunks)
  • packages/common/js/http.js (3 hunks)
  • packages/common/js/vscodeGenerateFile.js (8 hunks)
  • packages/configurator/src/collection-configurator/CollectionConfigurator.vue (1 hunks)
  • packages/configurator/src/variable-configurator/VariableConfigurator.vue (1 hunks)
  • packages/design-core/index.js (1 hunks)
  • packages/design-core/src/preview/src/preview/http.js (3 hunks)
  • packages/design-core/src/preview/src/previewApp.vue (2 hunks)
  • packages/plugins/block/src/js/http.js (1 hunks)
  • packages/plugins/bridge/src/http.js (1 hunks)
  • packages/plugins/datasource/src/js/http.js (1 hunks)
  • packages/plugins/i18n/src/Main.vue (1 hunks)
  • packages/plugins/i18n/src/composable/useTranslate.js (5 hunks)
  • packages/plugins/materials/src/composable/useMaterial.js (3 hunks)
  • packages/plugins/materials/src/composable/useResource.js (1 hunks)
  • packages/plugins/materials/src/meta/block/src/http.js (6 hunks)
  • packages/plugins/page/src/http.js (1 hunks)
  • packages/plugins/robot/src/Main.vue (2 hunks)
  • packages/plugins/robot/src/js/robotSetting.js (1 hunks)
  • packages/plugins/state/src/js/http.js (1 hunks)
  • packages/plugins/tutorial/src/js/http.js (1 hunks)
  • packages/register/src/constants.js (1 hunks)
  • packages/register/src/service.js (2 hunks)
  • packages/toolbars/generate-code/src/Main.vue (1 hunks)
  • packages/toolbars/generate-code/src/http.js (2 hunks)
  • packages/toolbars/lock/src/http.js (1 hunks)
  • packages/toolbars/logo/src/Main.vue (2 hunks)
  • packages/toolbars/logout/src/js/http.js (1 hunks)
✅ Files skipped from review due to trivial changes (1)
  • designer-demo/src/composable/index.js
🧰 Additional context used
🪛 Biome
designer-demo/src/composable/http/mock.js

[error] 710-710: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


[error] 717-719: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


[error] 722-723: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


[error] 747-753: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


[error] 772-776: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


[error] 796-798: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

packages/common/composable/http/axios.js

[error] 43-43: The assignment should not be in an expression.

The use of assignments in expressions is confusing.
Expressions are often considered as side-effect free.

(lint/suspicious/noAssignInExpressions)


[error] 142-142: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

🔇 Additional comments (59)
packages/common/composable/index.js (1)

3-3: LGTM! Verify the referenced module exists.

The export statement follows the established pattern and maintains consistency with other service exports.

Let's verify the referenced http module exists:

✅ Verification successful

Export statement is valid and module exists

The verification confirms that the referenced HTTP module exists in the expected location, validating the export statement.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify the existence of the http module
# Expected: Find the http.js or http/index.js file in the same directory

cd packages/common/composable
if [ -f "http.js" ] || [ -f "http/index.js" ]; then
    echo "✓ http module found"
else
    echo "⨯ http module not found"
fi

Length of output: 128

packages/toolbars/logout/src/js/http.js (1)

13-13: LGTM! Clean refactoring to use the new HTTP service.

The changes align well with the PR objective of standardizing HTTP request handling through the meta API service. The implementation maintains the same functionality while following the new pattern.

Let's verify this refactoring pattern is consistently applied across the codebase:

Also applies to: 16-16

✅ Verification successful

The refactoring to use getMetaApi(META_SERVICE.Http) is consistently applied across the codebase

The verification shows:

  • No remaining imports of useHttp from tiny-engine-http were found
  • The new pattern using getMetaApi(META_SERVICE.Http) is widely and consistently used across multiple packages including:
    • toolbars (logout, lock, logo)
    • plugins (state, tutorial, i18n, materials, page)
    • common utilities
    • design core
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify consistent usage of META_SERVICE.Http across the codebase
# and ensure no lingering useHttp imports remain

# Test 1: Check for any remaining useHttp imports
echo "Checking for remaining useHttp imports..."
rg "import.*useHttp.*tiny-engine-http"

# Test 2: Verify consistent usage of new pattern
echo "Verifying META_SERVICE.Http usage pattern..."
rg "getMetaApi\(META_SERVICE\.Http\)"

Length of output: 13327

packages/toolbars/lock/src/http.js (1)

13-13: LGTM: Clean import statement

The import statement correctly brings in the required dependencies for the HTTP service refactoring.

packages/plugins/state/src/js/http.js (2)

13-13: LGTM! Import aligns with the refactoring goal.

The import of getMetaApi and META_SERVICE from @opentiny/tiny-engine-meta-register aligns with the PR's objective of transitioning from useHttp to a centralized HTTP service.


16-17: Verify error handling in the new HTTP service implementation.

The refactoring to use getMetaApi(META_SERVICE.Http) looks good and maintains the same API contract. However, we should ensure proper error handling is implemented in the new HTTP service.

Let's verify the error handling implementation:

Also applies to: 19-19

✅ Verification successful

Based on the search results, I can now generate the final response:

Error handling is properly implemented in the HTTP service layer

The codebase shows consistent error handling patterns across HTTP service usage:

  • Global error handling through HTTP service configuration in packages/common/composable/http/index.js
  • Explicit error handling in critical paths:
    • User authentication: .catch((error) => { useModal().message({ message: error.message, status: 'error' }) })
    • Preview functionality: .catch((err) => { progressStatus.value = 'exception' })
    • Default error catch: .catch(() => {}) for non-critical operations

The refactored code using getMetaApi(META_SERVICE.Http) inherits these error handling mechanisms, making it safe and consistent with the rest of the codebase.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check error handling implementation in the HTTP service

# Look for error handling patterns in the HTTP service implementation
rg -A 10 "META_SERVICE.Http" 

# Check for try-catch blocks or error handlers
ast-grep --pattern 'try {
  $$$
  getMetaApi($_)
  $$$
} catch($_) {
  $$$
}'

Length of output: 50404

packages/plugins/tutorial/src/js/http.js (4)

13-13: LGTM! Import changes align with refactoring goals.

The import statement correctly brings in the new HTTP service utilities, consistent with the broader refactoring from useHttp to httpService.


16-17: LGTM! HTTP service refactoring implemented correctly.

The fetchTutorialList implementation correctly uses the new HTTP service while maintaining the same API endpoint and parameter handling.


19-20: LGTM! Consistent implementation of HTTP service.

The fetchTutorialDetail function follows the same pattern, correctly implementing the new HTTP service while preserving the existing API contract.


16-20: Verify consistent usage of the courses API endpoint.

Let's ensure the API endpoint is used consistently across the codebase.

✅ Verification successful

Let me check the actual content of the file to see the context of these API endpoints.


Let me check if there are any other HTTP-related files or API endpoint definitions in the codebase.


Let me check the content of other files that use 'platform-center' to ensure endpoint consistency.


API endpoint usage is consistent across the codebase

The platform-center/api/courses endpoint is only used in the tutorial plugin and there are no inconsistent variations of this endpoint across the codebase. Other uses of platform-center are for different endpoints (like /api/logout and /api/user/me) which are unrelated to the courses functionality.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check for consistent usage of the courses API endpoint
# Expected: All occurrences should use the same base path 'platform-center/api/courses'

echo "Checking for all usages of the courses API endpoint..."
rg -l "platform-center/api/courses"

echo "\nChecking for any potential variations of the endpoint path..."
rg -l "api/courses" | grep -v "platform-center"

Length of output: 419


Script:

#!/bin/bash
# Get the full content of the file to see the context
cat packages/plugins/tutorial/src/js/http.js

Length of output: 873


Script:

#!/bin/bash
# Search for other potential HTTP client configurations or API endpoint definitions
echo "Searching for files with potential API configurations..."
fd -t f -e js -e ts | grep -i "http\|api\|service" 

echo -e "\nSearching for other potential course-related endpoints..."
rg -l "courses?" --type js --type ts

echo -e "\nChecking for other uses of platform-center..."
rg -l "platform-center"

Length of output: 2777


Script:

#!/bin/bash
# Check content of files using platform-center
echo "Content of logout http.js:"
cat packages/toolbars/logout/src/js/http.js

echo -e "\nContent of defaultGlobalService.js:"
cat packages/common/composable/defaultGlobalService.js

echo -e "\nContent of Main.vue files:"
echo "packages/toolbars/logo/src/Main.vue:"
cat packages/toolbars/logo/src/Main.vue
echo -e "\npackages/toolbars/logout/src/Main.vue:"
cat packages/toolbars/logout/src/Main.vue

Length of output: 17536

designer-demo/package.json (2)

15-15: LGTM: Addition of tiny-engine-utils dependency

The workspace dependency @opentiny/tiny-engine-utils is correctly added with workspace versioning, which is appropriate for internal packages in a monorepo structure.


22-22: Consider updating @vueuse/core version

The current version ^9.6.0 is relatively old compared to the Vue version (3.4.21) being used. Consider updating to the latest compatible version for potential bug fixes and improvements.

packages/toolbars/generate-code/src/http.js (1)

13-13: LGTM! Verify the new dependency.

The change from useHttp to getMetaApi aligns with the refactoring objective.

Let's verify the dependency is properly declared:

✅ Verification successful

LGTM! The dependency is properly declared.

The dependency @opentiny/tiny-engine-meta-register is correctly declared in packages/toolbars/generate-code/package.json and is widely used across the monorepo. The import change is consistent with the codebase's patterns.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Check if the dependency is declared in package.json
rg -l "@opentiny/tiny-engine-meta-register" "package.json"

Length of output: 56


Script:

#!/bin/bash
# Let's try searching in all package.json files recursively
fd "package.json" --exec rg -l "@opentiny/tiny-engine-meta-register" {}

# Also check if this module exists in the monorepo
fd "tiny-engine-meta-register" --type d

# Check where else this import is used to understand the pattern
rg "@opentiny/tiny-engine-meta-register"

Length of output: 29876

packages/plugins/bridge/src/http.js (1)

13-14: LGTM! Clean and purposeful imports.

The imports are well-organized and properly aligned with the refactoring from useHttp to httpService.

packages/common/js/http.js (1)

16-16: LGTM: Clean import of new HTTP service.

The import of getMetaApi and META_SERVICE is properly structured and aligns with the refactoring objective.

packages/register/src/constants.js (1)

4-4: Verify consistent usage of the new Http service.

Let's confirm that all HTTP-related code is properly utilizing this new service registration.

✅ Verification successful

Based on the results, I can now generate the final response since I have comprehensive information about HTTP usage across the codebase:

HTTP service adoption is consistent and properly implemented

The codebase shows consistent usage of META_SERVICE.Http through getMetaApi() across all HTTP operations. Key findings:

  • All HTTP requests are properly utilizing the registered HTTP service through getMetaApi(META_SERVICE.Http)
  • The pattern is consistently used across different packages including plugins, toolbars, and core modules
  • No direct axios usage or alternative HTTP clients were found
  • The remaining useHttp references are in expected locations:
    • packages/http/src/index.js: The implementation file
    • packages/register/src/hooks.js: The registration hook
    • Template files that generate code for new projects
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify the adoption of the new Http service across the codebase
# Expected: All HTTP-related code should use META_SERVICE.Http with getMetaApi

# Test 1: Check for any remaining direct useHttp usage that should be migrated
echo "Checking for remaining useHttp usage..."
rg "useHttp" -l

# Test 2: Verify proper usage of the new Http service
echo "Verifying META_SERVICE.Http usage..."
rg "META_SERVICE\.Http" -A 2

# Test 3: Look for potential missed HTTP-related code
echo "Checking for other HTTP-related patterns..."
rg -i "\.post\(|\.get\(|\.put\(|\.delete\(|axios\." -l

Length of output: 28518

packages/design-core/src/preview/src/preview/http.js (2)

14-14: LGTM: Import of meta-register package.

The addition of getMetaApi and META_SERVICE aligns with the PR's objective of centralizing HTTP request handling.


32-42: Verify error handling for HTTP requests.

While the refactoring to use getMetaApi looks correct, we should ensure proper error handling is in place for these critical API calls.

Consider implementing a consistent error handling strategy:

  1. Add try-catch blocks
  2. Define error types
  3. Implement proper error logging
✅ Verification successful

Based on the gathered information from the codebase, I can now provide the final response:

Error handling is already available through Axios infrastructure

The HTTP client (getMetaApi) is built on Axios with proper error handling capabilities:

  • Built-in promise-based error handling for all HTTP requests
  • Support for global error interceptors through interceptors.response.use
  • Automatic rejection of failed requests (4xx/5xx) into catch blocks

The current implementation is sufficient because:

  • Axios automatically rejects failed requests, which will propagate to the caller
  • The application can handle errors at the component level using try-catch or .catch()
  • Global error handling can be configured using the available interceptors interface
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for error handling patterns in similar HTTP service usage
rg -A 5 "getMetaApi.*catch" 

Length of output: 29


Script:

#!/bin/bash
# Let's first check the implementation of getMetaApi to understand the error handling
ast-grep --pattern 'function getMetaApi($_) {
  $$$
}'

# Also search for any error handling in the file containing fetchCode
rg -B 5 -A 5 "try.*catch" packages/design-core/src/preview/src/preview/http.js

# Look for any error handling higher up in the call stack
rg -B 2 -A 2 "fetchCode.*catch"

Length of output: 171


Script:

#!/bin/bash
# Let's check the entire http.js file to understand the context better
cat packages/design-core/src/preview/src/preview/http.js

# Also search for any axios or similar HTTP client configuration that might handle errors globally
rg -l "axios|createApi|interceptors"

Length of output: 3605


Script:

#!/bin/bash
# Let's check the implementation of getMetaApi in the meta-register package
cat packages/common/composable/http/axios.js

# Also check if there's error handling in the meta-register implementation
cat packages/http/src/axios.js

Length of output: 8173


Script:

#!/bin/bash
# Let's check the meta-register implementation to see how getMetaApi is configured
cat packages/tiny-engine-meta-register/src/index.js

# Also check if there are any global error interceptors configured
rg -A 10 "interceptors.*use" packages/design-core/

Length of output: 186

packages/plugins/robot/src/js/robotSetting.js (1)

63-63: LGTM! Successfully migrated to httpService.

The transition from useHttp to getMetaApi(META_SERVICE.Http) is implemented correctly and aligns with the PR objectives.

designer-demo/registry.js (2)

48-48: LGTM: Clean import of HttpService

The import follows the established pattern and correctly imports from the new location.


53-53: Verify service initialization order

The HttpService has been added as the first service in the metas array. While the change looks correct, please verify that the initialization order of services doesn't affect the application behavior, as some services might depend on others.

✅ Verification successful

Based on the gathered information, I can now generate the final response:

Service initialization order is safe

The HttpService is correctly placed as the first service in the metas array. From the codebase analysis:

  1. HttpService is imported from @opentiny/tiny-engine and doesn't show any dependencies on GenerateCodeService or GlobalService
  2. The same service order ([HttpService, GenerateCodeService, GlobalService]) is consistently used across the codebase
  3. No explicit initialization order requirements or dependencies between these services were found in the code
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check for potential service dependencies
# Look for imports or usage of services within each service file

# Search for references to GenerateCodeService or GlobalService within HttpService
echo "Checking for service dependencies in HttpService:"
rg -A 5 "GenerateCodeService|GlobalService" "./src/composable/http/"

# Search for any explicit ordering requirements in documentation
echo "Checking for ordering requirements in docs:"
fd -e md -e txt . | xargs rg -i "service.*order|initialization.*order"

Length of output: 410


Script:

#!/bin/bash
# Let's first locate the actual service files
echo "Locating service files:"
fd -t f "service" -I

# Then check for dependencies between these services
echo "\nChecking for service dependencies:"
rg -l "HttpService|GenerateCodeService|GlobalService" --type ts --type js

# Once we find the files, let's look for any imports or usage patterns
echo "\nChecking service implementations:"
ast-grep --pattern 'class $_ {
  $$$
  constructor($$$) {
    $$$
  }
  $$$
}'

Length of output: 70436


Script:

#!/bin/bash
# Let's check the actual service implementations and their dependencies
echo "Checking service implementations and dependencies:"
rg -A 5 "class (HttpService|GenerateCodeService|GlobalService)" --type ts --type js

# Let's also check for any service initialization or order-related code
echo "\nChecking service initialization and order:"
rg -A 5 "metas.*\[.*Service" --type ts --type js

# Let's look for any imports between these services
echo "\nChecking service imports:"
rg "import.*Service" designer-demo/src/composable/http/

Length of output: 4578

packages/plugins/page/src/http.js (3)

Line range hint 49-60: LGTM! Default export is well-organized

The default export includes all defined functions and is properly structured.


13-47: Verify complete migration from useHttp

Let's ensure all instances of useHttp have been replaced with getMetaApi(META_SERVICE.Http) across the codebase.

#!/bin/bash
# Search for any remaining useHttp instances
echo "Checking for remaining useHttp instances..."
rg "useHttp" --type js --type vue

# Search for consistent usage of the new pattern
echo "Verifying consistent usage of getMetaApi..."
rg "getMetaApi\\(META_SERVICE\\.Http\\)" --type js --type vue

13-13: Verify dependency declaration for @opentiny/tiny-engine-meta-register

Let's ensure this dependency is properly declared in the package.json file.

✅ Verification successful

Dependency is properly declared in package.json

The dependency @opentiny/tiny-engine-meta-register is correctly declared in the package.json file under the dependencies section with a workspace reference ("@opentiny/tiny-engine-meta-register": "workspace:*"). This is a valid declaration in a monorepo setup using pnpm workspaces.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Check if the dependency is declared in package.json
jq -r '.dependencies["@opentiny/tiny-engine-meta-register"] // .devDependencies["@opentiny/tiny-engine-meta-register"] // empty' packages/plugins/page/package.json

Length of output: 344


Script:

#!/bin/bash
# Check package.json content
cat packages/plugins/page/package.json

# Also check for any workspace-level dependencies
cat package.json

# Search for other files importing from this package
rg "@opentiny/tiny-engine-meta-register" --type js

Length of output: 28632

packages/plugins/datasource/src/js/http.js (3)

15-15: LGTM: Clean import addition for the new HTTP service.

The addition of getMetaApi and META_SERVICE imports aligns with the refactoring objectives.


37-42: LGTM: Consistent implementation of template operations.

The template-related operations maintain consistency with the overall refactoring pattern.


18-55: Verify consistency of API endpoint patterns.

Let's ensure that the /app-center/api/ endpoint pattern is used consistently across the codebase.

✅ Verification successful

Based on the results, I can now generate the final response since we have comprehensive information about the API endpoint patterns across the codebase.

API endpoint patterns are consistent across the codebase

All API endpoints consistently follow the /app-center/api/ base path pattern, with well-structured resource hierarchies:

  • Resource-specific paths: sources, pages, apps, i18n
  • Consistent CRUD operations: create, update, delete, list, detail
  • Proper parameter handling: both path params (e.g., /:id) and query params
  • Uniform HTTP methods usage: GET for retrieval/listing, POST for mutations
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for all API endpoint patterns to verify consistency
echo "Checking API endpoint patterns..."
rg -g '*.{js,ts,vue}' '/app-center/api/' --no-filename | sort | uniq

Length of output: 4378

packages/register/src/service.js (2)

2-2: LGTM! Good choice using lodash-es merge.

The import of merge from lodash-es is appropriate for deep merging objects in the new setOptions functionality.


77-79: ⚠️ Potential issue

Several improvements needed for the setOptions implementation.

The current implementation has potential issues:

  1. Direct mutation of service options could lead to side effects
  2. Missing input validation and type checking
  3. Lacks documentation consistent with the rest of the file

Consider applying these improvements:

-  resultService.apis.setOptions = (kv) => {
-    resultService.options = merge({}, options, kv)
-  }
+  /**
+   * Updates service options by merging with provided key-value pairs
+   * @template K
+   * @param {Partial<K>} kv - Partial options to merge
+   * @throws {Error} If kv is null or undefined
+   */
+  resultService.apis.setOptions = (kv) => {
+    if (kv == null) {
+      throw new Error('Options parameter cannot be null or undefined')
+    }
+    // Create new options object instead of mutating existing one
+    const newOptions = merge({}, options, kv)
+    // Optional: Add validation for required fields here
+    resultService.options = newOptions
+  }

Let's verify if there are any existing usages of setOptions to ensure our changes won't break existing code:

✅ Verification successful

Let me check the usage context of setOptions to better understand the impact.


Let me check one more thing to understand if there are any tests or other files that might be affected by the proposed changes.


Based on the gathered information, I can now provide the final response:

Improvements to setOptions can be simplified

The current implementation is used in a straightforward way in designer-demo, and there's no evidence of complex usage patterns in the codebase. While the original review raised valid points, we can propose a more focused improvement:

+  /**
+   * Updates service options by merging with provided key-value pairs
+   * @param {object} kv - Options to merge with existing configuration
+   */
   resultService.apis.setOptions = (kv) => {
-    resultService.options = merge({}, options, kv)
+    resultService.options = merge({}, resultService.options, kv)
   }
  • The main fix is using resultService.options instead of options as the base object to merge with
  • Added JSDoc for documentation consistency
  • Full type checking and null validation seem unnecessary given the simple usage pattern in the codebase
  • The direct mutation is acceptable as it's an expected behavior of a setter method
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for any existing calls to setOptions
rg "setOptions\(" --type js --type ts

Length of output: 198


Script:

#!/bin/bash
# Check the context of setOptions usage in designer-demo
rg -B 5 -A 5 "setOptions\(" designer-demo/src/composable/http/index.js

# Check if HttpService is imported from our package
rg "import.*HttpService" designer-demo/src/composable/http/index.js

# Check the context of marked.setOptions
rg -B 5 -A 5 "marked.setOptions" packages/plugins/tutorial/src/TutorialVideoPanel.vue

Length of output: 704


Script:

#!/bin/bash
# Search for test files related to service.js
fd "service.test" --type f

# Check if there are any other imports of the service
rg "from.*register.*service" --type js --type ts

Length of output: 77

packages/common/js/vscodeGenerateFile.js (3)

13-13: LGTM! Import statement is correctly structured.

The import statement properly brings in the required dependencies for the HTTP service refactoring.


27-27: LGTM! Verify router generation endpoint compatibility.

The refactoring to use getMetaApi is correct. Let's verify the endpoint compatibility across the codebase.

#!/bin/bash
# Description: Verify the router generation endpoint usage
# Test: Search for any other implementations using this endpoint
rg -l '/generate/api/generateRouter'

Line range hint 44-111: LGTM! Consistent implementation across all generator functions.

All generator functions (generateI18n, generateBlock, generatePage, generateDataSource, generateBridge, generateUtil) have been consistently refactored to use getMetaApi(META_SERVICE.Http). The changes maintain:

  • Consistent function signatures
  • Uniform HTTP client usage
  • Preserved documentation and contracts
✅ Verification successful

Consistent HTTP client implementation confirmed across all generator endpoints

The verification shows that all generator functions in vscodeGenerateFile.js and the related endpoint in packages/plugins/block/src/js/http.js consistently use getMetaApi(META_SERVICE.Http).post() for making HTTP requests. This confirms the review comment's observation about the uniform implementation pattern.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify consistent usage of getMetaApi across the codebase
# Test: Check for any inconsistent HTTP client usage in generate endpoints
rg "'/generate/api/generate" -A 1

Length of output: 171


Script:

#!/bin/bash
# Let's try a more precise search for the generate endpoints
rg "'/generate/api/generate.*'" -A 1

# Also search for any other potential HTTP client usage patterns
rg "getMetaApi.*post.*'/generate/api/" -A 1

Length of output: 3015

packages/common/composable/defaultGlobalService.js (4)

1-1: LGTM: Import changes align with refactoring goals.

The addition of getMetaApi and META_SERVICE imports from the meta-register package supports the HTTP service refactoring objective.


45-50: LGTM: Proper error handling in getUserInfo.

The implementation correctly uses the new HTTP service while maintaining error handling with useModal.


Line range hint 63-124: LGTM: Well-structured service implementation.

The service implementation maintains good practices:

  • Proper use of Vue's reactivity system
  • Clear error handling for invalid IDs
  • Clean separation of concerns between state management and API calls

Line range hint 1-124: Verify consistent HTTP service usage across the codebase.

Let's ensure the refactoring from useHttp to getMetaApi is complete across the codebase.

✅ Verification successful

HTTP service refactoring is complete and consistent

The verification shows that:

  • All HTTP requests consistently use getMetaApi(META_SERVICE.Http)
  • The only remaining useHttp references are in:
    • packages/register/src/hooks.js (hook registration)
    • packages/http/src/index.js (implementation)
    • packages/vue-generator/src/templates/* (generated code templates)

These remaining references are expected as they are part of the core implementation and code generation templates.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check for any remaining useHttp references and verify consistent getMetaApi usage

echo "Checking for remaining useHttp references..."
rg "useHttp"

echo "\nVerifying consistent getMetaApi usage pattern..."
rg "getMetaApi\(META_SERVICE\.Http\)"

Length of output: 14242

packages/plugins/block/src/js/http.js (4)

16-35: LGTM! Consistent API pattern implementation.

The functions follow a consistent pattern in using the new HTTP service with appropriate parameter handling.


60-77: LGTM! Well-structured REST API implementation.

The category management functions follow REST conventions with appropriate HTTP methods and clean parameter handling. The destructuring in updateCategory is a nice touch for clarity.


13-77: Verify complete migration from useHttp.

Let's ensure all instances of the old useHttp have been replaced with getMetaApi(META_SERVICE.Http) across the codebase.

#!/bin/bash
# Search for any remaining useHttp imports or usage
rg "useHttp" --type js --type vue

13-13: Verify package dependency.

Please ensure that @opentiny/tiny-engine-meta-register is properly declared in the package.json dependencies.

✅ Verification successful

Package dependency is properly declared

The @opentiny/tiny-engine-meta-register package is correctly declared in the dependencies section of packages/plugins/block/package.json with a workspace reference ("workspace:*"), which is appropriate for a monorepo setup.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Check if the package is declared in package.json
jq -r '.dependencies["@opentiny/tiny-engine-meta-register"] // empty' packages/plugins/block/package.json

Length of output: 155


Script:

#!/bin/bash
# Check package.json content
cat packages/plugins/block/package.json

Length of output: 1316

packages/plugins/materials/src/meta/block/src/http.js (3)

Line range hint 88-109: LGTM! The group management endpoints are well-structured.

The CRUD operations follow RESTful conventions and the data handling is appropriate.


Line range hint 46-85: Consider adding fallback for dslMode configuration.

The code assumes getMergeMeta('engine.config')?.dslMode will always return a valid value. Consider adding a fallback.

Let's verify the dslMode configuration usage:

#!/bin/bash
# Check for dslMode configuration patterns
rg "getMergeMeta\(['\"]engine.config['\"]\).*dslMode"

Consider adding a default value:

- const dslMode = getMergeMeta('engine.config')?.dslMode
+ const dslMode = getMergeMeta('engine.config')?.dslMode || 'default_framework'

32-33: LGTM! Verify API endpoint compatibility.

The refactoring to use getMetaApi looks good. The endpoint structure and parameter handling are correct.

Let's verify the endpoint compatibility:

✅ Verification successful

API endpoint refactoring verified successfully

The endpoint /material-center/api/block-groups?app=${appId} is consistently implemented across the codebase. The evidence shows:

  • Matching endpoint definition in mock server routes
  • Consistent usage in the block-related API operations
  • All block group operations (create, update, delete, get) follow the same base path pattern
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Verify that the endpoint is consistently used across the codebase
rg -g '!*.{json,md,lock}' '/material-center/api/block-groups\?app='

Length of output: 2056


Script:

#!/bin/bash
# Let's try a different approach to search for the endpoint pattern
rg -g '!*.{json,md,lock}' "material-center/api/block-groups"

# Also search for similar patterns to ensure we don't miss any variations
rg -g '!*.{json,md,lock}' "block-groups\?app"

# Let's also check the API service configuration
fd -g "*api*.{js,ts}" --exec grep -l "material-center"

Length of output: 1553

packages/plugins/materials/src/composable/useResource.js (1)

Line range hint 127-134: Verify response structure after service migration.

The code assumes the response structure from the new HTTP service matches the previous implementation. Let's verify this assumption.

✅ Verification successful

Let me analyze the results and generate additional verification scripts to check the response structure consistency.

The first search revealed three files using this endpoint, and we need to verify if they handle the response structure consistently. Additionally, we'll check the default interceptor structure to ensure the fallback values are properly aligned.


Based on the analysis of the results, I can now generate the final response:

Response structure verified after service migration

The response structure is consistent across all implementations:

  • In design-core, the endpoint is used via fetchAppSchema with direct GET request
  • In generate-code, the same endpoint is used with identical response structure expectations
  • The default interceptors in constants/index.js match the fallback values used in the code

The code correctly handles:

  • componentsTree for page structure
  • dataSource.list for data sources
  • dataSource.dataHandler, dataSource.willFetch, and dataSource.errorHandler with proper fallbacks to DEFAULT_INTERCEPTOR
  • bridge property
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check for any other usages of this endpoint to verify response structure consistency

# Test 1: Search for all usages of this endpoint
echo "Searching for all usages of the apps/schema endpoint..."
rg -l "app-center/v1/api/apps/schema"

# Test 2: Search for response handling patterns
echo "Searching for response structure handling patterns..."
rg "componentsTree|dataSource\.list|dataHandler|willFetch|errorHandler"

Length of output: 28865


Script:

#!/bin/bash
# Let's check the actual implementation and response handling in the other files that use this endpoint

# Check implementation in design-core
echo "Checking design-core implementation..."
cat packages/design-core/src/preview/src/preview/http.js

# Check implementation in generate-code
echo "Checking generate-code implementation..."
cat packages/toolbars/generate-code/src/Main.vue

# Check the default interceptor structure
echo "Checking default interceptor structure..."
cat packages/utils/src/constants/index.js

Length of output: 13088

packages/design-core/src/preview/src/previewApp.vue (2)

25-25: LGTM! Import changes align with the refactoring goal.

The new imports correctly support the transition from useHttp to the meta register's HTTP service.


Line range hint 119-129: LGTM! Well-structured error handling.

The implementation correctly uses the new HTTP service and includes proper error handling with appropriate UI feedback.

packages/canvas/DesignCanvas/src/DesignCanvas.vue (2)

31-33: LGTM! Import changes align with the HTTP service refactoring.

The new imports are correctly organized and consistent with the existing import style.


185-185: Verify META_SERVICE.Http registration.

The change aligns with the HTTP service refactoring. However, let's verify that the HTTP service is properly registered.

✅ Verification successful

Based on the search results, I can see that META_SERVICE.Http is extensively used throughout the codebase for making HTTP requests. The service is properly registered and consistently used across multiple packages including canvas, plugins, and core modules. The usage pattern shows it's a central HTTP service that's well integrated into the application's architecture.

HTTP service is properly registered and widely used

The change to use getMetaApi(META_SERVICE.Http).getHttp() aligns with the established pattern across the codebase. No issues found with the HTTP service registration or usage.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for META_SERVICE.Http registration
rg -A 5 "META_SERVICE.Http" 

# Search for getMetaApi usage patterns to ensure consistent usage
ast-grep --pattern 'getMetaApi($service)'

Length of output: 37291

packages/plugins/i18n/src/composable/useTranslate.js (3)

19-19: LGTM: Import changes align with the refactoring goal.

The addition of getMetaApi and META_SERVICE imports is consistent with the PR's objective of refactoring HTTP requests.


230-233: LGTM: Batch creation properly refactored.

The HTTP service refactoring for batch creation is implemented correctly, maintaining the proper structure for bulk operations.


50-53: Verify consistent HTTP service usage for i18n bulk operations.

The refactoring to use getMetaApi(META_SERVICE.Http) looks correct. Let's verify that all bulk operations in the i18n module use the same approach.

✅ Verification successful

Let me check the specific implementations to verify the HTTP service usage.


After analyzing the code, I can now provide the final response:

HTTP service usage is consistent for i18n operations

All HTTP requests in the i18n module correctly use getMetaApi(META_SERVICE.Http), including:

  • Bulk delete operation in removeI18n
  • Single entry create/update in ensureI18n
  • Batch create operation in batchCreateI18n
  • Get i18n data in getI18nData
  • File upload handling in Main.vue
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for any remaining direct HTTP calls in i18n-related files
rg -l "useHttp|\.post\(|\.get\(" "packages/plugins/i18n"

# Search for all bulk operations to ensure consistent usage
rg "bulk/(delete|create)" "packages/plugins/i18n"

Length of output: 312


Script:

#!/bin/bash
# Check the content of both files with HTTP calls
echo "=== Content of useTranslate.js ==="
cat packages/plugins/i18n/src/composable/useTranslate.js

echo -e "\n=== Content of Main.vue ==="
cat packages/plugins/i18n/src/Main.vue

Length of output: 22477

packages/toolbars/generate-code/src/Main.vue (1)

106-106: LGTM! Verify consistency of HTTP service usage.

The change from useHttp().get to getMetaApi(META_SERVICE.Http).get aligns with the PR's refactoring objective.

Let's verify that other HTTP calls in the file are also using the new HTTP service:

✅ Verification successful

HTTP service migration is complete and consistent

The verification confirms that:

  • No remaining useHttp calls exist in Main.vue
  • All imported HTTP functions (fetchMetaData, fetchPageList, fetchBlockSchema) are using the new getMetaApi(META_SERVICE.Http) service consistently
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check if there are any remaining useHttp calls in the file
# and verify that fetchMetaData and fetchPageList (imported from ./http) 
# are also using the new HTTP service

# Check for any remaining useHttp usage
rg "useHttp" "packages/toolbars/generate-code/src/Main.vue"

# Check implementation of imported HTTP functions
rg -A 5 "fetchMetaData|fetchPageList|fetchBlockSchema" "packages/toolbars/generate-code/src/http.js"

Length of output: 699

packages/plugins/materials/src/composable/useMaterial.js (2)

16-24: LGTM! Import changes align with HTTP service refactoring.

The changes correctly import the required utilities from @opentiny/tiny-engine-meta-register to support the HTTP service refactoring.


141-141: Verify error handling in the HTTP response.

While the HTTP request refactoring looks good, ensure that the array destructuring with optional chaining (?.[0]) handles empty responses gracefully.

Let's verify the error handling:

✅ Verification successful

Error handling is properly implemented for empty responses

The code correctly handles empty responses through:

  1. Optional chaining with array access (?.[0]) to safely handle undefined/null responses
  2. Explicit null check with a descriptive error message when the block is not found

This implementation ensures graceful handling of both network errors and missing data scenarios.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for error handling patterns in HTTP responses across the codebase
rg -A 3 "getMetaApi\(META_SERVICE\.Http\)\.get.*\?\.\[" 

Length of output: 456

packages/toolbars/logo/src/Main.vue (1)

Line range hint 226-286: Verify the impact of HTTP service refactoring.

The changes successfully migrate from useHttp to getMetaApi(META_SERVICE.Http), maintaining the existing functionality. However, we should verify that all error scenarios are properly handled across the application.

Let's verify the usage of the new HTTP service across the codebase:

✅ Verification successful

Based on the shell script results, I can now provide a final response:

HTTP service migration is properly implemented across the codebase

The verification shows that:

  1. No remaining instances of useHttp imports were found, indicating complete migration
  2. All HTTP calls using getMetaApi(META_SERVICE.Http) follow consistent error handling patterns:
    • Promise-based error handling with .catch() blocks
    • Loading states management
    • User feedback through modals/messages
    • Proper cleanup of resources (e.g., closing loading indicators)

The changes in the review file align with the established patterns across the codebase, maintaining consistency in error handling and resource cleanup.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check for any remaining useHttp instances and verify consistent error handling patterns

# Test 1: Check for any remaining useHttp imports
echo "Checking for remaining useHttp imports..."
rg "import.*useHttp.*from.*@opentiny/tiny-engine"

# Test 2: Verify consistent error handling patterns in HTTP calls
echo "Checking error handling patterns in HTTP calls..."
rg "getMetaApi\(META_SERVICE\.Http\).*\.(get|post|put|delete)" -A 10

Length of output: 41730

packages/plugins/i18n/src/Main.vue (1)

Line range hint 365-375: LGTM: Loading state management is well implemented.

The loading state management is properly implemented with:

  • Correct target element selection based on list state
  • Proper cleanup in the finally block
  • Theme-aware loading spinner
packages/configurator/src/variable-configurator/VariableConfigurator.vue (1)

493-500: ⚠️ Potential issue

Add error handling for the HTTP request.

The HTTP request lacks error handling, which could lead to unhandled promise rejections if the request fails. Additionally, the URL construction and response data handling could be more robust.

Consider applying these improvements:

-        getMetaApi(META_SERVICE.Http)
-          .get(`/app-center/api/sources/list/${selectedId}`)
-          .then((data) => {
-            const sourceData = {}
-            data.forEach((res) => {
-              sourceData[res.name] = res
-            })
-            state.variables = sourceData
-          })
+        getMetaApi(META_SERVICE.Http)
+          .get(`/app-center/api/sources/list/${encodeURIComponent(selectedId)}`)
+          .then((response) => {
+            if (!Array.isArray(response)) {
+              console.warn('Unexpected response format from sources API')
+              state.variables = {}
+              return
+            }
+            const sourceData = {}
+            response.forEach((res) => {
+              if (res && typeof res.name === 'string') {
+                sourceData[res.name] = res
+              }
+            })
+            state.variables = sourceData
+          })
+          .catch((error) => {
+            console.error('Failed to fetch data sources:', error)
+            state.variables = {}
+          })

The improvements include:

  1. Error handling with .catch()
  2. URL parameter encoding for safety
  3. Type checking for the response data
  4. Graceful fallback to empty state on errors

Let's verify the API endpoint format and usage across the codebase:

✅ Verification successful

Let me gather more information about the error handling patterns in similar API calls to ensure our suggestion aligns with the codebase conventions.


Let me check one more pattern to see how errors are typically handled in the codebase, specifically looking for console error logging patterns.


Based on the gathered information, I can now provide the final response:

Consider a simpler error handling approach for the HTTP request

Looking at the codebase patterns, particularly in CollectionConfigurator.vue, the API calls are handled with a simpler approach without extensive error handling. The suggested changes should align with these patterns:

         getMetaApi(META_SERVICE.Http)
-          .get(`/app-center/api/sources/list/${selectedId}`)
+          .get(`/app-center/api/sources/list/${encodeURIComponent(selectedId)}`)
           .then((data) => {
             const sourceData = {}
-            data.forEach((res) => {
+            (data || []).forEach((res) => {
               sourceData[res.name] = res
             })
             state.variables = sourceData
+          })
+          .catch(() => {
+            state.variables = {}
           })

The improvements include:

  1. URL parameter encoding for safety
  2. Fallback to empty array if data is null/undefined
  3. Simple error recovery by setting empty state
  4. Consistent with the existing codebase patterns
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for similar API endpoint usage patterns
rg -A 2 "sources/list" 

Length of output: 1338


Script:

#!/bin/bash
# Search for error handling patterns in API calls
ast-grep --pattern 'getMetaApi($_).get($path).then($_).catch($_)'

# Also check for any existing error handling in the CollectionConfigurator
cat packages/configurator/src/collection-configurator/CollectionConfigurator.vue

Length of output: 2657


Script:

#!/bin/bash
# Search for error handling and console.error patterns
rg "console\.(error|warn)" -A 2 packages/configurator/
rg "\.catch\(" -A 2 packages/configurator/

Length of output: 101

packages/plugins/robot/src/Main.vue (2)

116-116: Import statement updated successfully

The import now includes getMetaApi and META_SERVICE, aligning with the refactoring to httpService.


223-223: ⚠️ Potential issue

Typo in function name getSendSeesionProcess

The function getSendSeesionProcess() seems to have a typo; 'Session' is misspelled as 'Seesion'. This may lead to runtime errors.

Apply this diff to correct the typo:

- getSendSeesionProcess()
+ getSendSessionProcess()

Ensure the function definition and all references are updated accordingly.

Likely invalid or redundant comment.

designer-demo/src/composable/http/mock.js (1)

754-756: 🛠️ Refactor suggestion

Apply Optional Chaining for Property Access

To avoid errors when block.tenant is undefined, consider using optional chaining, which simplifies the code and improves safety.

Apply this diff:

-      block.tenant && tenants.push(block.tenant)
+      if (block.tenant) tenants.push(block.tenant)

Likely invalid or redundant comment.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

📥 Commits

Files that changed from the base of the PR and between 03364a2 and 32eebea.

📒 Files selected for processing (1)
  • packages/common/package.json (1 hunks)
🔇 Additional comments (1)
packages/common/package.json (1)

46-46: LGTM on axios dependency.

The addition of axios ~0.28.0 is appropriate as it includes important security fixes (CVE-2023-45857).

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 3

🧹 Outside diff range and nitpick comments (1)
designer-demo/src/composable/http/mock.js (1)

13-17: Consider using a more robust state management approach.

The current implementation uses global variables for state management, which could lead to:

  • Unexpected state persistence between requests
  • Race conditions in concurrent requests
  • Difficulty in testing and maintaining the code

Consider implementing a proper state management solution:

  1. Create a class to encapsulate the state
  2. Use instance variables instead of global variables
  3. Implement methods for state manipulation
  4. Consider using a singleton pattern if shared state is required
📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

📥 Commits

Files that changed from the base of the PR and between 32eebea and 5e4086e.

📒 Files selected for processing (2)
  • designer-demo/src/composable/http/mock.js (1 hunks)
  • packages/common/package.json (1 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
  • packages/common/package.json
🧰 Additional context used
🪛 Biome
designer-demo/src/composable/http/mock.js

[error] 698-700: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


[error] 707-709: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


[error] 712-712: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)


[error] 762-763: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 3

🧹 Outside diff range and nitpick comments (3)
packages/engine-cli/template/designer/src/composable/http/index.js (2)

3-5: Add JSDoc documentation for the preRequest interceptor.

The purpose of this pass-through interceptor should be documented to clarify its role in the request pipeline.

+/**
+ * Request interceptor that passes through the config unchanged.
+ * @param {import('axios').AxiosRequestConfig} config - The axios request configuration
+ * @returns {import('axios').AxiosRequestConfig} The unmodified config
+ */
 const preRequest = (config) => {
   return config
 }

34-36: Consider making HttpService configuration immutable.

After setting the options, there's no protection against further modifications to the HttpService configuration.

 HttpService.apis.setOptions(options)
 
-export default HttpService
+// Prevent modifications to the configured service
+export default Object.freeze(HttpService)
packages/engine-cli/template/designer/registry.js (1)

48-48: Consider moving HttpService to @opentiny/tiny-engine package.

Since HttpService appears to be a core service replacing useHttp functionality, consider moving it to the main @opentiny/tiny-engine package alongside other core services like GenerateCodeService and GlobalService. This would improve maintainability and make the service more accessible to other parts of the system.

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

📥 Commits

Files that changed from the base of the PR and between 5e4086e and c193866.

📒 Files selected for processing (3)
  • packages/engine-cli/template/designer/registry.js (1 hunks)
  • packages/engine-cli/template/designer/src/composable/http/index.js (1 hunks)
  • packages/engine-cli/template/designer/src/composable/index.js (1 hunks)
✅ Files skipped from review due to trivial changes (1)
  • packages/engine-cli/template/designer/src/composable/index.js
🔇 Additional comments (3)
packages/engine-cli/template/designer/src/composable/http/index.js (1)

7-9: Verify the response data structure assumption.

The interceptor assumes responses follow a { data: { data: ... } } structure. This might be too specific and could fail for responses with different structures.

✅ Verification successful

Response structure assumption is consistent with the framework

Looking at the codebase, particularly in packages/http/src/index.js, the response interceptor pattern is consistent across the framework. The preResponse implementation in the template follows the established pattern where error responses include an error field and successful responses nest data under data.data. This structure is part of the framework's design.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for API response handling patterns to verify consistency
rg -g '!*.{json,md,lock}' -A 3 'data\s*:\s*{\s*data\s*:'

Length of output: 176


Script:

#!/bin/bash
# Search for API response handling patterns with fixed regex
rg -g '!*.{json,md,lock}' -A 3 'data: \{.*data:'

# Search for response interceptor patterns
rg -g '!*.{json,md,lock}' -A 3 'response\.(data|body)'

# Search for axios response handling
rg -g '!*.{json,md,lock}' -A 3 'axios.*then.*data'

# Look for API response type definitions
fd -e ts -e js -x grep -l 'interface.*Response\|type.*Response' {} \; -exec cat {} \;

Length of output: 2335


Script:

#!/bin/bash
# Look at the implementation of the http module in the current package
cat packages/engine-cli/template/designer/src/composable/http/index.js

# Look for API response handling in the same directory
rg -g '!*.{json,md,lock}' -A 5 'response' packages/engine-cli/template/designer/src/composable/http/

# Check for similar interceptor patterns in related packages
rg -g '!*.{json,md,lock}' -A 5 'preResponse|interceptor' packages/http/src/

Length of output: 3121

packages/engine-cli/template/designer/registry.js (2)

48-53: Verify completeness of registry changes.

The changes align with the PR objectives of refactoring useHttp to httpService. However, let's ensure all necessary registry changes are complete.

#!/bin/bash
# Check for any remaining useHttp references that might need updating
echo "Checking for remaining useHttp references..."
rg "useHttp"

# Check for other registry.js files that might need similar updates
echo "Checking for other registry files..."
fd "registry.js"

53-53: Verify service initialization dependencies.

The HttpService has been added as the first service in the metas array. Please verify that HttpService doesn't have any dependencies on GenerateCodeService or GlobalService, as the initialization order might matter.

✅ Verification successful

The previous search didn't yield results, likely due to incorrect paths. Let's try a broader search to locate and analyze the service implementations and their dependencies.


Let's examine the actual service implementations to understand their dependencies and initialization requirements.


Based on the examination of the HttpService implementation and the registry context, I can now generate the final response:

The service initialization order is correct as implemented.

The HttpService implementation shows it's a standalone service that initializes axios and its interceptors without any dependencies on GenerateCodeService or GlobalService. It's defined using defineService with its own state management and doesn't require other services during initialization. Being first in the metas array is safe and won't cause any initialization issues.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for any dependencies between services
echo "Checking for service dependencies..."
rg -l "GenerateCodeService|GlobalService" "./src/composable/HttpService"

# Check if HttpService is used by other services during initialization
echo "Checking for HttpService usage in other services..."
ast-grep --pattern 'class $_ {
  $$$
  constructor($$$) {
    $$$
    HttpService
    $$$
  }
  $$$
}'

Length of output: 1339


Script:

#!/bin/bash
# Let's search for HttpService implementation and its dependencies
echo "Searching for HttpService implementation..."
rg -A 10 "class HttpService" 

# Search for any imports in files containing HttpService
echo "Checking imports in HttpService files..."
rg "^import.*Service" -A 1 $(rg -l "class HttpService")

# Check registry files to understand service initialization patterns
echo "Checking service initialization in registry files..."
cat packages/engine-cli/template/designer/registry.js

Length of output: 7324


Script:

#!/bin/bash
# Let's check the HttpService implementation in the common package
echo "Checking HttpService implementation in common package..."
cat packages/common/composable/http/index.js

# Let's also check if GenerateCodeService or GlobalService have any dependencies on HttpService
echo "Checking service dependencies..."
rg -A 5 "class (GenerateCodeService|GlobalService)" 

# Check for any constructor dependencies
echo "Checking constructor dependencies..."
ast-grep --pattern 'constructor($$$) {
  $$$
  this.$_ = $_
  $$$
}'

Length of output: 2156

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 10

🧹 Outside diff range and nitpick comments (4)
packages/common/composable/http/index.js (1)

28-48: Translate comments to English for consistency

The configuration comments are in Chinese. For better maintainability and collaboration, consider translating them to English.

-      // axios 配置
+      // axios configuration
       baseURL: '',
-      withCredentials: false, // 跨域请求时是否需要使用凭证
+      withCredentials: false, // whether credentials are needed for cross-origin requests
-      headers: {} // 请求头
+      headers: {} // request headers
     },
-    enableMock: false, // 是否启用 mock
+    enableMock: false, // enable mock functionality
-    mockData: {}, // mock 数据
+    mockData: {}, // mock data
     interceptors: {
-      // 拦截器
+      // interceptors
-      request: [], // 支持配置多个请求拦截器,先注册后执行
+      request: [], // supports multiple request interceptors, executed in reverse registration order
-      response: [] // 支持配置多个响应拦截器,先注册先执行
+      response: [] // supports multiple response interceptors, executed in registration order
designer-demo/src/composable/http/index.js (1)

22-34: Avoid modifying the global window object.

Modifying the global window object can lead to naming conflicts and make the code harder to test. Consider using a dedicated service or event bus.

Consider implementing a SessionService:

export class SessionService {
  static rebuiltCallback() {
    // Current implementation
  }
}
packages/common/composable/http/axios.js (2)

16-26: Consider documenting potential side effects of modifying global defaults

The globalDefaults function modifies the global Axios configuration, which could affect other parts of the application that use Axios directly. Consider:

  1. Adding JSDoc documentation to clearly indicate this behavior
  2. Adding type checking for the value parameter
+/**
+ * Get or set global Axios defaults. Modifying defaults affects all Axios instances.
+ * @param {string} [key] - Configuration key to get/set
+ * @param {*} [value] - Value to set for the given key
+ * @returns {*} Current value for key if getting, undefined if setting, or entire defaults object
+ */
 export function globalDefaults(key, value) {

28-32: Add security enhancements to HTTP service

Consider implementing these security measures:

  1. XSRF protection
  2. Request/response data sanitization
  3. Response type validation

Example implementation:

 export default (config) => {
+  // Enable XSRF protection
+  const securityConfig = {
+    xsrfCookieName: 'XSRF-TOKEN',
+    xsrfHeaderName: 'X-XSRF-TOKEN',
+    validateStatus: (status) => status >= 200 && status < 300,
+    ...config
+  }
-  const instance = axios.create(config)
+  const instance = axios.create(securityConfig)
+
+  // Add response sanitization interceptor
+  instance.interceptors.response.use(
+    (response) => {
+      // Implement response data sanitization
+      return response
+    },
+    (error) => Promise.reject(error)
+  )
📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

📥 Commits

Files that changed from the base of the PR and between c193866 and 4ed0017.

📒 Files selected for processing (4)
  • designer-demo/src/composable/http/index.js (1 hunks)
  • packages/common/composable/http/axios.js (1 hunks)
  • packages/common/composable/http/index.js (1 hunks)
  • packages/http/src/axios.js (1 hunks)
🧰 Additional context used
🪛 Biome
packages/common/composable/http/axios.js

[error] 144-144: Change to an optional chain.

Unsafe fix: Change to an optional chain.

(lint/complexity/useOptionalChain)

🔇 Additional comments (4)
packages/common/composable/http/index.js (1)

1-2: Verify the local axios implementation

The code imports axios from a local module (./axios). Let's verify this implementation exists and contains the required mock functionality referenced in the initialization.

✅ Verification successful

Local axios implementation verified successfully

The local axios module (./axios.js) exists and contains a proper implementation with:

  • Custom axios instance creation with configuration
  • Complete HTTP method wrappers (get, post, put, etc.)
  • Mock functionality using axios-mock-adapter
  • Interceptor support
  • Global defaults handling
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify the local axios implementation
# Check if the local axios file exists and contains mock functionality
rg -l "mock" "packages/common/composable/http/axios"

Length of output: 128


Script:

#!/bin/bash
# Let's check if the axios file exists with different extensions
fd "axios\.(js|ts|vue)$" "packages/common/composable/http/"

# Also search for any axios-related files in the directory
fd "axios" "packages/common/composable/http/"

Length of output: 185


Script:

#!/bin/bash
# Let's examine the content of axios.js to verify the implementation
cat packages/common/composable/http/axios.js

# Also search for mock-related functionality
rg -A 5 "mock" packages/common/composable/http/axios.js

Length of output: 5078

designer-demo/src/composable/http/index.js (3)

1-10: LGTM! Well-structured imports and constants.

The imports are organized logically, and constants are properly defined.


119-131: LGTM! Clean service configuration.

The HTTP service setup is well-structured with appropriate interceptors and mock data handling.


13-16: ⚠️ Potential issue

Initialize mePromise with proper structure.

The mePromise is initialized as an empty object but used later with a resolve method. This could lead to runtime errors.

 const procession = {
   promiseLogin: null,
-  mePromise: {}
+  mePromise: {
+    resolve: () => {},
+    reject: () => {}
+  }
 }

Likely invalid or redundant comment.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 7

🧹 Outside diff range and nitpick comments (5)
packages/common/composable/http/index.js (1)

35-44: Translate comments to English and add configuration validation

The comments should be in English for better international collaboration. Additionally, the configuration options should be validated.

Apply this diff:

 options: {
   axiosConfig: {
-    // axios 配置
+    // Axios configuration
     baseURL: '',
-    withCredentials: false, // 跨域请求时是否需要使用凭证
+    withCredentials: false, // Whether to use credentials for cross-origin requests
-    headers: {} // 请求头
+    headers: {} // Request headers
   },
   interceptors: {
-    // 拦截器
+    // Interceptors configuration
-    request: [], // 支持配置多个请求拦截器,先注册后执行
+    request: [], // Multiple request interceptors (executed in reverse order)
-    response: [] // 支持配置多个响应拦截器,先注册先执行
+    response: [] // Multiple response interceptors (executed in order)
   }
 }

Also add configuration validation:

 init: ({ options = {} }) => {
+  const validateConfig = (config) => {
+    if (config.baseURL && typeof config.baseURL !== 'string') {
+      throw new Error('baseURL must be a string')
+    }
+    if (config.headers && typeof config.headers !== 'object') {
+      throw new Error('headers must be an object')
+    }
+  }
+
   const { axiosConfig = {}, interceptors = {} } = options
+  validateConfig(axiosConfig)
   // ... rest of init
 }
designer-demo/src/composable/http/index.js (4)

6-6: Remove unused import 'mockData'

The mockData import is not used in this file. If mock data is needed, ensure it's properly integrated with the HTTP service configuration.

-import mockData from './mock'
🧰 Tools
🪛 eslint

[error] 6-6: 'mockData' is defined but never used. Allowed unused vars must match /^_/u.

(no-unused-vars)


36-42: Enhance error handling with structured error objects

Consider creating a structured error object to standardize error handling and make it easier to process errors programmatically.

+const createErrorObject = (url, message, type = 'error') => ({
+  code: type === 'error' ? 'API_ERROR' : 'API_WARNING',
+  timestamp: new Date().toISOString(),
+  details: { url, message }
+})

 const showError = (url, message) => {
+  const error = createErrorObject(url, message)
   globalNotify({
     type: 'error',
     title: '接口报错',
-    message: `报错接口: ${url} \n报错信息: ${message ?? ''}`
+    message: `报错接口: ${error.details.url} \n报错信息: ${error.details.message ?? ''}`
   })
+  return error
 }

60-68: Add support for different error types in preResponse

The current implementation only handles generic errors. Consider adding support for different error types (warning, info) and their respective handling.

 const preResponse = (res) => {
-  if (res.data?.error) {
+  const { error, warning } = res.data || {}
+  if (warning) {
+    showError(res.config?.url, warning.message, 'warning')
+  }
+  if (error) {
     showError(res.config?.url, res?.data?.error?.message)
-    return Promise.reject(res.data.error)
+    return Promise.reject(error)
   }
   return res.data?.data
 }

102-117: Add environment-specific configuration settings

Consider extracting environment-specific settings into a separate configuration object for better maintainability.

+const ENV_CONFIG = {
+  development: {
+    withCredentials: true,
+    headers: {
+      'x-lowcode-mode': 'develop'
+    }
+  },
+  production: {
+    withCredentials: false,
+    headers: {}
+  }
+}

 const getConfig = (env = import.meta.env) => {
   const baseURL = env.VITE_ORIGIN
-  const dev = env.MODE?.includes('dev')
+  const mode = env.MODE?.includes('dev') ? 'development' : 'production'
   const getTenant = () => new URLSearchParams(location.search).get('tenant')
+  const envConfig = ENV_CONFIG[mode]
 
   return {
     baseURL,
-    withCredentials: dev,
+    ...envConfig,
     headers: {
-      ...(dev && { 'x-lowcode-mode': 'develop' }),
+      ...envConfig.headers,
       'x-lowcode-org': getTenant()
     }
   }
 }
📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

📥 Commits

Reviewing files that changed from the base of the PR and between 4ed0017 and c068e61.

📒 Files selected for processing (32)
  • designer-demo/registry.js (1 hunks)
  • designer-demo/src/composable/http/index.js (1 hunks)
  • jsconfig.json (0 hunks)
  • packages/build/vite-config/src/vite-plugins/devAliasPlugin.js (0 hunks)
  • packages/canvas/package.json (0 hunks)
  • packages/common/composable/http/index.js (1 hunks)
  • packages/common/package.json (1 hunks)
  • packages/configurator/package.json (0 hunks)
  • packages/design-core/package.json (0 hunks)
  • packages/design-core/src/init.js (0 hunks)
  • packages/http/index.js (0 hunks)
  • packages/http/package.json (0 hunks)
  • packages/http/src/axios.js (0 hunks)
  • packages/http/src/config.js (0 hunks)
  • packages/http/src/index.js (0 hunks)
  • packages/http/vite.config.js (0 hunks)
  • packages/plugins/block/package.json (0 hunks)
  • packages/plugins/bridge/package.json (0 hunks)
  • packages/plugins/datasource/package.json (0 hunks)
  • packages/plugins/help/package.json (0 hunks)
  • packages/plugins/i18n/package.json (0 hunks)
  • packages/plugins/materials/package.json (0 hunks)
  • packages/plugins/page/package.json (0 hunks)
  • packages/plugins/robot/package.json (0 hunks)
  • packages/plugins/schema/package.json (0 hunks)
  • packages/plugins/state/package.json (0 hunks)
  • packages/plugins/tutorial/package.json (0 hunks)
  • packages/settings/styles/package.json (0 hunks)
  • packages/toolbars/breadcrumb/package.json (0 hunks)
  • packages/toolbars/generate-code/package.json (0 hunks)
  • packages/toolbars/lock/package.json (0 hunks)
  • packages/toolbars/logo/package.json (0 hunks)
💤 Files with no reviewable changes (28)
  • jsconfig.json
  • packages/build/vite-config/src/vite-plugins/devAliasPlugin.js
  • packages/canvas/package.json
  • packages/configurator/package.json
  • packages/design-core/package.json
  • packages/design-core/src/init.js
  • packages/http/index.js
  • packages/http/package.json
  • packages/http/src/axios.js
  • packages/http/src/config.js
  • packages/http/src/index.js
  • packages/http/vite.config.js
  • packages/plugins/block/package.json
  • packages/plugins/bridge/package.json
  • packages/plugins/datasource/package.json
  • packages/plugins/help/package.json
  • packages/plugins/i18n/package.json
  • packages/plugins/materials/package.json
  • packages/plugins/page/package.json
  • packages/plugins/robot/package.json
  • packages/plugins/schema/package.json
  • packages/plugins/state/package.json
  • packages/plugins/tutorial/package.json
  • packages/settings/styles/package.json
  • packages/toolbars/breadcrumb/package.json
  • packages/toolbars/generate-code/package.json
  • packages/toolbars/lock/package.json
  • packages/toolbars/logo/package.json
🚧 Files skipped from review as they are similar to previous changes (2)
  • designer-demo/registry.js
  • packages/common/package.json
🧰 Additional context used
🪛 eslint
designer-demo/src/composable/http/index.js

[error] 6-6: 'mockData' is defined but never used. Allowed unused vars must match /^_/u.

(no-unused-vars)

chilingling
chilingling previously approved these changes Nov 5, 2024
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 5

🧹 Outside diff range and nitpick comments (5)
packages/common/composable/http/index.js (3)

1-4: Consider organizing imports by type

Group imports by external dependencies and internal modules for better organization.

+// External dependencies
 import axios from 'axios'
+
+// Internal dependencies
 import { defineService, META_SERVICE } from '@opentiny/tiny-engine-meta-register'

32-47: Enhance configuration documentation and validation

  1. Replace Chinese comments with English documentation
  2. Add JSDoc for configuration options
  3. Consider validating required options
 export default defineService({
   id: META_SERVICE.Http,
   type: 'MetaService',
+  /**
+   * @typedef {Object} HttpServiceOptions
+   * @property {Object} axiosConfig - Axios instance configuration
+   * @property {string} [axiosConfig.baseURL] - Base URL for requests
+   * @property {boolean} [axiosConfig.withCredentials] - Enable/disable credentials for CORS
+   * @property {Object} [axiosConfig.headers] - Default headers
+   * @property {Object} [interceptors] - Request/response interceptors
+   */
   options: {
     axiosConfig: {
-      // axios 配置
       baseURL: '',
-      withCredentials: false, // 跨域请求时是否需要使用凭证
-      headers: {} // 请求头
+      withCredentials: false, // Enable/disable credentials for CORS
+      headers: {} // Default headers
     },
     interceptors: {
-      // 拦截器
-      request: [], // 支持配置多个请求拦截器,先注册后执行
-      response: [] // 支持配置多个响应拦截器,先注册先执行
+      request: [], // Request interceptors (executed in registration order)
+      response: [] // Response interceptors (executed in reverse order)
     }
   },

57-64: Add TypeScript types for better type safety

Consider adding TypeScript types to improve type safety and developer experience.

+  /**
+   * @template T
+   * @typedef {Promise<import('axios').AxiosResponse<T>>} HttpResponse
+   */
   apis: () => ({
     getHttp: () => http,
+    /**
+     * @template T
+     * @param {string} url
+     * @param {import('axios').AxiosRequestConfig} [config]
+     * @returns {HttpResponse<T>}
+     */
     get: (...args) => http?.get(...args),
     // Add similar JSDoc for other methods
   })
designer-demo/src/composable/http/index.js (2)

12-18: Consider internationalizing error messages

The error messages are currently hardcoded in Chinese. Consider using a translation system for better internationalization support.

 const showError = (url, message) => {
   globalNotify({
     type: 'error',
-    title: '接口报错',
-    message: `报错接口: ${url} \n报错信息: ${message ?? ''}`
+    title: t('api.error'),
+    message: t('api.errorDetails', { url, message: message ?? '' })
   })
 }

101-116: Cache tenant value for better performance

The getTenant function is called for every request. Consider caching the value.

 const getConfig = (env = import.meta.env) => {
   const baseURL = env.VITE_ORIGIN
   const dev = env.MODE?.includes('dev')
-  const getTenant = () => new URLSearchParams(location.search).get('tenant')
+  const getTenant = (() => {
+    let cachedTenant
+    return () => {
+      if (!cachedTenant) {
+        cachedTenant = new URLSearchParams(location.search).get('tenant')
+      }
+      return cachedTenant
+    }
+  })()
📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

📥 Commits

Reviewing files that changed from the base of the PR and between c068e61 and b57f843.

📒 Files selected for processing (23)
  • designer-demo/package.json (1 hunks)
  • designer-demo/src/composable/http/index.js (1 hunks)
  • packages/canvas/package.json (0 hunks)
  • packages/common/composable/http/index.js (1 hunks)
  • packages/common/package.json (1 hunks)
  • packages/configurator/package.json (0 hunks)
  • packages/design-core/package.json (0 hunks)
  • packages/plugins/block/package.json (0 hunks)
  • packages/plugins/bridge/package.json (0 hunks)
  • packages/plugins/datasource/package.json (0 hunks)
  • packages/plugins/help/package.json (0 hunks)
  • packages/plugins/i18n/package.json (0 hunks)
  • packages/plugins/materials/package.json (0 hunks)
  • packages/plugins/page/package.json (0 hunks)
  • packages/plugins/robot/package.json (0 hunks)
  • packages/plugins/schema/package.json (0 hunks)
  • packages/plugins/state/package.json (0 hunks)
  • packages/plugins/tutorial/package.json (0 hunks)
  • packages/settings/styles/package.json (0 hunks)
  • packages/toolbars/breadcrumb/package.json (0 hunks)
  • packages/toolbars/generate-code/package.json (0 hunks)
  • packages/toolbars/lock/package.json (0 hunks)
  • packages/toolbars/logo/package.json (0 hunks)
💤 Files with no reviewable changes (19)
  • packages/canvas/package.json
  • packages/configurator/package.json
  • packages/design-core/package.json
  • packages/plugins/block/package.json
  • packages/plugins/bridge/package.json
  • packages/plugins/datasource/package.json
  • packages/plugins/help/package.json
  • packages/plugins/i18n/package.json
  • packages/plugins/materials/package.json
  • packages/plugins/page/package.json
  • packages/plugins/robot/package.json
  • packages/plugins/schema/package.json
  • packages/plugins/state/package.json
  • packages/plugins/tutorial/package.json
  • packages/settings/styles/package.json
  • packages/toolbars/breadcrumb/package.json
  • packages/toolbars/generate-code/package.json
  • packages/toolbars/lock/package.json
  • packages/toolbars/logo/package.json
🚧 Files skipped from review as they are similar to previous changes (2)
  • designer-demo/package.json
  • packages/common/package.json

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 4

🧹 Outside diff range and nitpick comments (1)
designer-demo/src/composable/http/index.js (1)

18-24: Add i18n support for error messages.

Error messages are hardcoded in Chinese. Consider using a translation system for better internationalization:

+import { useI18n } from 'vue-i18n'
+
 const showError = (url, message) => {
+  const { t } = useI18n()
   globalNotify({
     type: 'error',
-    title: '接口报错',
-    message: `报错接口: ${url} \n报错信息: ${message ?? ''}`
+    title: t('errors.api_error'),
+    message: t('errors.api_error_details', { url, message: message ?? '' })
   })
 }
📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

📥 Commits

Reviewing files that changed from the base of the PR and between b57f843 and 4bebcb3.

📒 Files selected for processing (1)
  • designer-demo/src/composable/http/index.js (1 hunks)
🔇 Additional comments (1)
designer-demo/src/composable/http/index.js (1)

26-40: ⚠️ Potential issue

Improve baseURL handling in preRequest.

Setting baseURL to an empty string could cause issues with relative URLs. Consider using window.location.origin or maintaining the original baseURL:

 const preRequest = (config) => {
   const isDevelopEnv = import.meta.env.MODE?.includes('dev')
+  const originalBaseURL = config.baseURL
 
   if (isDevelopEnv && config.url.match(/\/generate\//)) {
-    config.baseURL = ''
+    config.baseURL = window.location.origin
   }
 
   const isVsCodeEnv = window.vscodeBridge
 
   if (isVsCodeEnv) {
-    config.baseURL = ''
+    config.baseURL = window.location.origin
   }
 
   return config
 }

Likely invalid or redundant comment.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 4

🧹 Outside diff range and nitpick comments (11)
packages/plugins/materials/src/meta/block/src/BlockList.vue (1)

84-84: Consider adding error handling and memoization.

The getAppId function could be enhanced in two ways:

  1. Add error handling for cases where getBaseInfo() might return undefined
  2. Memoize the result since the app ID rarely changes during a session

Consider this implementation:

-    const getAppId = () => getMetaApi(META_SERVICE.GlobalService).getBaseInfo().id
+    const getAppId = computed(() => {
+      const baseInfo = getMetaApi(META_SERVICE.GlobalService).getBaseInfo()
+      if (!baseInfo?.id) {
+        throw new Error('Failed to retrieve application ID')
+      }
+      return baseInfo.id
+    })

Then update the usage in deleteBlock:

-            requestUpdateGroup({ id: groupId, blocks, app: getAppId() })
+            requestUpdateGroup({ id: groupId, blocks, app: getAppId.value })
packages/plugins/datasource/src/DataSourceForm.vue (1)

144-144: Consider enhancing error handling and performance.

While the implementation aligns with the PR's objective of transitioning to httpService, consider these improvements:

  1. Add error handling for cases where getBaseInfo() fails
  2. Cache the service instance to avoid creating it on every call
  3. Add type checking for the returned ID

Consider refactoring to:

-const getAppId = () => getMetaApi(META_SERVICE.GlobalService).getBaseInfo().id
+const httpService = getMetaApi(META_SERVICE.GlobalService)
+const getAppId = async () => {
+  try {
+    const { id } = await httpService.getBaseInfo()
+    if (!id) throw new Error('Invalid app ID')
+    return id
+  } catch (error) {
+    console.error('Failed to get app ID:', error)
+    throw error
+  }
+}
packages/plugins/materials/src/meta/block/src/BlockGroupPanel.vue (2)

Line range hint 147-186: Consider refactoring the addBlocks function for better maintainability.

The function is handling multiple responsibilities: fetching existing blocks, mapping data, making update requests, and managing UI state. Consider breaking it down into smaller, more focused functions.

Here's a suggested refactor:

- const addBlocks = () => {
+ const mapBlocksData = (existingBlocks, selectedBlocks) => {
+   const existingMapped = existingBlocks?.map((item) => ({
+     id: item.id,
+     version: item.current_version
+   })) || []
+   
+   const selectedMapped = selectedBlocks?.map((item) => ({
+     id: item.id,
+     version: item.latestVersion
+   })) || []
+   
+   return [...existingMapped, ...selectedMapped]
+ }
+
+ const handleSuccess = (res, selectedBlocks) => {
+   const selectedId = selectedBlocks.map((b) => b.id)
+   const addedBlocks = res.blocks.filter((item) => selectedId.includes(item.id))
+   
+   useMaterial().updateCanvasDependencies(addedBlocks)
+   isRefresh.value = true
+   state.searchValue = ''
+   selectedBlockArray.value.length = 0
+   useResource().fetchResource({ isInit: false })
+   useNotify({
+     message: '添加区块成功',
+     type: 'success'
+   })
+ }
+
+ const addBlocks = async () => {
    const groupId = selectedGroup.value.groupId
-   fetchGroupBlocksById({ groupId })
-     .then((data) => {
-       const resData =
-         data?.map((item) => ({
-           id: item.id,
-           version: item.current_version
-         })) || []
-       const selectedBlocks =
-         selectedBlockArray?.value?.map((item) => ({
-           id: item.id,
-           version: item.latestVersion
-         })) || []
+   try {
+     const existingBlocks = await fetchGroupBlocksById({ groupId })
+     if (!selectedBlockArray?.value?.length) return
 
-       if (selectedBlocks.length === 0) {
-         return
-       }
+     const blocks = mapBlocksData(existingBlocks, selectedBlockArray.value)
+     const res = await requestUpdateGroup({
+       id: groupId,
+       blocks,
+       app: getAppId()
+     })
 
-       const blocks = [...resData, ...selectedBlocks]
+     handleSuccess(res, selectedBlockArray.value)
+   } catch (error) {
+     message({
+       message: `添加区块失败: ${error.message || error}`,
+       status: 'error'
+     })
+   } finally {
+     panelState.isBlockGroupPanel = false
+     closePanel()
+   }
+ }

Line range hint 209-227: Add error notification for invalid groupId in fetchBlocks.

The function silently returns when groupId is invalid or default. Consider notifying the user about the invalid state.

 const fetchBlocks = () => {
   const groupId = selectedGroup.value.groupId
-  if (!groupId || isDefaultGroupId(groupId)) return
+  if (!groupId || isDefaultGroupId(groupId)) {
+    useNotify({
+      message: '无效的区块组ID',
+      type: 'warning'
+    })
+    return
+  }
packages/plugins/page/src/PageTree.vue (1)

83-83: Add error handling for getBaseInfo()

Consider adding error handling to gracefully handle cases where getBaseInfo() might fail or return unexpected data.

-    const getAppId = () => getMetaApi(META_SERVICE.GlobalService).getBaseInfo().id
+    const getAppId = () => {
+      try {
+        const baseInfo = getMetaApi(META_SERVICE.GlobalService).getBaseInfo()
+        if (!baseInfo?.id) {
+          throw new Error('Invalid base info: missing id')
+        }
+        return baseInfo.id
+      } catch (error) {
+        console.error('Failed to get application ID:', error)
+        throw error
+      }
+    }
packages/plugins/materials/src/meta/block/src/BlockGroup.vue (3)

Line range hint 241-259: Consider consolidating error handling across API calls.

The error handling pattern varies across different API calls. For example:

  • deleteGroup uses a message modal
  • handleChangeGroupName uses a direct message
  • handleConfirmDeleteGroup uses a Notify component

Consider standardizing the error handling approach for better maintainability.

Here's a suggested approach to standardize error handling:

const handleApiError = (error, operation) => {
  const errorMessage = `${operation}失败: ${error.message || error}`
  message({ message: errorMessage, status: 'error' })
}

// Example usage in API calls:
requestDeleteGroup(groupId)
  .then(/* success handler */)
  .catch((error) => handleApiError(error, '删除区块分组'))

Also applies to: 286-301, 318-334


Line range hint 4-6: Consider adding TypeScript for better type safety.

The component handles complex data structures and API responses. Adding TypeScript would help catch potential type-related issues early and improve maintainability.

Key areas that would benefit from type definitions:

  • API response types for group operations
  • Props and state interfaces
  • Function parameter types (especially for the getAppId function)

Example type definitions:

interface Group {
  groupId: string
  groupName: string
}

interface BlockGroupState {
  groups: Group[]
  currentEditId: string | null
  // ... other state properties
}

Also applies to: 179-179, 241-259, 286-301, 318-334


Line range hint 1-450: Consider breaking down the component for better maintainability.

The component handles multiple responsibilities:

  • Group CRUD operations
  • Form management
  • Modal dialogs
  • UI state management

Consider extracting some functionality into composables for better separation of concerns.

Suggested structure:

  1. Extract group CRUD operations into a useGroupOperations composable
  2. Extract form handling into a useGroupForm composable
  3. Extract modal/popover logic into a useGroupModals composable

This would make the component more maintainable and testable.

packages/plugins/block/src/js/blockSetting.jsx (3)

Line range hint 589-594: Add error handling to getCategories function.

The function should handle potential errors from the API call to prevent silent failures.

 const getCategories = () => {
   const appId = getAppId()
-  fetchCategories({ appId }).then((res) => {
-    useBlock().setCategoryList(res)
-  })
+  fetchCategories({ appId })
+    .then((res) => {
+      useBlock().setCategoryList(res)
+    })
+    .catch((error) => {
+      useNotify({
+        type: 'error',
+        message: `Failed to fetch categories: ${error.message}`
+      })
+    })
 }

Line range hint 708-741: Optimize generateBlockDeps for better performance.

The recursive function could benefit from memoization to avoid reprocessing the same components multiple times in complex nested structures.

+const memoizedDeps = new Map()
+
 const generateBlockDeps = (children, deps = { scripts: [], styles: new Set() }) => {
   children.forEach((child) => {
     const component = useMaterial().getMaterial(child.componentName)
 
     if (!component) return
 
+    const memoKey = `${child.componentName}-${component.npm?.version}`
+    if (memoizedDeps.has(memoKey)) {
+      const cached = memoizedDeps.get(memoKey)
+      deps.scripts.push(...cached.scripts)
+      cached.styles.forEach(style => deps.styles.add(style))
+      return
+    }
+
     const { npm, component: componentName } = component
 
     if (npm) {
       const { package: pkg, exportName, css, version, script } = npm
       // ... rest of the implementation
     }
 
     // Recursive call
     if (child.children) {
       generateBlockDeps(child.children, deps)
     }
+
+    memoizedDeps.set(memoKey, {
+      scripts: [...deps.scripts],
+      styles: new Set(deps.styles)
+    })
   })
 
   return deps
 }

Line range hint 597-636: Enhance error handling in createBlock function.

The error handling could be more informative and consistent with other functions in the codebase.

 const createBlock = (block = {}) => {
   const { message } = useModal()
   const created_app = getAppId()
+  if (!created_app) {
+    message({ 
+      message: 'Failed to create block: Application ID is missing',
+      status: 'error'
+    })
+    return
+  }
+
   const params = { ...block, created_app }

   // ... rest of the implementation

   requestCreateBlock(params)
     .then((data) => {
+      if (!data?.id) {
+        throw new Error('Invalid response: Block ID is missing')
+      }
       // ... success handling
     })
     .catch((error) => {
-      message({ message: error.message, status: 'error' })
+      message({ 
+        message: `Failed to create block: ${error.message}`,
+        status: 'error',
+        duration: 5000  // Give users more time to read error messages
+      })
+      useCanvas().setSaved(false)  // Ensure unsaved state is reflected
     })
 }
📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

📥 Commits

Reviewing files that changed from the base of the PR and between 4bebcb3 and 4f090aa.

📒 Files selected for processing (8)
  • packages/plugins/block/src/js/blockSetting.jsx (1 hunks)
  • packages/plugins/bridge/src/js/resource.js (1 hunks)
  • packages/plugins/datasource/src/DataSourceForm.vue (1 hunks)
  • packages/plugins/materials/src/meta/block/src/BlockGroup.vue (1 hunks)
  • packages/plugins/materials/src/meta/block/src/BlockGroupPanel.vue (1 hunks)
  • packages/plugins/materials/src/meta/block/src/BlockList.vue (1 hunks)
  • packages/plugins/materials/src/meta/block/src/BlockPanel.vue (1 hunks)
  • packages/plugins/page/src/PageTree.vue (1 hunks)
🔇 Additional comments (6)
packages/plugins/bridge/src/js/resource.js (2)

119-119: Verify error propagation in resource operations

The getAppId() function is used in critical resource operations. We should ensure that errors are properly handled throughout the call chain.

Let's verify the error handling in dependent operations:

#!/bin/bash
# Description: Check error handling in resource operations that use getAppId()

# Test 1: Check for try-catch blocks in resource operations
echo "Checking error handling in resource operations..."
ast-grep --pattern 'try {
  $$$
  getAppId()
  $$$
} catch'

# Test 2: Look for error handling in HTTP request functions
echo "Checking HTTP request error handling..."
rg "requestUpdateReSource|requestAddReSource|requestDeleteReSource" -A 5

Consider implementing consistent error handling across all resource operations:

  1. Add error boundaries around resource operations
  2. Implement retry mechanisms for transient failures
  3. Add proper error reporting to the notification system
  4. Consider adding a global error handler for resource operations

Would you like me to provide a detailed implementation for any of these suggestions?

Also applies to: 123-127, 213-252, 256-284


119-119: Verify error handling for getBaseInfo()

While the change aligns with the broader refactoring effort across components, we should ensure proper error handling when retrieving the application ID.

Let's verify the implementation and add error handling:

Consider adding error handling:

-const getAppId = () => getMetaApi(META_SERVICE.GlobalService).getBaseInfo().id
+const getAppId = () => {
+  try {
+    const baseInfo = getMetaApi(META_SERVICE.GlobalService).getBaseInfo()
+    if (!baseInfo?.id) {
+      throw new Error('Application ID not found')
+    }
+    return baseInfo.id
+  } catch (error) {
+    console.error('Failed to retrieve application ID:', error)
+    throw error
+  }
+}
packages/plugins/materials/src/meta/block/src/BlockPanel.vue (2)

51-51: LGTM! The API transition looks correct.

The change from getState() to getMetaApi(META_SERVICE.GlobalService).getBaseInfo() aligns with the PR's objective of refactoring the HTTP service implementation.


51-51: Verify the impact of API changes across the codebase.

Since this is part of a larger API transition, let's verify other components using similar patterns.

✅ Verification successful

Let me search for similar patterns to verify the API usage across the codebase. The previous command failed because the file type wasn't recognized, so I'm now searching with more generic patterns without file type restriction.


The API usage pattern is consistent across the codebase

The search results show that the pattern getMetaApi(META_SERVICE.GlobalService).getBaseInfo().id is consistently used across multiple components and there's no evidence of outdated patterns that need updating. The implementation in BlockPanel.vue follows the same pattern used in other files.

  • All instances use getMetaApi(META_SERVICE.GlobalService).getBaseInfo() to retrieve the ID
  • No deprecated patterns like getState() were found
  • The pattern is used consistently in various components across different packages
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for other components that might need similar updates
rg "getState\(\).*\.id" --type vue

Length of output: 64


Script:

#!/bin/bash
# Search for similar patterns using getMetaApi and getBaseInfo
rg "getMetaApi.*getBaseInfo\(\)\.id"

# Also search for GlobalService usage
rg "META_SERVICE\.GlobalService.*getBaseInfo"

Length of output: 3128

packages/plugins/materials/src/meta/block/src/BlockList.vue (1)

84-84: LGTM! Good encapsulation of app ID retrieval.

The introduction of getAppId function aligns with the codebase-wide refactoring to use getBaseInfo().id for retrieving the application ID.

packages/plugins/datasource/src/DataSourceForm.vue (1)

144-144: Verify the impact of async app ID retrieval.

The current synchronous usage of getAppId() in deleteDataSource and save functions may need to be updated if getBaseInfo() is asynchronous.

Let's verify the asynchronous nature of getBaseInfo:

If getBaseInfo is indeed asynchronous, the following functions need updates:

  1. deleteDataSource: Update the promise chain
  2. save: Update both update and add operations

chilingling
chilingling previously approved these changes Nov 5, 2024
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🧹 Outside diff range and nitpick comments (5)
packages/plugins/materials/src/meta/block/src/http.js (3)

Line range hint 46-85: Consider optimizing block filtering for large datasets.

The current implementation loads all blocks and then filters them in memory. For large datasets, this could impact performance.

Consider these optimizations:

 export const fetchGroupBlocksByIds = async ({ groupIds }) => {
+  const dslMode = getMergeMeta('engine.config')?.dslMode
   const blockGroups = await getMetaApi(META_SERVICE.Http).get(
-    `/material-center/api/block-groups${getParams({
-      id: groupIds
-    })}`
+    `/material-center/api/block-groups${getParams({
+      id: groupIds,
+      framework: dslMode  // Filter at API level if supported
+    })}`
   )

   // Consider using a more efficient data structure for large datasets
   const blockIdSet = new Set()
-  const dslMode = getMergeMeta('engine.config')?.dslMode

   const blocks = blockGroups
     .map((group) => group.blocks.map((block) => ({ ...block, groupId: group.id, groupName: group.name })))
     .flat()
     .filter(({ framework, id }) => {
       if (dslMode === framework && !blockIdSet.has(id)) {
         blockIdSet.add(id)
         return true
       }
       return false
     })

   return blocks || []
 }

Line range hint 140-142: Add input validation for backup restoration.

The restore operation should validate the input parameters before making the API call.

 export const requestRestoreBackup = ({ blockId, backupId }) => {
+  if (!blockId || !backupId) {
+    throw new Error('Block ID and backup ID are required for restoration')
+  }
   getMetaApi(META_SERVICE.Http).post(`/material-center/api/block/update/${blockId}`, { current_history: backupId })
 }

Line range hint 1-142: Consider splitting the service into smaller, focused modules.

The file handles multiple distinct operations (groups, blocks, backups, etc.). Consider splitting it into separate services for better maintainability:

  • blockGroupService.js
  • blockService.js
  • backupService.js

This would:

  1. Improve code organization
  2. Make the codebase more maintainable
  3. Allow for better separation of concerns
  4. Make testing easier
packages/plugins/materials/src/meta/block/src/BlockDetail.vue (1)

85-87: Consider adding error handling for getBaseInfo().

While the code handles errors from the HTTP requests, it might be worth adding specific error handling for getBaseInfo() in case the method fails or returns unexpected data structure.

-            const appId = getMetaApi(META_SERVICE.GlobalService).getBaseInfo().id
+            const baseInfo = getMetaApi(META_SERVICE.GlobalService).getBaseInfo()
+            if (!baseInfo?.id) {
+              throw new Error('Failed to get application ID')
+            }
+            const appId = baseInfo.id
             requestUpdateGroup({ id: groupId, blocks, app: appId }).then(() => {
packages/plugins/page/src/PageFolderSetting.vue (1)

Line range hint 190-194: Fix incorrect notification type in error handling.

The error notification is using type: 'success' when it should be type: 'error' for the folder deletion failure case.

Apply this fix:

             .catch((error) => {
               useNotify({
-                type: 'success',
+                type: 'error',
                 title: '删除文件夹失败!',
                 message: JSON.stringify(error?.message || error)
📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

📥 Commits

Reviewing files that changed from the base of the PR and between 4f090aa and 861511d.

📒 Files selected for processing (11)
  • packages/configurator/src/collection-configurator/CollectionConfigurator.vue (1 hunks)
  • packages/configurator/src/variable-configurator/VariableConfigurator.vue (1 hunks)
  • packages/plugins/bridge/src/BridgeSetting.vue (1 hunks)
  • packages/plugins/datasource/src/DataSourceGlobalDataHandler.vue (1 hunks)
  • packages/plugins/datasource/src/DataSourceList.vue (1 hunks)
  • packages/plugins/i18n/src/Main.vue (2 hunks)
  • packages/plugins/materials/src/meta/block/src/BlockDetail.vue (1 hunks)
  • packages/plugins/materials/src/meta/block/src/http.js (6 hunks)
  • packages/plugins/page/src/PageFolderSetting.vue (1 hunks)
  • packages/plugins/page/src/PageSetting.vue (1 hunks)
  • packages/plugins/robot/src/js/robotSetting.js (1 hunks)
🚧 Files skipped from review as they are similar to previous changes (4)
  • packages/configurator/src/collection-configurator/CollectionConfigurator.vue
  • packages/configurator/src/variable-configurator/VariableConfigurator.vue
  • packages/plugins/i18n/src/Main.vue
  • packages/plugins/robot/src/js/robotSetting.js
🔇 Additional comments (9)
packages/plugins/datasource/src/DataSourceGlobalDataHandler.vue (1)

58-58: LGTM! Verify consistent usage of getBaseInfo()

The change aligns with the PR's objective of standardizing HTTP-related functionality.

Let's verify that this pattern is consistently used across the codebase:

✅ Verification successful

Consistent usage of getBaseInfo() confirmed

The verification shows that:

  • The old pattern getState().appInfo.id is completely removed from the codebase
  • The new pattern getMetaApi(META_SERVICE.GlobalService).getBaseInfo().id is consistently used across all relevant files
  • No inconsistencies or remaining instances of the old pattern were found
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check for any remaining instances of old pattern and confirm new pattern usage
# Test 1: Search for old pattern. Expect: No results
rg "getState\(\)\.appInfo\.id"

# Test 2: Verify the new pattern usage
rg "getBaseInfo\(\)\.id"

Length of output: 2570

packages/plugins/materials/src/meta/block/src/http.js (1)

Line range hint 32-42: Verify API endpoint consistency across the application.

The endpoints /material-center/api/block-groups and /material-center/api/block are being used. Let's ensure these endpoints are consistently used across the application.

✅ Verification successful

API endpoints are consistent across the application

The verification shows that all block-related API endpoints consistently use the /material-center/api/ base path, with proper RESTful conventions for different operations. The endpoints in the reviewed file (/material-center/api/block-groups and /material-center/api/block) align perfectly with the usage patterns across the codebase, including both client-side requests and server-side route definitions.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check for consistency in material-center API endpoints
# Expected: All API calls should use the same base path

echo "Checking material-center API endpoint usage..."
rg -g '*.{js,ts,vue}' '/material-center/api/' --no-filename | sort | uniq

Length of output: 3885

packages/plugins/datasource/src/DataSourceList.vue (1)

56-56: LGTM! Verify usage of the refresh function.

The change aligns with the PR objectives of refactoring HTTP-related functionality and maintains the fallback to URL parameters.

Let's verify the usage of this exported refresh function across the codebase:

✅ Verification successful

Let me check how the refresh function is used in the files that import it.


Change is safe and properly scoped

The refresh function from DataSourceList.vue is only imported and used in one place - the parent component Main.vue within the same datasource plugin. The change to use getMetaApi is properly contained within this plugin's scope and doesn't have wider impact across the codebase.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for imports and usage of the refresh function from DataSourceList
rg -A 2 "from ['\"].*DataSourceList" 

Length of output: 580


Script:

#!/bin/bash
# Check usage of refreshDataSourceList in Main.vue
rg -A 5 "refreshDataSourceList" packages/plugins/datasource/src/Main.vue

Length of output: 474

packages/plugins/materials/src/meta/block/src/BlockDetail.vue (1)

85-85: Verify consistent usage of getBaseInfo() across components.

The change from getState().appInfo.id to getBaseInfo().id aligns with the broader refactoring pattern seen in other components.

Let's verify the consistent usage across the codebase:

✅ Verification successful

Migration to getBaseInfo() is consistent across the codebase

The verification shows that:

  • No instances of the old pattern getState().appInfo.id were found
  • The new pattern getBaseInfo().id is consistently used across multiple components and plugins
  • All usages follow the same pattern: obtaining the ID through getMetaApi(META_SERVICE.GlobalService).getBaseInfo().id
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check for any remaining instances of getState().appInfo.id and compare with getBaseInfo().id usage

# Search for old pattern
echo "Checking for remaining instances of getState().appInfo.id:"
rg "getState\(\)\.appInfo\.id"

# Search for new pattern
echo -e "\nChecking new pattern usage:"
rg "getBaseInfo\(\)\.id"

Length of output: 2768

packages/plugins/page/src/PageFolderSetting.vue (2)

Line range hint 166-173: LGTM: Good safety check for folder deletion.

The validation logic prevents accidental deletion of non-empty folders, which is a good safety measure. The implementation correctly uses optional chaining and provides a clear error message.


108-108: Verify consistent usage of getBaseInfo() across the codebase.

The change from getState().appInfo.id to getBaseInfo().id appears to be part of a broader API migration. Let's verify that this change is consistently applied across the codebase.

✅ Verification successful

API migration is consistently implemented across the codebase

The verification shows that:

  1. No instances of the old API getState().appInfo.id were found in the codebase
  2. The new API getBaseInfo().id is consistently used across multiple components and plugins
  3. The implementation in PageFolderSetting.vue follows the same pattern as other files
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check for any remaining instances of the old API usage
# and verify consistent usage of the new API

echo "Checking for old API usage..."
rg "getState\(\)\.appInfo\.id"

echo "Verifying new API usage..."
rg "getBaseInfo\(\)\.id"

Length of output: 2702

packages/plugins/bridge/src/BridgeSetting.vue (1)

212-212: LGTM: Consistent with the codebase-wide refactoring pattern.

The change from getState().appInfo.id to getBaseInfo().id aligns with the standardization of how application IDs are retrieved across components.

Let's verify this pattern is consistently applied across the codebase:

✅ Verification successful

Refactoring pattern successfully verified across the codebase

The verification confirms that:

  • No instances of the old pattern getState().appInfo.id remain in the codebase
  • The new pattern getBaseInfo().id is consistently used across multiple components and services
  • The change in BridgeSetting.vue aligns perfectly with this standardized approach
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify the consistent usage of getBaseInfo() vs getState().appInfo
# Expected: All occurrences should use getBaseInfo() after the refactor

echo "Checking for any remaining uses of getState().appInfo.id:"
rg "getState\(\)\.appInfo\.id"

echo "Verifying the adoption of getBaseInfo().id:"
rg "getBaseInfo\(\)\.id"

Length of output: 2792

packages/plugins/page/src/PageSetting.vue (2)

Line range hint 13-13: Consider migrating local HTTP handling to the new httpService.

The current implementation imports HTTP functionality from a local http.js file. As part of the HTTP refactoring effort:

  1. Consider migrating these HTTP operations to use the new httpService.
  2. Enhance error handling to better handle potential failures from the new service.

Let's analyze the current HTTP implementation:

#!/bin/bash
# Description: Analyze current HTTP implementation and its usage

# Check the local http.js implementation
echo "Checking local http.js implementation:"
rg -p "requestCreatePage|requestDeletePage" ./packages/plugins/page/src/

# Look for similar patterns that might need migration
echo -e "\nChecking for similar HTTP patterns across the codebase:"
rg -p "import.*http.*from.*'" --type vue --type js

174-174: Verify consistent usage of getBaseInfo() across the codebase.

The change from getState().appInfo.id to getBaseInfo().id aligns with the architectural changes. However, we should ensure this pattern is consistently applied across the codebase.

Let's verify the consistency of this change:

✅ Verification successful

The previous search might have failed due to specific syntax. Let's try a broader search to catch any variations of these patterns and understand the context better. This will help us verify if the change is consistent and if there are any remaining instances of the old pattern.


Change is consistently implemented across the codebase

The search results confirm that:

  1. There are no remaining instances of the old pattern getState().appInfo.id
  2. The new pattern getBaseInfo().id is consistently used across multiple packages and components
  3. All app ID retrievals use the same approach via getMetaApi(META_SERVICE.GlobalService).getBaseInfo().id
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check for any remaining instances of getState().appInfo.id and compare with new getBaseInfo().id usage

# Search for old pattern
echo "Checking for remaining instances of old pattern (getState().appInfo.id):"
rg "getState\(\)\.appInfo\.id"

# Search for new pattern
echo -e "\nChecking usage of new pattern (getBaseInfo().id):"
rg "getBaseInfo\(\)\.id"

Length of output: 1097


Script:

#!/bin/bash
# Let's search for both patterns more broadly to catch variations
echo "Checking for old pattern variations:"
rg "getState.*appInfo.*id"

echo -e "\nChecking for new pattern variations:"
rg "getBaseInfo.*id"

echo -e "\nChecking for getMetaApi usage context:"
rg -A 2 "getMetaApi.*GlobalService"

Length of output: 11864

hexqi
hexqi previously approved these changes Nov 6, 2024
Copy link
Collaborator

@hexqi hexqi left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

出码那块没有修改,还是之前的http文件

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 0

🧹 Outside diff range and nitpick comments (2)
designer-demo/src/preview.js (1)

27-27: Consider consistent ordering of services.

The addition of HttpService to the metas array is correct. However, consider maintaining a consistent alphabetical order of services (e.g., [GenerateCodeService, HttpService]) to improve readability and maintainability.

-      metas: [HttpService, GenerateCodeService]
+      metas: [GenerateCodeService, HttpService]
packages/design-core/src/preview/src/main.js (1)

26-27: Consider documenting HTTP service configuration for preview mode.

Since this PR introduces support for user-defined HTTP request configurations, consider:

  1. Adding documentation on how to configure HTTP services specifically for preview mode
  2. Providing examples of common preview-specific HTTP configurations
  3. Explaining any preview-specific limitations or considerations
📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

📥 Commits

Reviewing files that changed from the base of the PR and between 227da30 and 2b16423.

📒 Files selected for processing (3)
  • designer-demo/src/preview.js (2 hunks)
  • packages/design-core/src/preview/src/main.js (2 hunks)
  • packages/design-core/src/preview/src/preview/importMap.json (0 hunks)
💤 Files with no reviewable changes (1)
  • packages/design-core/src/preview/src/preview/importMap.json
🔇 Additional comments (3)
designer-demo/src/preview.js (1)

17-17: LGTM!

The import statement follows the existing pattern and correctly imports the HttpService from the local composable module.

packages/design-core/src/preview/src/main.js (2)

15-15: LGTM! Import changes are well-structured.

The addition of initServices to the existing import statement maintains good code organization by grouping related functions from the same package.


26-27: Verify error handling and execution order of initServices.

While the placement of initServices() before app creation seems logical, please verify:

  1. Error handling strategy for potential initialization failures
  2. Whether this function is asynchronous and needs to be awaited
  3. The correct execution order relative to defineEntry

Let's check the implementation of initServices:

✅ Verification successful

Based on the results, I can now generate the final response:

No error handling needed for synchronous initServices

The implementation of initServices shows it's a synchronous function that simply initializes registered meta services. The current placement after defineEntry is correct as it processes the services defined in the registry. No try-catch or await is necessary because:

  • It's a synchronous function (uses regular forEach, not Promise-based)
  • The initialization is already defensive with null checks (if (context))
  • It's correctly placed after service definitions but before app creation
🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check the implementation and usage of initServices
# Expected: Find the implementation to verify if it's async and how errors are handled

# Search for the implementation
ast-grep --pattern 'export const initServices = $_'

# Search for other usages to understand the common patterns
rg 'initServices' -A 3

Length of output: 2365

@chilingling chilingling merged commit d019814 into opentiny:refactor/develop Nov 6, 2024
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
ready_for_review This PR requires more reviews refactor-main refactor/develop branch feature
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants