🐛 fix(desktop): stub better-auth client for Electron renderer (#12563)

* 🐛 fix(desktop): stub better-auth client for Electron and improve drag regions

Add auth-client.desktop.ts noop stub so the Electron renderer build
skips the real better-auth dependency that was crashing module evaluation
and preventing React from mounting.

Also fix drag-bar regions in splash.html and error.html, and add
dev:desktop convenience script.

* ♻️ refactor(desktop): lazy-init better-auth client with remote server URL

Replace noop stub with Proxy-based lazy initialization that creates the
real better-auth client on first use, using the configured remote server
URL from the electron store as baseURL.

* 🔧 fix(desktop): update Proxy target in lazyProp for better-auth client initialization

Change the Proxy target in the lazyProp function from a noop stub to a function, ensuring the apply trap works correctly for lazy initialization of the better-auth client.

Signed-off-by: Innei <tukon479@gmail.com>

* 🐛 fix(profile): restrict SSO providers display to non-desktop view

Update the condition for rendering the SSO Providers Row in the Profile Settings to only show when the user is logged in and not on a desktop device. This change improves the user interface by preventing unnecessary display on desktop screens.

Signed-off-by: Innei <tukon479@gmail.com>

---------

Signed-off-by: Innei <tukon479@gmail.com>
This commit is contained in:
Innei
2026-03-01 22:20:10 +08:00
committed by GitHub
parent ee85ea728a
commit 37e90cebfa
5 changed files with 82 additions and 6 deletions

View File

@@ -5,10 +5,18 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>LobeHub - 连接错误</title>
<style>
body {
.drag-bar {
position: fixed;
top: 0;
left: 0;
right: 0;
height: 32px;
-webkit-app-region: drag;
}
body {
margin: 0;
padding: 0;
padding: 32px 0 0;
height: 100vh;
display: flex;
justify-content: center;
@@ -72,7 +80,6 @@
}
.retry-button {
-webkit-app-region: no-drag;
padding: 0.75rem 1.5rem;
background-color: #f5f5f5;
color: #1f1f1f;
@@ -89,6 +96,7 @@
</style>
</head>
<body>
<div class="drag-bar"></div>
<div class="container">
<div class="error-icon">⚠️</div>
<h1 class="error-title">Connection Error</h1>

View File

@@ -5,10 +5,18 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>LobeHub</title>
<style>
body {
.drag-bar {
position: fixed;
top: 0;
left: 0;
right: 0;
height: 48px;
-webkit-app-region: drag;
}
body {
margin: 0;
padding: 0;
padding: 48px 0 0;
height: 100vh;
display: flex;
justify-content: center;
@@ -70,6 +78,7 @@
</style>
</head>
<body>
<div class="drag-bar"></div>
<div class="container">
<svg
class="lobe-brand-loading"

View File

@@ -57,6 +57,7 @@
"desktop:package:local:reuse": "npm run package:local:reuse --prefix=./apps/desktop",
"dev": "tsx scripts/devStartupSequence.mts",
"dev:bun": "bun --bun next dev -p 3010",
"dev:desktop": "cd apps/desktop && pnpm run dev",
"dev:docker": "docker compose -f docker-compose/dev/docker-compose.yml up -d --wait postgresql redis rustfs searxng",
"dev:docker:down": "docker compose -f docker-compose/dev/docker-compose.yml down",
"dev:docker:reset": "docker compose -f docker-compose/dev/docker-compose.yml down -v && rm -rf docker-compose/dev/data && npm run dev:docker && pnpm db:migrate",

View File

@@ -0,0 +1,58 @@
import {
adminClient,
genericOAuthClient,
inferAdditionalFields,
magicLinkClient,
} from 'better-auth/client/plugins';
import { createAuthClient } from 'better-auth/react';
import { type auth } from '@/auth';
import { electronSyncSelectors } from '@/store/electron/selectors/sync';
import { getElectronStoreState } from '@/store/electron/store';
let _client: any = null;
function getClient() {
if (!_client) {
const baseURL = electronSyncSelectors.remoteServerUrl(getElectronStoreState());
_client = createAuthClient({
baseURL,
plugins: [
adminClient(),
inferAdditionalFields<typeof auth>(),
genericOAuthClient(),
magicLinkClient(),
],
});
}
return _client;
}
function lazyProp(key: string): any {
// Target must be a function for the Proxy apply trap to work
return new Proxy(function () {}, {
apply(_t, thisArg, args) {
return Reflect.apply(getClient()[key], thisArg, args);
},
get(_t, prop, receiver) {
const target = getClient()[key];
const value = Reflect.get(target, prop, receiver);
return typeof value === 'function' ? value.bind(target) : value;
},
});
}
export const changeEmail = lazyProp('changeEmail');
export const linkSocial = lazyProp('linkSocial');
export const oauth2 = lazyProp('oauth2');
export const accountInfo = lazyProp('accountInfo');
export const listAccounts = lazyProp('listAccounts');
export const requestPasswordReset = lazyProp('requestPasswordReset');
export const resetPassword = lazyProp('resetPassword');
export const sendVerificationEmail = lazyProp('sendVerificationEmail');
export const signIn = lazyProp('signIn');
export const signOut = lazyProp('signOut');
export const signUp = lazyProp('signUp');
export const unlinkAccount = lazyProp('unlinkAccount');
export const useSession = lazyProp('useSession');

View File

@@ -131,7 +131,7 @@ const ProfileSetting = ({ mobile }: ProfileSettingProps) => {
)}
{/* SSO Providers Row */}
{isLogin && (
{isLogin && !isDesktop && (
<>
<Divider style={{ margin: 0 }} />
<ProfileRow label={t('profile.sso.providers')} mobile={mobile}>