From f1cdd340a7cb00ea7f573f84bbde6e62fe29aa6e Mon Sep 17 00:00:00 2001
From: hamid zarghami <hamid.zarghami1@gmail.com>
Date: Mon, 11 May 2026 10:11:01 +0330
Subject: [PATCH] add setting diable/enable smart guide

---
 src/pages/editor/components/EditorCanvas.tsx  | 13 +++++++++++++
 src/pages/editor/components/SettingsPanel.tsx | 14 ++++++++++++++
 src/pages/editor/store/editorStore.ts         |  1 +
 src/pages/editor/store/editorStore.types.ts   |  1 +
 4 files changed, 29 insertions(+)

diff --git a/src/pages/editor/components/EditorCanvas.tsx b/src/pages/editor/components/EditorCanvas.tsx
index 3e8b522..89d9f0a 100644
--- a/src/pages/editor/components/EditorCanvas.tsx
+++ b/src/pages/editor/components/EditorCanvas.tsx
@@ -39,6 +39,7 @@ const EditorCanvas = ({ catalogSize }: EditorCanvasProps) => {
     tool,
     objects,
     guides,
+    documentSettings,
     pages,
     currentPageId,
     selectedObjectId,
@@ -50,6 +51,7 @@ const EditorCanvas = ({ catalogSize }: EditorCanvasProps) => {
     setGuides,
     zoom,
   } = useEditorStore();
+  const isSmartGuideEnabled = documentSettings.smartGuide;
   const currentPage = pages.find((page) => page.id === currentPageId);
 
   const bgColor =
@@ -307,6 +309,11 @@ const EditorCanvas = ({ catalogSize }: EditorCanvasProps) => {
   const handleDragMove = (e: Konva.KonvaEventObject<DragEvent>) => {
     const node = e.target;
     if (!node || node.name() === "guide-line") return;
+    if (!isSmartGuideEnabled) {
+      updateActiveGuides([]);
+      clearSmartGuides(smartGuidesLayerRef.current);
+      return;
+    }
 
     const snapped = getSnappedPosition(node, guides, finalScale);
 
@@ -338,6 +345,12 @@ const EditorCanvas = ({ catalogSize }: EditorCanvasProps) => {
     clearSmartGuides(smartGuidesLayerRef.current);
   };
 
+  useEffect(() => {
+    if (isSmartGuideEnabled) return;
+    updateActiveGuides([]);
+    clearSmartGuides(smartGuidesLayerRef.current);
+  }, [isSmartGuideEnabled]);
+
   const handleStageMouseDownWithGuideReset = (e: Konva.KonvaEventObject<MouseEvent>) => {
     if (e.target?.name() !== "guide-line") {
       setSelectedGuideId(null);
diff --git a/src/pages/editor/components/SettingsPanel.tsx b/src/pages/editor/components/SettingsPanel.tsx
index 7e9c3db..e5cf2ce 100644
--- a/src/pages/editor/components/SettingsPanel.tsx
+++ b/src/pages/editor/components/SettingsPanel.tsx
@@ -55,6 +55,7 @@ const SettingsPanel = () => {
     displayStyle,
     autoPlay,
     pageFlipSound,
+    smartGuide,
     // leftToRightFlip,
   } = documentSettings
 
@@ -142,6 +143,19 @@ const SettingsPanel = () => {
         </div>
       </section>
 
+      <section className="p-4 border-b border-border">
+        <div className="flex items-center gap-2 mb-4">
+          <h3 className="text-sm font-semibold text-gray-800">تنظیمات ویرایشگر</h3>
+        </div>
+        <div className="flex flex-col gap-3">
+          <CheckboxRow
+            label="راهنمای هوشمند"
+            checked={smartGuide}
+            onChange={(v) => updateDocumentSettings({ smartGuide: v })}
+          />
+        </div>
+      </section>
+
       {/* ─── پس زمینه ─── */}
       <section className="p-4">
         <h3 className="text-sm font-semibold text-gray-800 mb-4">پس زمینه</h3>
diff --git a/src/pages/editor/store/editorStore.ts b/src/pages/editor/store/editorStore.ts
index dd2c824..d33090a 100644
--- a/src/pages/editor/store/editorStore.ts
+++ b/src/pages/editor/store/editorStore.ts
@@ -189,6 +189,7 @@ export const useEditorStore = create<EditorStoreType>((set, get) => {
       autoPlay: false,
       pageFlipSound: true,
       leftToRightFlip: false,
+      smartGuide: true,
       backgroundType: 'color',
       backgroundColor: '#ffffff',
       backgroundGradient: {
diff --git a/src/pages/editor/store/editorStore.types.ts b/src/pages/editor/store/editorStore.types.ts
index ce306fe..7646eab 100644
--- a/src/pages/editor/store/editorStore.types.ts
+++ b/src/pages/editor/store/editorStore.types.ts
@@ -97,6 +97,7 @@ export type DocumentSettings = {
   autoPlay: boolean;
   pageFlipSound: boolean;
   leftToRightFlip: boolean;
+  smartGuide: boolean;
   backgroundType: BackgroundType;
   backgroundColor: string;
   backgroundGradient?: LinearGradient;