feat: fix preview offset mismatch in pen drag and drop

Memola.xcodeproj/project.pbxproj

@@ -82,7 +82,6 @@
 		ECFA15262BEF224900455818 /* StrokeObject.swift in Sources */ = {isa = PBXBuildFile; fileRef = ECFA15252BEF224900455818 /* StrokeObject.swift */; };
 		ECFA15282BEF225000455818 /* QuadObject.swift in Sources */ = {isa = PBXBuildFile; fileRef = ECFA15272BEF225000455818 /* QuadObject.swift */; };
 		ECFC51272BF8885700D0D051 /* ColorPicker.swift in Sources */ = {isa = PBXBuildFile; fileRef = ECFC51262BF8885700D0D051 /* ColorPicker.swift */; };
-		ECFC512A2BF8BBD800D0D051 /* Triangle.swift in Sources */ = {isa = PBXBuildFile; fileRef = ECFC51292BF8BBD800D0D051 /* Triangle.swift */; };
 /* End PBXBuildFile section */
 
 /* Begin PBXFileReference section */
@@ -163,7 +162,6 @@
 		ECFA15252BEF224900455818 /* StrokeObject.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = StrokeObject.swift; sourceTree = "<group>"; };
 		ECFA15272BEF225000455818 /* QuadObject.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = QuadObject.swift; sourceTree = "<group>"; };
 		ECFC51262BF8885700D0D051 /* ColorPicker.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ColorPicker.swift; sourceTree = "<group>"; };
-		ECFC51292BF8BBD800D0D051 /* Triangle.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Triangle.swift; sourceTree = "<group>"; };
 /* End PBXFileReference section */
 
 /* Begin PBXFrameworksBuildPhase section */
@@ -229,7 +227,6 @@
 		EC50500A2BF6672000B4D86E /* Components */ = {
 			isa = PBXGroup;
 			children = (
-				ECFC51282BF8BBD000D0D051 /* Shapes */,
 				EC50500B2BF6673300B4D86E /* ViewModifiers */,
 			);
 			path = Components;
@@ -613,14 +610,6 @@
 			path = ColorPicker;
 			sourceTree = "<group>";
 		};
-		ECFC51282BF8BBD000D0D051 /* Shapes */ = {
-			isa = PBXGroup;
-			children = (
-				ECFC51292BF8BBD800D0D051 /* Triangle.swift */,
-			);
-			path = Shapes;
-			sourceTree = "<group>";
-		};
 /* End PBXGroup section */
 
 /* Begin PBXNativeTarget section */
@@ -694,7 +683,6 @@
 				ECA738B02BE60D0B00A4542E /* CanvasViewController.swift in Sources */,
 				ECA738E42BE6110800A4542E /* Drawable.swift in Sources */,
 				ECA738AD2BE60CC600A4542E /* DrawingView.swift in Sources */,
-				ECFC512A2BF8BBD800D0D051 /* Triangle.swift in Sources */,
 				ECA738E02BE610B900A4542E /* EraserRenderPass.swift in Sources */,
 				EC35655A2BF060D900A4E0BF /* Quad.metal in Sources */,
 				ECA738912BE600F500A4542E /* Cache.metal in Sources */,

Memola/Canvas/Tool/Core/Tool.swift

@@ -16,7 +16,6 @@ public class Tool: NSObject, ObservableObject {
     @Published var pens: [Pen] = []
     @Published var selectedPen: Pen?
     @Published var draggedPen: Pen?
-    @Published var opensColorPicker: Bool = false
 
     let scrollPublisher = PassthroughSubject<String, Never>()
 

Memola/Components/Shapes/Triangle.swift

@@ -1,20 +0,0 @@
-//
-//  Triangle.swift
-//  Memola
-//
-//  Created by Dscyre Scotti on 5/18/24.
-//
-
-import SwiftUI
-import Foundation
-
-struct Triangle: Shape {
-    func path(in rect: CGRect) -> Path {
-        var path = Path()
-        path.move(to: CGPoint(x: rect.maxX, y: rect.minY))
-        path.addLine(to: CGPoint(x: rect.minX, y: rect.maxY))
-        path.addLine(to: CGPoint(x: rect.maxX, y: rect.maxY))
-        path.addLine(to: CGPoint(x: rect.maxX, y: rect.minY))
-        return path
-    }
-}

Memola/Features/Memo/PenDock/PenDockView.swift

@@ -14,6 +14,9 @@ struct PenDockView: View {
     let height: CGFloat = 30
     let factor: CGFloat = 0.95
 
+    @State var refreshScrollId: UUID = UUID()
+    @State var opensColorPicker: Bool = false
+
     var body: some View {
         VStack(alignment: .trailing) {
             if let pen = tool.selectedPen {
@@ -52,6 +55,7 @@ struct PenDockView: View {
                 }
                 .padding(.vertical, 10)
                 .padding(.leading, 40)
+                .id(refreshScrollId)
             }
             .onReceive(tool.scrollPublisher) { id in
                 DispatchQueue.main.asyncAfter(deadline: .now() + 0.5) {
@@ -77,7 +81,7 @@ struct PenDockView: View {
 
     func penView(_ pen: Pen) -> some View {
         ZStack {
-            penShadow(pen)
+            penShadowView(pen)
             if let tip = pen.style.icon.tip {
                 Image(tip)
                     .resizable()
@@ -129,16 +133,16 @@ struct PenDockView: View {
             tool.draggedPen = pen
             return NSItemProvider(contentsOf: URL(string: pen.id)) ?? NSItemProvider()
         } preview: {
-            penPreview(pen)
+            penPreviewView(pen)
                 .contentShape(.dragPreview, .rect(cornerRadius: 10))
         }
-        .onDrop(of: [.item], delegate: PenDropDelegate(id: pen.id, tool: tool))
+        .onDrop(of: [.item], delegate: PenDropDelegate(id: pen.id, tool: tool, action: { refreshScrollId = UUID() }))
         .offset(x: tool.selectedPen === pen ? 0 : 25)
     }
 
     func penColorView(_ pen: Pen) -> some View {
         Button {
-            tool.opensColorPicker = true
+            opensColorPicker = true
         } label: {
             let hsba = pen.color.hsba
             let baseColor = Color(hue: hsba.hue, saturation: hsba.saturation, brightness: hsba.brightness)
@@ -167,7 +171,7 @@ struct PenDockView: View {
             .drawingGroup()
         }
         .hoverEffect(.lift)
-        .popover(isPresented: $tool.opensColorPicker) {
+        .popover(isPresented: $opensColorPicker) {
             ColorPicker(pen: pen)
                 .presentationCompactAdaptation(.popover)
         }
@@ -227,7 +231,7 @@ struct PenDockView: View {
         .hoverEffect(.lift)
     }
 
-    func penPreview(_ pen: Pen) -> some View {
+    func penPreviewView(_ pen: Pen) -> some View {
         ZStack {
             if let tip = pen.style.icon.tip {
                 Image(tip)
@@ -243,7 +247,7 @@ struct PenDockView: View {
         .padding(.leading, 10)
     }
 
-    func penShadow(_ pen: Pen) -> some View {
+    func penShadowView(_ pen: Pen) -> some View {
         ZStack {
             Group {
                 if let tip = pen.style.icon.tip {

Memola/Features/Memo/PenDock/PenDropDelegate.swift

@@ -11,9 +11,11 @@ import Foundation
 struct PenDropDelegate: DropDelegate {
     let id: String
     @ObservedObject var tool: Tool
+    let action: () -> Void
 
     func performDrop(info: DropInfo) -> Bool {
         tool.draggedPen = nil
+        action()
         return true
     }