Improve JSON editor for macOS

2025-11-26 22:25:52 +08:00
parent 3f1c716a0a
commit c5fd6a6b4e
25 changed files with 979 additions and 322 deletions
@@ -0,0 +1,127 @@
+import AppKit
+import CodeEditLanguages
+import CodeEditSourceEditor
+import CodeEditTextView
+import SwiftUI
+
+private extension NSColor {
+    var forEditor: NSColor {
+        usingColorSpace(.sRGB) ?? self
+    }
+}
+
+private func makeTheme() -> EditorTheme {
+    EditorTheme(
+        text: .init(color: NSColor.labelColor.forEditor),
+        insertionPoint: NSColor.labelColor.forEditor,
+        invisibles: .init(color: NSColor.tertiaryLabelColor.forEditor),
+        background: NSColor.textBackgroundColor.forEditor,
+        lineHighlight: NSColor.quaternaryLabelColor.forEditor,
+        selection: NSColor.selectedTextBackgroundColor.forEditor,
+        keywords: .init(color: NSColor.systemPurple.forEditor),
+        commands: .init(color: NSColor.systemCyan.forEditor),
+        types: .init(color: NSColor.systemCyan.forEditor),
+        attributes: .init(color: NSColor.systemCyan.forEditor),
+        variables: .init(color: NSColor.labelColor.forEditor),
+        values: .init(color: NSColor.systemOrange.forEditor),
+        numbers: .init(color: NSColor.systemOrange.forEditor),
+        strings: .init(color: NSColor.systemGreen.forEditor),
+        characters: .init(color: NSColor.systemGreen.forEditor),
+        comments: .init(color: NSColor.secondaryLabelColor.forEditor)
+    )
+}
+
+private func makeConfiguration(isEditable: Bool) -> SourceEditorConfiguration {
+    SourceEditorConfiguration(
+        appearance: .init(
+            theme: makeTheme(),
+            font: .monospacedSystemFont(ofSize: 14, weight: .regular),
+            lineHeightMultiple: 1.3,
+            wrapLines: false
+        ),
+        behavior: .init(
+            isEditable: isEditable,
+            isSelectable: true
+        ),
+        peripherals: .init(
+            showMinimap: false,
+            showFoldingRibbon: false
+        )
+    )
+}
+
+struct CodeEditTextView: NSViewRepresentable {
+    @Binding var text: String
+    let isEditable: Bool
+
+    func makeNSView(context: Context) -> NSView {
+        let controller = TextViewController(
+            string: text,
+            language: .json,
+            configuration: makeConfiguration(isEditable: isEditable),
+            cursorPositions: []
+        )
+        controller.loadView()
+
+        let containerView = NSView()
+        containerView.translatesAutoresizingMaskIntoConstraints = false
+
+        let controllerView = controller.view
+        controllerView.translatesAutoresizingMaskIntoConstraints = false
+        containerView.addSubview(controllerView)
+
+        NSLayoutConstraint.activate([
+            controllerView.topAnchor.constraint(equalTo: containerView.topAnchor),
+            controllerView.bottomAnchor.constraint(equalTo: containerView.bottomAnchor),
+            controllerView.leadingAnchor.constraint(equalTo: containerView.leadingAnchor),
+            controllerView.trailingAnchor.constraint(equalTo: containerView.trailingAnchor),
+        ])
+
+        context.coordinator.controller = controller
+        context.coordinator.setupObservation()
+        return containerView
+    }
+
+    func updateNSView(_: NSView, context: Context) {
+        guard let controller = context.coordinator.controller else { return }
+        if controller.text != text {
+            controller.text = text
+        }
+        if controller.configuration.behavior.isEditable != isEditable {
+            controller.configuration = makeConfiguration(isEditable: isEditable)
+        }
+    }
+
+    func makeCoordinator() -> Coordinator {
+        Coordinator(text: $text)
+    }
+
+    class Coordinator: NSObject {
+        var controller: TextViewController?
+        @Binding var text: String
+        private var observation: NSObjectProtocol?
+
+        init(text: Binding<String>) {
+            _text = text
+            super.init()
+        }
+
+        func setupObservation() {
+            guard let controller else { return }
+            observation = NotificationCenter.default.addObserver(
+                forName: TextView.textDidChangeNotification,
+                object: controller.textView,
+                queue: .main
+            ) { [weak self] _ in
+                guard let self, let controller = self.controller else { return }
+                self.text = controller.text
+            }
+        }
+
+        deinit {
+            if let observation {
+                NotificationCenter.default.removeObserver(observation)
+            }
+        }
+    }
+}
@@ -0,0 +1,204 @@
+import ApplicationLibrary
+import Library
+import SwiftUI
+
+struct EditProfileContentWindow: View {
+    let context: EditProfileContentView.Context?
+
+    @StateObject private var viewModel: EditProfileContentViewModel
+    @State private var showDiscardAlert = false
+    @State private var windowState = WindowState()
+
+    private let readOnly: Bool
+
+    init(context: EditProfileContentView.Context?) {
+        self.context = context
+        readOnly = context?.readOnly == true
+        _viewModel = StateObject(wrappedValue: EditProfileContentViewModel(profileID: context?.profileID))
+    }
+
+    @Environment(\.profileEditor) private var profileEditor
+
+    var body: some View {
+        Group {
+            if viewModel.isLoading {
+                ProgressView()
+                    .frame(maxWidth: .infinity, maxHeight: .infinity)
+                    .task {
+                        await viewModel.loadContent()
+                    }
+            } else {
+                editorView
+                    .onChangeCompat(of: viewModel.profileContent) {
+                        viewModel.markAsChanged()
+                    }
+            }
+        }
+        .frame(minWidth: 600, minHeight: 400)
+        .background(WindowAccessor { window in
+            guard let window else { return }
+            if windowState.window == nil {
+                windowState.window = window
+                windowState.onClose = { [weak viewModel] in
+                    viewModel?.reset()
+                }
+                let delegate = WindowCloseDelegate(
+                    windowState: windowState,
+                    hasUnsavedChanges: { [weak viewModel] in
+                        viewModel?.isChanged == true
+                    },
+                    showAlert: {
+                        showDiscardAlert = true
+                    }
+                )
+                windowState.delegate = delegate
+                window.delegate = delegate
+            }
+        })
+        .onExitCommand {
+            handleClose()
+        }
+        .alert("Unsaved Changes", isPresented: $showDiscardAlert) {
+            Button("Don't Save", role: .destructive) {
+                windowState.forceClose()
+            }
+            Button("Cancel", role: .cancel) {}
+            if !readOnly {
+                Button("Save") {
+                    Task {
+                        await viewModel.saveContent()
+                        if viewModel.alert == nil {
+                            windowState.forceClose()
+                        }
+                    }
+                }
+            }
+        } message: {
+            Text("Do you want to save the changes you made?")
+        }
+        .alertBinding($viewModel.alert)
+        .navigationTitle(navigationTitle)
+        .toolbar {
+            ToolbarItemGroup(placement: .navigation) {
+                if !readOnly {
+                    Button {
+                        Task {
+                            await viewModel.saveContent()
+                        }
+                    } label: {
+                        Label("Save", image: "save")
+                    }
+                    .keyboardShortcut("s", modifiers: .command)
+                    .disabled(!viewModel.isChanged)
+                } else {
+                    Button {
+                        NSPasteboard.general.setString(viewModel.profileContent, forType: .string)
+                    } label: {
+                        Label("Copy", systemImage: "doc.on.clipboard")
+                    }
+                }
+            }
+        }
+    }
+
+    private var navigationTitle: String {
+        if readOnly {
+            return String(localized: "View Content")
+        } else {
+            return String(localized: "Edit Content")
+        }
+    }
+
+    @ViewBuilder
+    private var editorView: some View {
+        if let profileEditor {
+            profileEditor(
+                readOnly ? .constant(viewModel.profileContent) : $viewModel.profileContent,
+                !readOnly
+            )
+            .frame(maxWidth: .infinity, maxHeight: .infinity)
+        } else {
+            defaultEditorView
+        }
+    }
+
+    @ViewBuilder
+    private var defaultEditorView: some View {
+        Group {
+            if readOnly {
+                TextEditor(text: .constant(viewModel.profileContent))
+            } else {
+                TextEditor(text: $viewModel.profileContent)
+            }
+        }
+        .font(Font.system(.caption2, design: .monospaced))
+        .autocorrectionDisabled(true)
+        .textContentType(.init(rawValue: ""))
+        .padding()
+    }
+
+    private func handleClose() {
+        if viewModel.isChanged, !readOnly {
+            showDiscardAlert = true
+        } else {
+            windowState.forceClose()
+        }
+    }
+}
+
+private class WindowState {
+    weak var window: NSWindow?
+    var delegate: WindowCloseDelegate?
+    var onClose: (() -> Void)?
+
+    func forceClose() {
+        delegate?.allowClose = true
+        window?.close()
+    }
+}
+
+private struct WindowAccessor: NSViewRepresentable {
+    let callback: (NSWindow?) -> Void
+
+    func makeNSView(context _: Context) -> NSView {
+        let view = NSView()
+        DispatchQueue.main.async {
+            callback(view.window)
+        }
+        return view
+    }
+
+    func updateNSView(_: NSView, context _: Context) {}
+}
+
+private class WindowCloseDelegate: NSObject, NSWindowDelegate {
+    var allowClose = false
+    private let windowState: WindowState
+    private let hasUnsavedChanges: () -> Bool
+    private let showAlert: () -> Void
+
+    init(windowState: WindowState, hasUnsavedChanges: @escaping () -> Bool, showAlert: @escaping () -> Void) {
+        self.windowState = windowState
+        self.hasUnsavedChanges = hasUnsavedChanges
+        self.showAlert = showAlert
+        super.init()
+    }
+
+    func windowShouldClose(_: NSWindow) -> Bool {
+        if allowClose {
+            return true
+        }
+        if hasUnsavedChanges() {
+            DispatchQueue.main.async {
+                self.showAlert()
+            }
+            return false
+        }
+        return true
+    }
+
+    func windowWillClose(_: Notification) {
+        windowState.onClose?()
+        allowClose = false
+    }
+}
@@ -7,6 +7,10 @@ public struct MacApplication: Scene {
    @State private var isMenuPresented = false
    @StateObject private var environments = ExtensionEnvironments()

+    private let profileEditor: (Binding<String>, Bool) -> AnyView = { text, isEditable in
+        AnyView(CodeEditTextView(text: text, isEditable: isEditable))
+    }
+
    public init() {}
    public var body: some Scene {
        Window("sing-box", id: "main", content: {
@@ -52,6 +56,13 @@ public struct MacApplication: Scene {
        }
        .menuBarExtraStyle(.window)
        .menuBarExtraAccess(isPresented: $isMenuPresented)
+
+        WindowGroup(for: EditProfileContentView.Context.self) { $context in
+            EditProfileContentWindow(context: context)
+                .environment(\.profileEditor, profileEditor)
+        }
+        .windowResizability(.contentMinSize)
+        .defaultSize(width: 700, height: 500)
    }

    private func initialize() async {
@@ -10,6 +10,10 @@ public struct MainView: View {
    @State private var showCardManagement = false
    @State private var cardConfigurationVersion = 0

+    private let profileEditor: (Binding<String>, Bool) -> AnyView = { text, isEditable in
+        AnyView(CodeEditTextView(text: text, isEditable: isEditable))
+    }
+
    public init() {}

    public var body: some View {
@@ -59,6 +63,7 @@ public struct MainView: View {
        .environment(\.selection, $viewModel.selection)
        .environment(\.importProfile, $viewModel.importProfile)
        .environment(\.importRemoteProfile, $viewModel.importRemoteProfile)
+        .environment(\.profileEditor, profileEditor)
        .handlesExternalEvents(preferring: [], allowing: ["*"])
        .onOpenURL(perform: viewModel.openURL)
        .sheet(isPresented: $showCardManagement) {