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

feat(settings): add enable copilot switch #1538

Merged
merged 2 commits into from
Dec 27, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
2 changes: 1 addition & 1 deletion cli/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "mqttx-cli",
"version": "1.9.7",
"version": "1.9.8",
"description": "MQTTX Command Line Tools",
"keywords": [
"mqtt",
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "MQTTX",
"version": "1.9.7",
"version": "1.9.8",
"description": "MQTT desktop client",
"author": "EMQX Team <yusf@emqx.io>",
"scripts": {
Expand Down
1 change: 1 addition & 0 deletions src/background.ts
Original file line number Diff line number Diff line change
Expand Up @@ -126,6 +126,7 @@ async function createWindow() {
syncOsTheme: setting.syncOsTheme,
multiTopics: setting.multiTopics,
jsonHighlight: setting.jsonHighlight,
enableCopilot: setting.enableCopilot,
openAIAPIKey: setting.openAIAPIKey,
model: setting.model,
}
Expand Down
2 changes: 2 additions & 0 deletions src/database/database.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@ import { jsonHighlight1691071794840 } from './migration/1691071794840-jsonHighli
import { ALPNProtocols1691817588169 } from './migration/1691817588169-ALPNProtocols'
import { aiSettings1701761407723 } from './migration/1701761407723-aiSettings'
import { aiTables1701936842016 } from './migration/1701936842016-aiTables'
import { enableCopilot1703659148195 } from './migration/1703659148195-enableCopilot'

const STORE_PATH = getAppDataPath('MQTTX')
try {
Expand Down Expand Up @@ -88,6 +89,7 @@ const ORMConfig = {
ALPNProtocols1691817588169,
aiSettings1701761407723,
aiTables1701936842016,
enableCopilot1703659148195,
],
migrationsTableName: 'temp_migration_table',
entities: [
Expand Down
122 changes: 122 additions & 0 deletions src/database/migration/1703659148195-enableCopilot.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,122 @@
import { MigrationInterface, QueryRunner } from 'typeorm'

export class enableCopilot1703659148195 implements MigrationInterface {
name = 'enableCopilot1703659148195'

public async up(queryRunner: QueryRunner): Promise<void> {
await queryRunner.query(`
CREATE TABLE "temporary_SettingEntity" (
"id" varchar PRIMARY KEY NOT NULL,
"width" integer NOT NULL DEFAULT (1025),
"height" integer NOT NULL DEFAULT (749),
"autoCheck" boolean NOT NULL DEFAULT (1),
"currentLang" varchar CHECK(currentLang IN ('zh', 'en', 'ja', 'tr', 'hu')) NOT NULL DEFAULT ('en'),
"currentTheme" varchar CHECK(currentTheme IN ('light', 'dark', 'night')) NOT NULL DEFAULT ('light'),
"maxReconnectTimes" integer NOT NULL DEFAULT (10),
"autoResub" boolean NOT NULL DEFAULT (1),
"syncOsTheme" boolean NOT NULL DEFAULT (0),
"multiTopics" boolean NOT NULL DEFAULT (1),
"jsonHighlight" boolean NOT NULL DEFAULT (1),
"openAIAPIKey" varchar NOT NULL DEFAULT (''),
"model" varchar NOT NULL DEFAULT ('gpt-3.5-turbo'),
"enableCopilot" boolean NOT NULL DEFAULT (1)
)
`)
await queryRunner.query(`
INSERT INTO "temporary_SettingEntity"(
"id",
"width",
"height",
"autoCheck",
"currentLang",
"currentTheme",
"maxReconnectTimes",
"autoResub",
"syncOsTheme",
"multiTopics",
"jsonHighlight",
"openAIAPIKey",
"model"
)
SELECT "id",
"width",
"height",
"autoCheck",
"currentLang",
"currentTheme",
"maxReconnectTimes",
"autoResub",
"syncOsTheme",
"multiTopics",
"jsonHighlight",
"openAIAPIKey",
"model"
FROM "SettingEntity"
`)
await queryRunner.query(`
DROP TABLE "SettingEntity"
`)
await queryRunner.query(`
ALTER TABLE "temporary_SettingEntity"
RENAME TO "SettingEntity"
`)
}

public async down(queryRunner: QueryRunner): Promise<void> {
await queryRunner.query(`
ALTER TABLE "SettingEntity"
RENAME TO "temporary_SettingEntity"
`)
await queryRunner.query(`
CREATE TABLE "SettingEntity" (
"id" varchar PRIMARY KEY NOT NULL,
"width" integer NOT NULL DEFAULT (1025),
"height" integer NOT NULL DEFAULT (749),
"autoCheck" boolean NOT NULL DEFAULT (1),
"currentLang" varchar CHECK(currentLang IN ('zh', 'en', 'ja', 'tr', 'hu')) NOT NULL DEFAULT ('en'),
"currentTheme" varchar CHECK(currentTheme IN ('light', 'dark', 'night')) NOT NULL DEFAULT ('light'),
"maxReconnectTimes" integer NOT NULL DEFAULT (10),
"autoResub" boolean NOT NULL DEFAULT (1),
"syncOsTheme" boolean NOT NULL DEFAULT (0),
"multiTopics" boolean NOT NULL DEFAULT (1),
"jsonHighlight" boolean NOT NULL DEFAULT (1),
"openAIAPIKey" varchar NOT NULL DEFAULT (''),
"model" varchar NOT NULL DEFAULT ('gpt-3.5-turbo')
)
`)
await queryRunner.query(`
INSERT INTO "SettingEntity"(
"id",
"width",
"height",
"autoCheck",
"currentLang",
"currentTheme",
"maxReconnectTimes",
"autoResub",
"syncOsTheme",
"multiTopics",
"jsonHighlight",
"openAIAPIKey",
"model"
)
SELECT "id",
"width",
"height",
"autoCheck",
"currentLang",
"currentTheme",
"maxReconnectTimes",
"autoResub",
"syncOsTheme",
"multiTopics",
"jsonHighlight",
"openAIAPIKey",
"model"
FROM "temporary_SettingEntity"
`)
await queryRunner.query(`
DROP TABLE "temporary_SettingEntity"
`)
}
}
3 changes: 3 additions & 0 deletions src/database/models/SettingEntity.ts
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,9 @@ export default class SettingEntity {
@Column({ type: 'boolean', default: true })
jsonHighlight!: boolean

@Column({ type: 'boolean', default: true })
enableCopilot!: boolean

@Column({ type: 'varchar', default: '' })
openAIAPIKey!: string

Expand Down
7 changes: 7 additions & 0 deletions src/lang/settings.ts
Original file line number Diff line number Diff line change
Expand Up @@ -174,4 +174,11 @@ export default {
ja: 'モデル',
hu: 'Modell',
},
enableCopilot: {
zh: '启用 Copilot',
en: 'Enable Copilot',
tr: "Copilot'u Etkinleştir",
ja: 'Copilotを有効にする',
hu: 'Copilot engedélyezése',
},
}
1 change: 1 addition & 0 deletions src/store/getter.ts
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ const getters = {
currentScript: (state: State) => state.app.currentScript,
multiTopics: (state: State) => state.app.multiTopics,
jsonHighlight: (state: State) => state.app.jsonHighlight,
enableCopilot: (state: State) => state.app.enableCopilot,
openAIAPIKey: (state: State) => state.app.openAIAPIKey,
model: (state: State) => state.app.model,
isPrismButtonAdded: (state: State) => state.app.isPrismButtonAdded,
Expand Down
11 changes: 11 additions & 0 deletions src/store/modules/app.ts
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ const TOGGLE_JSON_HIGHLIGHT = 'TOGGLE_JSON_HIGHLIGHT'
const SET_OPEN_AI_API_KEY = 'SET_OPEN_AI_API_KEY'
const SET_MODEL = 'SET_MODEL'
const SET_INSERT_BUTTON_ADDED = 'SET_INSERT_BUTTON_ADDED'
const TOGGLE_ENABLE_COPILOT = 'TOGGLE_ENABLE_COPILOT'

const getShowSubscriptions = (): boolean => {
const $showSubscriptions: string | null = localStorage.getItem('showSubscriptions')
Expand Down Expand Up @@ -54,6 +55,7 @@ const app = {
willMessageVisible: true,
currentScript: null,
currentConnectionId: null,
enableCopilot: settingData.enableCopilot,
openAIAPIKey: settingData.openAIAPIKey || '',
model: settingData.model || 'gpt-3.5-turbo',
isPrismButtonAdded: false,
Expand Down Expand Up @@ -149,6 +151,9 @@ const app = {
[SET_INSERT_BUTTON_ADDED](state: App, isPrismButtonAdded: boolean) {
state.isPrismButtonAdded = isPrismButtonAdded
},
[TOGGLE_ENABLE_COPILOT](state: App, enableCopilot: boolean) {
state.enableCopilot = enableCopilot
},
},
actions: {
async TOGGLE_THEME({ commit }: any, payload: App) {
Expand Down Expand Up @@ -232,6 +237,12 @@ const app = {
async SET_CURRENT_CONNECTION_ID({ commit }: any, currentConnectionId: string) {
commit(SET_CURRENT_CONNECTION_ID, currentConnectionId)
},
async TOGGLE_ENABLE_COPILOT({ commit }: any, payload: App) {
const { settingService } = useServices()
commit(TOGGLE_ENABLE_COPILOT, payload.enableCopilot)
settingData.enableCopilot = payload.enableCopilot
await settingService.update(payload)
},
async SET_OPEN_AI_API_KEY({ commit }: any, payload: App) {
const { settingService } = useServices()
commit(SET_OPEN_AI_API_KEY, payload.openAIAPIKey)
Expand Down
1 change: 1 addition & 0 deletions src/types/global.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -105,6 +105,7 @@ declare global {
currentConnectionId: string | null
connectionTreeState: ConnectionTreeStateMap
jsonHighlight: boolean
enableCopilot: boolean
openAIAPIKey: string
model: AIModel
isPrismButtonAdded: boolean
Expand Down
2 changes: 1 addition & 1 deletion src/version.ts
Original file line number Diff line number Diff line change
@@ -1 +1 @@
export default '1.9.7'
export default '1.9.8'
11 changes: 8 additions & 3 deletions src/views/connections/ConnectionsDetail.vue
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<template>
<div class="connections-detail">
<copilot ref="copilot" :record="record" mode="connections" />
<copilot v-if="enableCopilot" ref="copilot" :record="record" mode="connections" />
<div ref="connectionTopbar" class="connections-topbar right-topbar">
<div class="connections-info">
<div class="topbar">
Expand Down Expand Up @@ -87,7 +87,7 @@
<i class="iconfont icon-a-stopscrip"></i>
</a>
</el-tooltip>
<a href="javascript:;" @click="toggleShowCopilot" style="margin-right: 12px">
<a href="javascript:;" v-if="enableCopilot" @click="toggleShowCopilot" style="margin-right: 12px">
<i class="el-icon-chat-line-square"></i>
</a>
<template v-if="!isNewWindow">
Expand Down Expand Up @@ -368,6 +368,7 @@ export default class ConnectionsDetail extends Vue {
@Getter('currentTheme') private theme!: Theme
@Getter('showClientInfo') private clientInfoVisibles!: { [id: string]: boolean }
@Getter('currentScript') private scriptOption!: ScriptState | null
@Getter('enableCopilot') private enableCopilot!: boolean

/**
* Notice: when we jump order by `other page` -> `creation page` -> `connection page`,
Expand Down Expand Up @@ -1789,10 +1790,14 @@ export default class ConnectionsDetail extends Vue {
* @param {string} msgTitle - The title of the error message.
*/
private notifyErrorWithCopilot(msgTitle: string, promptInfo?: string, callback?: () => void) {
const askCopilotButton = `
<button id="notify-copilot-button">Ask Copilot</button>
`
const message = this.enableCopilot ? askCopilotButton : ''
const notify = this.$notify({
title: msgTitle,
dangerouslyUseHTMLString: true,
message: '<button id="notify-copilot-button">Ask Copilot</button>',
message,
type: 'error',
duration: 4000,
offset: 30,
Expand Down
24 changes: 24 additions & 0 deletions src/views/settings/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -254,6 +254,22 @@
<div class="settings-title">MQTTX Copilot</div>
<el-divider></el-divider>

<el-row class="settings-item" type="flex" justify="space-between" align="middle">
<el-col :span="20">
<label>{{ $t('settings.enableCopilot') }}</label>
</el-col>
<el-col :span="4">
<el-switch
:value="enableCopilot"
active-color="#13ce66"
inactive-color="#A2A9B0"
@change="handleEnableCopilotSwitchChange"
>
</el-switch>
</el-col>
</el-row>
<el-divider></el-divider>

<el-row class="settings-item" type="flex" justify="space-between" align="middle">
<el-col :span="20">
<label>OpenAI API Key</label>
Expand All @@ -265,6 +281,7 @@
placeholder="sk-*******"
type="password"
clearable
:disabled="!enableCopilot"
@clear="handleAIConfigChanged('apiKey')"
@blur="handleAIConfigChanged('apiKey')"
></el-input>
Expand All @@ -281,6 +298,7 @@
class="settings-options ai-model-select"
v-model="aiConfig.model"
size="mini"
:disabled="!enableCopilot"
@change="handleAIConfigChanged('model')"
>
<el-option v-for="model in AImodelsOptions" :key="model" :label="model" :value="model"> </el-option>
Expand Down Expand Up @@ -314,6 +332,7 @@ export default class Settings extends Vue {
@Action('SET_MAX_RECONNECT_TIMES') private actionMaxReconnectTimes!: (payload: { maxReconnectTimes: number }) => void
@Action('TOGGLE_MULTI_TOPICS') private actionToggleMultiTopics!: (payload: { multiTopics: boolean }) => void
@Action('TOGGLE_JSON_HIGHLIGHT') private actionToggleJsonHighlight!: (payload: { jsonHighlight: boolean }) => void
@Action('TOGGLE_ENABLE_COPILOT') private actionToggleEnableCopilot!: (payload: { enableCopilot: boolean }) => void
@Action('SET_OPEN_AI_API_KEY') private actionSetOpenAIAPIKey!: (payload: { openAIAPIKey: string }) => void
@Action('SET_MODEL') private actionSetModel!: (payload: { model: AIModel }) => void

Expand All @@ -325,6 +344,7 @@ export default class Settings extends Vue {
@Getter('maxReconnectTimes') private maxReconnectTimes!: number
@Getter('multiTopics') private multiTopics!: boolean
@Getter('jsonHighlight') private jsonHighlight!: boolean
@Getter('enableCopilot') private enableCopilot!: boolean
@Getter('openAIAPIKey') private openAIAPIKey!: string
@Getter('model') private model!: AIModel

Expand Down Expand Up @@ -410,6 +430,10 @@ export default class Settings extends Vue {
this.showHistoryData = true
}

private handleEnableCopilotSwitchChange(value: boolean) {
this.actionToggleEnableCopilot({ enableCopilot: value })
}

private handleAIConfigChanged(action: 'apiKey' | 'model') {
if (action === 'apiKey') {
let saveKey = ''
Expand Down
2 changes: 1 addition & 1 deletion web/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "mqttx-web",
"version": "1.9.7",
"version": "1.9.8",
"license": "Apache-2.0",
"scripts": {
"serve": "vue-cli-service serve",
Expand Down
Loading