feat(ui): add revision change indicator to refresh button

src/renderer/src/components/AppDetail/AppDetail.tsx

@@ -5,7 +5,7 @@
 
 import React, { useCallback, useEffect, useState } from "react";
 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 { LayoutGrid, Download, History, Rocket, Monitor, Smartphone, ArrowLeft, RefreshCw } from "lucide-react";
 import { createStyles, useTheme } from "antd-style";
@@ -126,10 +126,17 @@ const AppDetail: React.FC = () => {
         // Check if we're still on the same app and component is mounted before updating
         if (result.success) {
           setCurrentApp(result.data);
+          // Store revision after callback to avoid being cleared by clearChanges
+          const revision = result.data.customization?.revision;
           // Call the callback if provided
           if (onSuccessCallback) {
             await onSuccessCallback();
           }
+          // Store the revision from Kintone API for remote change detection
+          // Must be AFTER callback since clearChanges() resets serverRevision to null
+          if (revision && currentDomain) {
+            fileChangeStore.setServerRevision(currentDomain.id, selectedAppId, revision);
+          }
           return result.data;
         }
         return undefined;
@@ -361,6 +368,10 @@ const AppDetail: React.FC = () => {
 
   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 hasRemoteRevisionChange =
+    currentDomain && selectedAppId && currentApp.customization?.revision
+      ? fileChangeStore.hasRemoteChange(currentDomain.id, selectedAppId, currentApp.customization.revision)
+      : false;
 
   return (
     <div className={styles.container}>
@@ -371,9 +382,11 @@ const AppDetail: React.FC = () => {
           <Tag>ID: {currentApp.appId}</Tag>
         </div>
         <Space>
-          <Button icon={<RefreshCw size={16} />} loading={refreshing} onClick={handleRefresh}>
-            {t("refresh", { ns: "common" })}
-          </Button>
+          <Badge dot={hasRemoteRevisionChange}>
+            <Button icon={<RefreshCw size={16} />} loading={refreshing} onClick={handleRefresh}>
+              {t("refresh", { ns: "common" })}
+            </Button>
+          </Badge>
           <Button icon={<History size={16} />}>{t("versionHistory", { ns: "common" })}</Button>
           <Button icon={<Download size={16} />} loading={downloadingAll} onClick={handleDownloadAll}>
             {t("downloadAll")}