fix divider css

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

@@ -19,13 +19,9 @@ interface FileItemProps {
   onView?: () => void;
   onDownload?: () => void;
   isDownloading?: boolean;
-  showDivider?: boolean;
 }
 
 const useStyles = createStyles(({ token, css }) => ({
-  wrapper: css`
-    width: 100%;
-  `,
   item: css`
     display: flex;
     align-items: center;
@@ -34,16 +30,12 @@ const useStyles = createStyles(({ token, css }) => ({
     width: 100%;
     cursor: pointer;
     transition: background-color 0.15s ease;
+    position: relative;
 
     &:hover {
       background-color: ${token.colorBgTextHover};
     }
   `,
-  divider: css`
-    height: 1px;
-    background-color: ${token.colorBorder};
-    margin: 0 ${token.paddingMD}px;
-  `,
   fileInfo: css`
     display: flex;
     align-items: center;
@@ -75,7 +67,7 @@ const formatFileSize = (size: number | undefined): string => {
   return `${(size / (1024 * 1024)).toFixed(1)} MB`;
 };
 
-const FileItem: React.FC<FileItemProps> = ({ entry, onDelete, onRestore, onView, onDownload, isDownloading, showDivider = true }) => {
+const FileItem: React.FC<FileItemProps> = ({ entry, onDelete, onRestore, onView, onDownload, isDownloading }) => {
   const { t } = useTranslation(["app", "common"]);
   const { styles, cx } = useStyles();
   const token = useTheme();
@@ -103,8 +95,7 @@ const FileItem: React.FC<FileItemProps> = ({ entry, onDelete, onRestore, onView,
   };
 
   return (
-    <div className={styles.wrapper}>
+    <div className={styles.item} onClick={handleItemClick} data-file-item="true">
-      <div className={styles.item} onClick={handleItemClick}>
       <div className={styles.fileInfo}>
         <div onClick={handleDragHandleClick}>
           <SortableList.DragHandle />
@@ -116,9 +107,7 @@ const FileItem: React.FC<FileItemProps> = ({ entry, onDelete, onRestore, onView,
         >
           {entry.fileName}
         </span>
-          {entry.status === "added" && (
+        {entry.status === "added" && <Badge color={token.colorSuccess} text={t("statusAdded")} style={{ fontSize: token.fontSizeSM, whiteSpace: "nowrap" }} />}
-            <Badge color={token.colorSuccess} text={t("statusAdded")} style={{ fontSize: token.fontSizeSM, whiteSpace: "nowrap" }} />
-          )}
         {entry.status === "deleted" && (
           <Badge color={token.colorError} text={t("statusDeleted")} style={{ fontSize: token.fontSizeSM, whiteSpace: "nowrap" }} />
         )}
@@ -148,8 +137,6 @@ const FileItem: React.FC<FileItemProps> = ({ entry, onDelete, onRestore, onView,
         )}
       </Space>
     </div>
-      {showDivider && <div className={styles.divider} />}
-    </div>
   );
 };
 

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

@@ -287,10 +287,9 @@ const FileSection: React.FC<FileSectionProps> = ({
 
   // ── Render item ────────────────────────────────────────────────────────────
   const renderItem = useCallback(
-    (entry: FileEntry, index: number, totalCount: number) => {
+    (entry: FileEntry) => {
       // Determine if file is viewable (has fileKey for Kintone files OR storagePath for local files)
       const isViewable = entry.fileKey || entry.storagePath;
-      const isLast = index === totalCount - 1;
 
       return (
         <FileItem
@@ -300,7 +299,6 @@ const FileSection: React.FC<FileSectionProps> = ({
           onView={isViewable ? () => onView(entry.fileKey, entry.fileName, entry.storagePath) : undefined}
           onDownload={entry.fileKey ? () => onDownload(entry.fileKey!, entry.fileName) : undefined}
           isDownloading={downloadingKey === entry.fileKey}
-          showDivider={!isLast}
         />
       );
     },
@@ -367,7 +365,7 @@ const FileSection: React.FC<FileSectionProps> = ({
         {files.length === 0 ? (
           <div className={styles.emptySection}>{t("noConfig")}</div>
         ) : (
-          <SortableFileList items={files} onReorder={handleReorder} renderItem={renderItem} />
+          <SortableFileList items={files} onReorder={handleReorder} renderItem={renderItem} dividerColor={token.colorBorder} />
         )}
 
         {/* Click-to-add strip */}

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

@@ -10,16 +10,39 @@ import { SortableList } from "@lobehub/ui";
 import { DndContext, KeyboardSensor, PointerSensor, useSensor, useSensors, DragEndEvent } from "@dnd-kit/core";
 import { SortableContext, verticalListSortingStrategy, arrayMove, sortableKeyboardCoordinates } from "@dnd-kit/sortable";
 import { restrictToVerticalAxis, restrictToWindowEdges } from "@dnd-kit/modifiers";
+import { createStyles } from "antd-style";
 import type { FileEntry } from "@renderer/stores";
 
+const useStyles = createStyles(({ css }) => ({
+  fileList: css`
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+
+    /* 分割线：非最后一个子元素的 .fileItem 显示 */
+    & > *:not(:last-child) [data-file-item="true"]::after {
+      content: "";
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      right: 0;
+      height: 1px;
+      background-color: var(--divider-color, #d9d9d9);
+    }
+  `,
+}));
+
 // ── SortableFileList Component ────────────────────────────────────────────────
 interface SortableFileListProps {
   items: FileEntry[];
   onReorder: (newOrder: string[], draggedItemId: string) => void;
-  renderItem: (entry: FileEntry, index: number, totalCount: number) => React.ReactNode;
+  renderItem: (entry: FileEntry) => React.ReactNode;
+  dividerColor?: string;
 }
 
-const SortableFileList: React.FC<SortableFileListProps> = ({ items, onReorder, renderItem }) => {
+const SortableFileList: React.FC<SortableFileListProps> = ({ items, onReorder, renderItem, dividerColor }) => {
+  const { styles } = useStyles();
+
   const sensors = useSensors(
     useSensor(PointerSensor),
     useSensor(KeyboardSensor, {
@@ -45,11 +68,13 @@ const SortableFileList: React.FC<SortableFileListProps> = ({ items, onReorder, r
   return (
     <DndContext sensors={sensors} collisionDetection={undefined} onDragEnd={handleDragEnd} modifiers={[restrictToVerticalAxis, restrictToWindowEdges]}>
       <SortableContext items={items} strategy={verticalListSortingStrategy}>
-        {items.map((entry, index) => (
+        <div className={styles.fileList} style={dividerColor ? ({ "--divider-color": dividerColor } as React.CSSProperties) : undefined}>
+          {items.map((entry) => (
             <SortableList.Item key={entry.id} id={entry.id}>
-            {renderItem(entry, index, items.length)}
+              {renderItem(entry)}
             </SortableList.Item>
           ))}
+        </div>
       </SortableContext>
     </DndContext>
   );