fix(agent-tars): implement app drag functionality (close: #314) (#391)

Author: lynxlangya

apps/agent-tars/src/renderer/src/components/CanvasPanel/EventPlayer/index.module.scss

@@ -0,0 +1,7 @@
+.header {
+  -webkit-app-region: drag;
+}
+
+.closeButton {
+  -webkit-app-region: no-drag;
+}

apps/agent-tars/src/renderer/src/components/CanvasPanel/EventPlayer/index.tsx

@@ -22,6 +22,7 @@ import {
   EventType,
 } from '@renderer/type/event';
 import { renderPlatformPanel } from './renderPlatformPanel';
+import styles from './index.module.scss';
 
 const StatusIcon = ({ status }: { status: ActionStatus }) => {
   switch (status) {
@@ -161,13 +162,15 @@ export function EventPlayer() {
       }}
     >
       {/* Header */}
-      <div className="flex-shrink-0 flex items-center justify-between px-4 py-3 border-b border-gray-100 dark:border-gray-800">
+      <div
+        className={`${styles.header} flex-shrink-0 flex items-center justify-between px-4 py-3 border-b border-gray-100 dark:border-gray-800`}
+      >
         <h2 className="text-lg font-semibold text-gray-900 dark:text-gray-100">
           My Computer
         </h2>
         <button
           onClick={() => setShowCanvas(false)}
-          className="p-2 text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200 transition-colors"
+          className={`${styles.closeButton} p-2 text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200 transition-colors`}
         >
           <FiX className="w-5 h-5" />
         </button>

apps/agent-tars/src/renderer/src/components/LeftSidebar/index.module.scss

@@ -21,18 +21,20 @@
 
   &.collapsed {
     width: 56px;
+    -webkit-app-region: drag;
   }
 }
 
 .topbar {
   flex-shrink: 0;
-  padding: 8px 12px 0;
-  margin-top: 10px;
+  padding: 30px 8px 12px 0;
+  margin-top: -15px;
   margin-bottom: 10px;
   display: flex;
   justify-content: space-between;
   align-items: center;
   gap: 8px;
+  -webkit-app-region: drag;
 
   &.collapsed {
     margin-top: 0;
@@ -69,6 +71,7 @@
   transition: transform var(--transition-normal);
   color: var(--ai-color-text-tertiary);
   z-index: 10;
+  -webkit-app-region: no-drag;
 
   &:hover {
     background: var(--ai-color-bg-hover);