- - The complete IDE crafted for professional Go developers - -
-
-
-
- The complete IDE crafted for professional Go developers
-
-
+
+
-
-
+
+ No proxies match "{{ proxySearch }}" No proxies found
@@ -40,6 +31,14 @@ If you're looking for a meeting recording API, consider checking out [Recall.ai]
an API that records Zoom, Google Meet, Microsoft Teams, in-person meetings, and more.
+
+
+
+ The complete IDE crafted for professional Go developers
+
+Gold Sponsors
-
-
- The complete IDE crafted for professional Go developers
-
-
@@ -42,6 +33,14 @@ If you're looking for a meeting recording API, consider checking out [Recall.ai]
an API that records Zoom, Google Meet, Microsoft Teams, in-person meetings, and more.
+
+
+
+ The complete IDE crafted for professional Go developers
+
+',
+})
+
+const stubs = {
+ 'el-form-item': FormItemStub,
+ 'el-input': InputStub,
+ 'el-switch': defineComponent({
+ props: ['modelValue', 'disabled'],
+ emits: ['update:modelValue'],
+ template: '',
+ }),
+ KeyValueEditor: defineComponent({ template: '' }),
+ StringListEditor: defineComponent({ template: '' }),
+ PopoverMenu: defineComponent({ template: '' }),
+ PopoverMenuItem: defineComponent({ template: '' }),
+}
+
+describe('ConfigField', () => {
+ it('clamps numeric input and emits the public model update', async () => {
+ const wrapper = mount(ConfigField, {
+ props: { label: 'Port', type: 'number', modelValue: 100, min: 1, max: 65535 },
+ global: { stubs },
+ })
+
+ const input = wrapper.find('input')
+ await input.setValue('70000')
+
+ expect(wrapper.emitted('update:modelValue')).toContainEqual([65535])
+ expect((input.element as HTMLInputElement).value).toBe('65535')
+ })
+
+ it('keeps a leading sign as an editable draft until it becomes numeric', async () => {
+ const wrapper = mount(ConfigField, {
+ props: { label: 'Port', type: 'number', modelValue: 100 },
+ global: { stubs },
+ })
+
+ const input = wrapper.find('input')
+ await wrapper.setProps({ modelValue: 200 })
+ expect((input.element as HTMLInputElement).value).toBe('200')
+
+ await input.setValue('-')
+
+ expect(wrapper.emitted('update:modelValue')).toContainEqual([undefined])
+ await wrapper.setProps({ modelValue: undefined })
+ expect((input.element as HTMLInputElement).value).toBe('-')
+ })
+
+ it('renders an empty readonly field as a disabled placeholder', () => {
+ const wrapper = mount(ConfigField, {
+ props: { label: 'Secret', readonly: true, modelValue: '' },
+ global: { stubs },
+ })
+
+ const input = wrapper.find('input').element as HTMLInputElement
+ expect(wrapper.find('.config-field-label').text()).toBe('Secret')
+ expect(input.disabled).toBe(true)
+ expect(input.value).toBe('—')
+ })
+})
diff --git a/web/frpc/test/proxy-converters.test.ts b/web/frpc/test/proxy-converters.test.ts
new file mode 100644
index 00000000..69e3410b
--- /dev/null
+++ b/web/frpc/test/proxy-converters.test.ts
@@ -0,0 +1,96 @@
+import { describe, expect, it } from 'vitest'
+import {
+ createDefaultProxyForm,
+ createDefaultVisitorForm,
+} from '../src/types/proxy-form'
+import {
+ formToStoreProxy,
+ formToStoreVisitor,
+ storeProxyToForm,
+} from '../src/types/proxy-converters'
+
+describe('proxy converters', () => {
+ it('serializes only configured proxy fields into the typed store block', () => {
+ const form = createDefaultProxyForm()
+ Object.assign(form, {
+ name: 'web',
+ type: 'http',
+ enabled: false,
+ localIP: '10.0.0.8',
+ localPort: 8080,
+ useEncryption: true,
+ customDomains: ['example.com', ''],
+ locations: ['/api', ''],
+ metadatas: [{ key: 'team', value: 'edge' }],
+ })
+
+ expect(formToStoreProxy(form)).toEqual({
+ name: 'web',
+ type: 'http',
+ http: {
+ enabled: false,
+ localIP: '10.0.0.8',
+ localPort: 8080,
+ transport: { useEncryption: true },
+ metadatas: { team: 'edge' },
+ customDomains: ['example.com'],
+ locations: ['/api'],
+ },
+ })
+ })
+
+ it('round-trips store values while applying form defaults', () => {
+ const form = storeProxyToForm({
+ name: 'tcp-proxy',
+ type: 'tcp',
+ tcp: {
+ localPort: 9000,
+ customDomains: 'unused-for-tcp',
+ enabled: false,
+ metadatas: { owner: 'platform' },
+ },
+ })
+
+ expect(form).toMatchObject({
+ name: 'tcp-proxy',
+ type: 'tcp',
+ enabled: false,
+ localIP: '127.0.0.1',
+ localPort: 9000,
+ metadatas: [{ key: 'owner', value: 'platform' }],
+ multiplexer: 'httpconnect',
+ })
+ })
+
+ it.each(['stcp', 'xtcp'] as const)(
+ 'serializes virtual_net for %s visitors',
+ (type) => {
+ const form = createDefaultVisitorForm()
+ Object.assign(form, {
+ name: 'visitor',
+ type,
+ pluginType: 'virtual_net',
+ pluginDestinationIP: ' 192.0.2.10 ',
+ bindPort: 6000,
+ })
+
+ expect(formToStoreVisitor(form)[type]).toMatchObject({
+ plugin: { type: 'virtual_net', destinationIP: '192.0.2.10' },
+ bindPort: 6000,
+ })
+ },
+ )
+
+ it('does not serialize virtual_net for SUDP visitors', () => {
+ const form = createDefaultVisitorForm()
+ Object.assign(form, {
+ name: 'visitor',
+ type: 'sudp',
+ pluginType: 'virtual_net',
+ pluginDestinationIP: '192.0.2.10',
+ bindPort: 6000,
+ })
+
+ expect(formToStoreVisitor(form).sudp).toEqual({ bindPort: 6000 })
+ })
+})
diff --git a/web/frpc/tsconfig.node.json b/web/frpc/tsconfig.node.json
index 42872c59..a8583534 100644
--- a/web/frpc/tsconfig.node.json
+++ b/web/frpc/tsconfig.node.json
@@ -6,5 +6,5 @@
"moduleResolution": "bundler",
"allowSyntheticDefaultImports": true
},
- "include": ["vite.config.ts"]
+ "include": ["vite.config.mts"]
}
diff --git a/web/frpc/vite.config.mts b/web/frpc/vite.config.mts
index 6a9205d0..209a91fd 100644
--- a/web/frpc/vite.config.mts
+++ b/web/frpc/vite.config.mts
@@ -28,15 +28,10 @@ export default defineConfig({
'@shared': fileURLToPath(new URL('../shared', import.meta.url)),
},
dedupe: ['vue', 'element-plus', '@element-plus/icons-vue'],
- modules: [
- fileURLToPath(new URL('../node_modules', import.meta.url)),
- 'node_modules',
- ],
},
css: {
preprocessorOptions: {
scss: {
- api: 'modern',
additionalData: `@use "@shared/css/_index.scss" as *;`,
},
},
diff --git a/web/frps/auto-imports.d.ts b/web/frps/auto-imports.d.ts
index 1d89ee8c..9d240079 100644
--- a/web/frps/auto-imports.d.ts
+++ b/web/frps/auto-imports.d.ts
@@ -3,6 +3,7 @@
// @ts-nocheck
// noinspection JSUnusedGlobalSymbols
// Generated by unplugin-auto-import
+// biome-ignore lint: disable
export {}
declare global {
diff --git a/web/frps/components.d.ts b/web/frps/components.d.ts
index b5a18d79..e177245b 100644
--- a/web/frps/components.d.ts
+++ b/web/frps/components.d.ts
@@ -1,10 +1,14 @@
/* eslint-disable */
-/* prettier-ignore */
// @ts-nocheck
+// biome-ignore lint: disable
+// oxlint-disable
+// ------
// Generated by unplugin-vue-components
// Read more: https://github.com/vuejs/core/pull/3399
+
export {}
+/* prettier-ignore */
declare module 'vue' {
export interface GlobalComponents {
ClientCard: typeof import('./src/components/ClientCard.vue')['default']
@@ -15,7 +19,6 @@ declare module 'vue' {
ElEmpty: typeof import('element-plus/es')['ElEmpty']
ElIcon: typeof import('element-plus/es')['ElIcon']
ElInput: typeof import('element-plus/es')['ElInput']
- ElPopover: typeof import('element-plus/es')['ElPopover']
ElRow: typeof import('element-plus/es')['ElRow']
ElSwitch: typeof import('element-plus/es')['ElSwitch']
ElTag: typeof import('element-plus/es')['ElTag']
@@ -26,7 +29,7 @@ declare module 'vue' {
StatCard: typeof import('./src/components/StatCard.vue')['default']
Traffic: typeof import('./src/components/Traffic.vue')['default']
}
- export interface ComponentCustomProperties {
+ export interface GlobalDirectives {
vLoading: typeof import('element-plus/es')['ElLoadingDirective']
}
}
diff --git a/web/frps/package.json b/web/frps/package.json
index c44c0dd4..8cc42d50 100644
--- a/web/frps/package.json
+++ b/web/frps/package.json
@@ -9,12 +9,13 @@
"preview": "vite preview",
"build-only": "vite build",
"type-check": "vue-tsc --noEmit",
- "lint": "eslint --fix"
+ "lint": "eslint . --fix",
+ "lint:check": "eslint ."
},
"dependencies": {
- "element-plus": "^2.13.0",
- "vue": "^3.5.26",
- "vue-router": "^4.6.4"
+ "element-plus": "^2.14.3",
+ "vue": "^3.5.40",
+ "vue-router": "^5.2.0"
},
"devDependencies": {
"@types/node": "24",
@@ -22,19 +23,19 @@
"@vue/eslint-config-prettier": "^10.2.0",
"@vue/eslint-config-typescript": "^14.7.0",
"@vue/tsconfig": "^0.8.1",
- "@vueuse/core": "^14.1.0",
- "eslint": "^9.39.0",
- "eslint-plugin-vue": "^9.33.0",
+ "@vueuse/core": "^14.3.0",
+ "eslint": "^10.8.0",
+ "eslint-plugin-vue": "^10.10.0",
"npm-run-all": "^4.1.5",
- "prettier": "^3.7.4",
- "sass": "^1.97.2",
- "terser": "^5.44.1",
+ "prettier": "^3.9.6",
+ "sass": "^1.102.0",
+ "terser": "^5.49.0",
"typescript": "^5.9.3",
- "unplugin-auto-import": "^0.17.5",
+ "unplugin-auto-import": "^21.0.0",
"unplugin-element-plus": "^0.11.2",
- "unplugin-vue-components": "^0.26.0",
+ "unplugin-vue-components": "^32.1.0",
"vite": "^7.3.0",
"vite-svg-loader": "^5.1.0",
- "vue-tsc": "^3.2.2"
+ "vue-tsc": "^3.3.8"
}
}
diff --git a/web/frps/src/api/client.ts b/web/frps/src/api/client.ts
index 2be7d239..7a3982b7 100644
--- a/web/frps/src/api/client.ts
+++ b/web/frps/src/api/client.ts
@@ -24,3 +24,7 @@ export const getClientsV2 = (params: ClientListV2Params = {}) => {
export const getClient = (key: string) => {
return http.get
Connections
- {{ totalConnections }}
+ {{ client.status.curConns }}
Run ID
@@ -85,7 +85,7 @@
-
Proxies
- {{ filteredProxies.length }}
+ {{ total }}
+
@@ -130,13 +141,13 @@
@@ -483,6 +568,12 @@ html.dark .status-badge.online {
padding: 16px;
}
+.pagination-section {
+ display: flex;
+ justify-content: center;
+ padding: 0 20px 20px;
+}
+
.proxies-list {
display: flex;
flex-direction: column;
diff --git a/web/frps/src/views/Proxies.vue b/web/frps/src/views/Proxies.vue
index 80548bb8..734c85a5 100644
--- a/web/frps/src/views/Proxies.vue
+++ b/web/frps/src/views/Proxies.vue
@@ -27,36 +27,6 @@
clearable
class="main-search"
/>
-
-
-
+
+
+
@@ -111,7 +81,7 @@