Compare commits

..

4 Commits

Author SHA1 Message Date
ace38a84e2 fix race condition 2026-03-19 12:52:38 +08:00
5d96c565c1 small fix 2026-03-19 11:39:03 +08:00
6f63f0519c feat(ui): add revision change indicator to refresh button 2026-03-18 18:00:38 +08:00
c0dca4477b feat(store): add revision tracking to fileChangeStore 2026-03-18 18:00:38 +08:00
5 changed files with 97 additions and 17 deletions

View File

@@ -1,4 +1,4 @@
import { app, shell, BrowserWindow, ipcMain } from "electron"; import { app, shell, BrowserWindow } from "electron";
import { join } from "path"; import { join } from "path";
import { electronApp, optimizer, is } from "@electron-toolkit/utils"; import { electronApp, optimizer, is } from "@electron-toolkit/utils";
import { registerIpcHandlers } from "./ipc-handlers"; import { registerIpcHandlers } from "./ipc-handlers";

View File

@@ -3,9 +3,9 @@
* Displays app configuration details with file management and deploy functionality. * Displays app configuration details with file management and deploy functionality.
*/ */
import React, { useCallback, useEffect, useState } from "react"; import React, { useCallback, useEffect, useRef, useState } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { Spin, Tag, Space, App as AntApp, Tooltip } from "antd"; import { Spin, Tag, Space, App as AntApp, Tooltip, Badge } from "antd";
import { Button, Empty } from "@lobehub/ui"; import { Button, Empty } from "@lobehub/ui";
import { LayoutGrid, Download, History, Rocket, Monitor, Smartphone, ArrowLeft, RefreshCw } from "lucide-react"; import { LayoutGrid, Download, History, Rocket, Monitor, Smartphone, ArrowLeft, RefreshCw } from "lucide-react";
import { createStyles, useTheme } from "antd-style"; import { createStyles, useTheme } from "antd-style";
@@ -116,20 +116,34 @@ const AppDetail: React.FC = () => {
async (onSuccessCallback?: () => Promise<void> | void) => { async (onSuccessCallback?: () => Promise<void> | void) => {
if (!currentDomain || !selectedAppId) return undefined; if (!currentDomain || !selectedAppId) return undefined;
// Capture at request time to detect staleness after awaits
const capturedDomainId = currentDomain.id;
const capturedAppId = selectedAppId;
setLoading(true); setLoading(true);
try { try {
const result = await window.api.getAppDetail({ const result = await window.api.getAppDetail({
domainId: currentDomain.id, domainId: capturedDomainId,
appId: selectedAppId, appId: capturedAppId,
}); });
// Check if we're still on the same app and component is mounted before updating
if (result.success) { if (result.success) {
setCurrentApp(result.data); // Guard: discard stale responses from previous domain/app switches
// Call the callback if provided const nowDomainId = useDomainStore.getState().currentDomain?.id;
const nowAppId = useAppStore.getState().selectedAppId;
if (nowDomainId !== capturedDomainId || nowAppId !== capturedAppId) return undefined;
if (onSuccessCallback) { if (onSuccessCallback) {
await onSuccessCallback(); await onSuccessCallback();
} }
// Store revision after callback to avoid being cleared by clearChanges
const revision = result.data.customization?.revision;
setCurrentApp(result.data);
// Must be AFTER callback since clearChanges() resets serverRevision to null
// Only update knownRevision when user explicitly refreshes or after deployment
if (revision && shouldUpdateKnownRevision) {
fileChangeStore.setServerRevision(capturedDomainId, capturedAppId, revision);
}
return result.data; return result.data;
} }
return undefined; return undefined;
@@ -137,8 +151,14 @@ const AppDetail: React.FC = () => {
console.error("Failed to load app detail:", error); console.error("Failed to load app detail:", error);
return undefined; return undefined;
} finally { } finally {
// Only reset loading if still on the same context; otherwise the new
// request's loading state should not be cleared by this stale response.
const nowDomainId = useDomainStore.getState().currentDomain?.id;
const nowAppId = useAppStore.getState().selectedAppId;
if (nowDomainId === capturedDomainId && nowAppId === capturedAppId) {
setLoading(false); setLoading(false);
} }
}
}, },
[currentDomain, selectedAppId, setCurrentApp, setLoading] [currentDomain, selectedAppId, setCurrentApp, setLoading]
); );
@@ -153,6 +173,9 @@ const AppDetail: React.FC = () => {
// Initialize file change store from Kintone data // Initialize file change store from Kintone data
useEffect(() => { useEffect(() => {
if (!currentApp || !currentDomain || !selectedAppId) return; if (!currentApp || !currentDomain || !selectedAppId) return;
// Guard against race condition: currentApp may be a stale response from a
// previous app's request that resolved after selectedAppId already changed.
if (String(currentApp.appId) !== String(selectedAppId)) return;
const customize = currentApp.customization; const customize = currentApp.customization;
if (!customize) return; if (!customize) return;
@@ -361,6 +384,10 @@ const AppDetail: React.FC = () => {
const changeCount = currentDomain && selectedAppId ? fileChangeStore.getChangeCount(currentDomain.id, selectedAppId) : { added: 0, deleted: 0, reordered: 0 }; const changeCount = currentDomain && selectedAppId ? fileChangeStore.getChangeCount(currentDomain.id, selectedAppId) : { added: 0, deleted: 0, reordered: 0 };
const hasChanges = changeCount.added > 0 || changeCount.deleted > 0 || changeCount.reordered > 0; const hasChanges = changeCount.added > 0 || changeCount.deleted > 0 || changeCount.reordered > 0;
const hasRemoteRevisionChange =
currentDomain && selectedAppId && currentApp.customization?.revision
? fileChangeStore.hasRemoteChange(currentDomain.id, selectedAppId, currentApp.customization.revision)
: false;
return ( return (
<div className={styles.container}> <div className={styles.container}>
@@ -371,9 +398,11 @@ const AppDetail: React.FC = () => {
<Tag>ID: {currentApp.appId}</Tag> <Tag>ID: {currentApp.appId}</Tag>
</div> </div>
<Space> <Space>
<Badge dot={hasRemoteRevisionChange}>
<Button icon={<RefreshCw size={16} />} loading={refreshing} onClick={handleRefresh}> <Button icon={<RefreshCw size={16} />} loading={refreshing} onClick={handleRefresh}>
{t("refresh", { ns: "common" })} {t("refresh", { ns: "common" })}
</Button> </Button>
</Badge>
<Button icon={<History size={16} />}>{t("versionHistory", { ns: "common" })}</Button> <Button icon={<History size={16} />}>{t("versionHistory", { ns: "common" })}</Button>
<Button icon={<Download size={16} />} loading={downloadingAll} onClick={handleDownloadAll}> <Button icon={<Download size={16} />} loading={downloadingAll} onClick={handleDownloadAll}>
{t("downloadAll")} {t("downloadAll")}

View File

@@ -88,24 +88,32 @@ const AppList: React.FC = () => {
const handleLoadApps = async () => { const handleLoadApps = async () => {
if (!currentDomain) return; if (!currentDomain) return;
const domainIdAtStart = currentDomain.id;
setLoading(true); setLoading(true);
setError(null); setError(null);
try { try {
const result = await window.api.getApps({ const result = await window.api.getApps({
domainId: currentDomain.id, domainId: domainIdAtStart,
}); });
// Discard result if domain switched during the request
if (useDomainStore.getState().currentDomain?.id !== domainIdAtStart) return;
if (result.success) { if (result.success) {
setApps(result.data); setApps(result.data);
} else { } else {
setError(result.error || t("loadAppsFailed")); setError(result.error || t("loadAppsFailed"));
} }
} catch (err) { } catch (err) {
if (useDomainStore.getState().currentDomain?.id === domainIdAtStart) {
setError(err instanceof Error ? err.message : t("loadAppsFailed")); setError(err instanceof Error ? err.message : t("loadAppsFailed"));
}
} finally { } finally {
if (useDomainStore.getState().currentDomain?.id === domainIdAtStart) {
setLoading(false); setLoading(false);
} }
}
}; };
// Sort apps // Sort apps

View File

@@ -150,7 +150,7 @@ const DomainManager: React.FC<DomainManagerProps> = ({ collapsed = false, onTogg
<div className={styles.collapsedName}>{currentDomain.name}</div> <div className={styles.collapsedName}>{currentDomain.name}</div>
<div className={styles.collapsedDesc}> <div className={styles.collapsedDesc}>
{currentDomain.username} ·{" "} {currentDomain.username} ·{" "}
<a target="_blank" href={"https://" + currentDomain.domain}> <a target="_blank" rel="noreferrer" href={"https://" + currentDomain.domain} onClick={(e) => e.stopPropagation()}>
{currentDomain.domain} {currentDomain.domain}
</a> </a>
</div> </div>

View File

@@ -31,6 +31,8 @@ interface AppFileState {
initialized: boolean; initialized: boolean;
/** Original order for each section: key is `${platform}:${fileType}`, value is ordered file IDs */ /** Original order for each section: key is `${platform}:${fileType}`, value is ordered file IDs */
originalSectionOrders: Record<string, string[]>; originalSectionOrders: Record<string, string[]>;
/** Server revision string from Kintone API, used to detect remote changes */
serverRevision: string | null;
} }
interface FileChangeState { interface FileChangeState {
@@ -93,6 +95,15 @@ interface FileChangeState {
hasPendingChanges: (domainId: string, appId: string) => boolean; hasPendingChanges: (domainId: string, appId: string) => boolean;
isInitialized: (domainId: string, appId: string) => boolean; isInitialized: (domainId: string, appId: string) => boolean;
/** Store the revision string from Kintone API */
setServerRevision: (domainId: string, appId: string, revision: string) => void;
/** Get the stored revision string */
getServerRevision: (domainId: string, appId: string) => string | null;
/** Check if the revision has changed (indicating remote modifications) */
hasRemoteChange: (domainId: string, appId: string, currentRevision: string) => boolean;
} }
const appKey = (domainId: string, appId: string) => `${domainId}:${appId}`; const appKey = (domainId: string, appId: string) => `${domainId}:${appId}`;
@@ -125,7 +136,7 @@ export const useFileChangeStore = create<FileChangeState>()(
set((state) => ({ set((state) => ({
appFiles: { appFiles: {
...state.appFiles, ...state.appFiles,
[key]: { files: entries, initialized: true, originalSectionOrders }, [key]: { files: entries, initialized: true, originalSectionOrders, serverRevision: null },
}, },
})); }));
}, },
@@ -137,6 +148,7 @@ export const useFileChangeStore = create<FileChangeState>()(
files: [], files: [],
initialized: true, initialized: true,
originalSectionOrders: {}, originalSectionOrders: {},
serverRevision: null,
}; };
return { return {
appFiles: { appFiles: {
@@ -244,6 +256,7 @@ export const useFileChangeStore = create<FileChangeState>()(
files: [], files: [],
initialized: false, initialized: false,
originalSectionOrders: {}, originalSectionOrders: {},
serverRevision: null,
}, },
}, },
})); }));
@@ -295,6 +308,36 @@ export const useFileChangeStore = create<FileChangeState>()(
const key = appKey(domainId, appId); const key = appKey(domainId, appId);
return get().appFiles[key]?.initialized ?? false; return get().appFiles[key]?.initialized ?? false;
}, },
setServerRevision: (domainId, appId, revision) => {
const key = appKey(domainId, appId);
set((state) => {
const existing = state.appFiles[key] ?? {
files: [],
initialized: false,
originalSectionOrders: {},
serverRevision: null,
};
return {
appFiles: {
...state.appFiles,
[key]: { ...existing, serverRevision: revision },
},
};
});
},
getServerRevision: (domainId, appId) => {
const key = appKey(domainId, appId);
return get().appFiles[key]?.serverRevision ?? null;
},
hasRemoteChange: (domainId, appId, currentRevision) => {
const key = appKey(domainId, appId);
const storedRevision = get().appFiles[key]?.serverRevision;
if (storedRevision == null) return false;
return storedRevision !== currentRevision;
},
}), }),
{ {
name: "file-change-storage", name: "file-change-storage",