Skip to content

feat: remove env from mcp config #8337

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.

Sign up for GitHub

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

Merged
f2c-ci-robot merged 1 commit into from
Apr 7, 2025
Merged

feat: remove env from mcp config #8337

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
28 changes: 20 additions & 8 deletions frontend/src/views/ai/mcp/server/config/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,20 @@
<template #header>
<DrawerHeader :header="$t('menu.config')" :back="handleClose" />
</template>
<el-input type="textarea" :autosize="{ minRows: 10, maxRows: 20 }" v-model="prettyJson" readonly />
<codemirror
:autofocus="true"
:placeholder="$t('commons.msg.noneData')"
:indent-with-tab="true"
:tabSize="4"
style="height: 300px"
:lineWrapping="true"
:matchBrackets="true"
theme="cobalt"
:styleActiveLine="true"
:extensions="extensions"
v-model="prettyJson"
:disabled="true"
/>
<CopyButton :content="prettyJson" class="mt-2" />
<template #footer>
<el-button @click="handleClose">{{ $t('commons.button.cancel') }}</el-button>
Expand All @@ -20,6 +33,11 @@
<script lang="ts" setup>
import { AI } from '@/api/interface/ai';
import { ref } from 'vue';
import { Codemirror } from 'vue-codemirror';
import { javascript } from '@codemirror/lang-javascript';
import { oneDark } from '@codemirror/theme-one-dark';

const extensions = [javascript(), oneDark];

const open = ref(false);
const jsonObj = ref({
Expand All @@ -35,13 +53,7 @@ const acceptParams = (mcpServer: AI.McpServer) => {
jsonObj.value.mcpServers[mcpServer.name] = {
url: mcpServer.baseUrl + mcpServer.ssePath,
};
if (mcpServer.environments) {
jsonObj.value.mcpServers[mcpServer.name].env = {};
for (const env of mcpServer.environments) {
jsonObj.value.mcpServers[mcpServer.name].env[env.key] = env.value;
}
}
prettyJson.value = JSON.stringify(jsonObj.value, null, 4);
prettyJson.value = JSON.stringify(jsonObj.value, null, 2);
open.value = true;
};

Copy link
Copy Markdown
Member

@wanghe-fit2cloud wanghe-fit2cloud Apr 7, 2025

Choose a reason for hiding this comment

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

The updated code introduces the Vue-Codemirror component to display the prettyJson string in a formatted manner using Markdown syntax. The codemirror extension is set up with JavaScript syntax highlighting and One Dark theme.

Recommendations:

1. Code Consistency: Ensure that the usage and spacing of tags like <template>, <el-input>, etc., follow the same convention throughout the template file.

Original vs. Updated Code:

  • Original: 
    <el-input type="textarea" :autosize="{ minRows: 10, maxRows: 20 }">
    {{ prettyJson }}
</el-input>
  • Updated: 
    <codemirror autofocus tabindex="0" placeholder="$t('commons.msg.noneData')" indent-with-tab tabSize="4" height="300px" lineWrapping matchBrackets=true theme="cobalt" styleActiveLine=true extensions="[javascript(), oneDark]" v-model="prettyJson" disabled=false>

Ensure consistent indentation and use proper HTML attributes without spaces.

2. Accessibility Consideration: The disabled="true" attribute on the Codemirror input element prevents it from being editable which can potentially confuse users as they might assume it’s interactive. If you intend for users to be able to edit the text while viewing, remove the disabled attribute.

Updated Code:

<codemirror autofocus tabindex="0" placeholder="$t('commons.msg.noneData')" indent-with-tab tabSize="4" height="300px" lineWrapping matchBrackets=true theme="cobalt" styleActiveLine=true extensions="[javascript(), oneDark]" v-model="prettyJson">

By making these adjustments, the code will improve its readability and usability. Let me know if there's anything more needed!

Expand Down
Loading