Content Moderation in iOS

import IMGLYEditor
import IMGLYEngine
import SwiftUI

// MARK: - Starter Kit View

struct ContentModerationEditorStarterKit: View {
  // Provide `EngineSettings` with your license and an optional userId.
  let settings = EngineSettings(
    license: secrets.licenseKey, // Use nil for evaluation mode with watermark
    userID: "<your unique user id>",
  )

  // Moderation state for this editor, pointed at the IMG.LY AI Gateway with the key
  // from `Secrets.swift`. Swap in your own `ModerationService` here to use a
  // different provider. Held as `@StateObject` so it survives re-renders — the
  // editor's verdict must not be discarded every time this view's body runs.
  @StateObject private var moderation = ModerationStore(
    service: GatewayModerationService(apiKey: secrets.gatewayApiKey, thresholds: .moderate),
  )

  var body: some View {
    Editor(settings)
      .imgly.configuration {
        ContentModerationEditorConfiguration(moderation: moderation)
      }
  }
}

// MARK: - Preview

#Preview {
  ContentModerationEditorStarterKit()
}

import Foundation
import IMGLYEditor
import IMGLYEngine

// MARK: - Default OnCreate

public extension ContentModerationEditorConfiguration {
  /// The default `onCreate` handler.
  ///
  /// Runs the create phases. Moderation state is reset from `onLoaded`, which runs
  /// after the engine exists and which a host can chain to rather than replace.
  internal static var defaultOnCreateHandler: OnCreate.Handler {
    { engine, _ in
      try await defaultOnCreate()(engine)
    }
  }

  /// Default content moderation editor specific `OnCreate.Callback` implementation with solution specific settings,
  /// scene and editor creation setup.
  /// - Parameters:
  ///   - preCreateScene: Callback to do any pre scene loading tasks such as applying settings.
  ///   Defaults to `ContentModerationEditorConfiguration.defaultPreCreateScene`.
  ///   - createScene: Callback to load/create the scene and load asset sources. Defaults to
  /// `ContentModerationEditorConfiguration.defaultCreateScene`.
  ///   - loadAssetSources: Callback to load any asset sources. Defaults to
  /// `ContentModerationEditorConfiguration.defaultLoadAssetSources`.
  ///   - postCreateScene: Callback to do any post scene loading tasks. Defaults to
  ///   `ContentModerationEditorConfiguration.defaultPostCreateScene`.
  /// - Returns: A composed `OnCreate.Callback`that sequentially executes all three initialization phases.
  static func defaultOnCreate(
    preCreateScene: @escaping OnCreate.Callback = defaultPreCreateScene,
    createScene: @escaping OnCreate.Callback = defaultCreateScene,
    loadAssetSources: @escaping OnCreate.Callback = defaultLoadAssetSources,
    postCreateScene: @escaping OnCreate.Callback = defaultPostCreateScene,
  ) -> OnCreate.Callback {
    { engine in
      try await preCreateScene(engine)
      try await createScene(engine)
      try await loadAssetSources(engine)
      try await postCreateScene(engine)
    }
  }

  /// Configures engine settings before scene loading.
  ///
  /// Sets editor role, touch gestures, camera clamping, and global scopes.
  static let defaultPreCreateScene: OnCreate.Callback = { engine in
    try engine.editor.setRole("Adopter")
    try engine.editor.setSettingEnum("camera/clamping/overshootMode", value: "Center")

    let highlightColor: IMGLYEngine.Color = try engine.editor.getSettingColor("highlightColor")
    try engine.editor.setSettingColor("placeholderHighlightColor", color: highlightColor)

    try engine.editor.setSettingBool("touch/dragStartCanSelect", value: false)
    try engine.editor.setSettingEnum("touch/pinchAction", value: "Zoom")
    try engine.editor.setSettingEnum("touch/rotateAction", value: "None")

    try ([
      "appearance/adjustments", "appearance/filter", "appearance/effect",
      "appearance/blur", "appearance/shadow",
      "editor/select",
      "fill/change", "fill/changeType",
      "layer/crop", "layer/move", "layer/resize", "layer/rotate", "layer/flip",
      "layer/opacity", "layer/blendMode", "layer/visibility", "layer/clipping",
      "lifecycle/destroy", "lifecycle/duplicate",
      "stroke/change", "shape/change",
      "text/edit", "text/character",
    ]).forEach { scope in
      try engine.editor.setGlobalScope(key: scope, value: .defer)
    }
  }

  /// Loads the bundled example scene.
  ///
  /// The example scene uses remotely hosted images so the moderation service
  /// can fetch and check them, and carries two captions written to trip the text
  /// categories. Both halves of a run therefore return findings immediately,
  /// without the user having to add anything.
  static let defaultCreateScene: OnCreate.Callback = { engine in
    #if SWIFT_PACKAGE
      let bundle = Bundle.module
    #else
      let bundle = Bundle(for: ContentModerationEditorConfiguration.self)
    #endif
    let sceneURL = bundle.url(forResource: "content-moderation-example", withExtension: "scene")!
    try await engine.scene.load(from: sceneURL)
  }

  /// Registers all default and demo asset sources, plus text and upload sources.
  static let defaultLoadAssetSources: OnCreate.Callback = { engine in
    let basePath = try engine.editor.getSettingString("basePath")
    guard let baseURL = URL(string: basePath) else { return }
    let sourceIDs = [
      "ly.img.sticker", "ly.img.vector.shape", "ly.img.filter", "ly.img.color.palette",
      "ly.img.effect", "ly.img.blur", "ly.img.typeface", "ly.img.crop.presets",
      "ly.img.page.presets", "ly.img.text", "ly.img.text.styles", "ly.img.text.curves", "ly.img.text.components",
      "ly.img.image",
    ]
    try await withThrowingTaskGroup(of: String.self) { group in
      for id in sourceIDs {
        group.addTask {
          try await engine.asset.addLocalAssetSourceFromJSON(
            baseURL.appendingPathComponent(id).appendingPathComponent("content.json"),
          )
        }
      }
      for try await _ in group {}
    }

    try engine.asset.addLocalSource(
      sourceID: "ly.img.image.upload",
      supportedMimeTypes: ["image/jpeg", "image/png", "image/svg+xml", "image/gif", "image/apng", "image/bmp"],
    )

    // Required even though the dock's photo roll button is omitted: the asset
    // library still shows a Photo Roll section, and `InspectorBar.Buttons.replace()`
    // offers it, so the source has to exist. Images added this way have local URIs
    // and are uploaded to the gateway before being checked, like any other image.
    try engine.asset.addSource(PhotoRollAssetSource(engine: engine))
  }

  /// Configures stack layout, clears selection, and enables page carousel.
  static let defaultPostCreateScene: OnCreate.Callback = { engine in
    if let stack = try engine.block.find(byType: .stack).first {
      try engine.block.setEnum(stack, property: "stack/axis", value: "Horizontal")
    }

    try engine.block.findAllSelected().forEach {
      try engine.block.setSelected($0, selected: false)
    }

    try engine.editor.setSettingBool("features/pageCarouselEnabled", value: true)
  }
}

import IMGLYEditor
import IMGLYEngine
import SwiftUI
import UniformTypeIdentifiers

// MARK: - Default OnExport

extension ContentModerationEditorConfiguration {
  /// The default export handler.
  ///
  /// Gates the export on content moderation:
  /// 1. Never validated, or the design changed since the last validation →
  ///    show the validation alert instead of exporting.
  /// 2. Validated, but violations were found — or some blocks could not be checked
  ///    at all → open the results panel so the user can locate and resolve them.
  /// 3. Validated and clean → export as PDF and open the system share sheet.
  ///
  /// Remove the gate if your workflow moderates content at a different
  /// integration point (e.g. on upload or in a review queue).
  static func onExportHandler(_ moderation: ModerationStore) -> OnExport.Handler {
    { engine, eventHandler, existing in
      // `refreshNeedsValidation` recomputes rather than reading the cached flag: a
      // missed history update may leave the icon stale, but it must never open this
      // gate on a design the store has not just compared.
      if moderation.refreshNeedsValidation(engine: engine) {
        let reason: ModerationExportAlert.Reason = moderation.hasValidated ? .contentChanged : .neverValidated
        eventHandler.send(.openSheet(style: .default(), content: {
          ModerationExportAlert(
            store: moderation,
            reason: reason,
            engine: engine,
            eventHandler: eventHandler,
            // `existing` is non-escaping, so the override path exports directly
            // instead of chaining. With no other export handler registered in
            // this kit the two are equivalent.
            onExportAnyway: {
              Task {
                do {
                  try await exportScene(engine: engine, eventHandler: eventHandler)
                } catch {
                  eventHandler.send(.showErrorAlert(error))
                }
              }
            },
          )
        }))
        return
      }

      if let outcome = moderation.outcome, !outcome.isCertifiablyClean {
        eventHandler.send(.openSheet(style: .default(), content: {
          ModerationResultsPanel(
            store: moderation,
            engine: engine,
            eventHandler: eventHandler,
            isExportBlocked: true,
          )
        }))
        return
      }

      try await existing()
      try await exportScene(engine: engine, eventHandler: eventHandler)
    }
  }

  /// Exports the scene as PDF and opens the system share sheet.
  @MainActor
  private static func exportScene(engine: Engine, eventHandler: any EditorEventHandler) async throws {
    guard let scene = try engine.scene.get() else {
      throw EditorError("No scene was found.")
    }
    let data = try await engine.block.export(scene, mimeType: .pdf) { engine in
      try engine.scene.getPages().forEach {
        try engine.block.setScopeEnabled($0, key: "layer/visibility", enabled: true)
        try engine.block.setVisible($0, visible: true)
      }
    }
    let url = FileManager.default.temporaryDirectory.appendingPathComponent("Export", conformingTo: .pdf)
    try data.write(to: url, options: [.atomic])
    eventHandler.send(.shareFile(url))
  }
}

import IMGLYEditor
import SwiftUI

// MARK: - Navigation Bar

extension ContentModerationEditorConfiguration {
  /// The default navigation bar configuration.
  ///
  /// Adds a "Validate Content" button that opens the moderation results panel
  /// next to the standard design editor navigation bar items. Its icon reflects
  /// the live validation status via ``ModerationStatusLabel``.
  static func navigationBar(_ moderation: ModerationStore) -> NavigationBar.Configuration {
    NavigationBar.Configuration { builder in
      builder.items { _ in
        NavigationBar.ItemGroup(placement: .topBarLeading) {
          NavigationBar.Buttons.closeEditor()
        }
        NavigationBar.ItemGroup(placement: .topBarTrailing) {
          NavigationBar.Buttons.undo()
          NavigationBar.Buttons.redo()
          NavigationBar.Button(id: "my.app.navigationBar.button.validateContent") { context in
            guard let engine = context.engine else { return }
            context.eventHandler.send(.openSheet(style: .default(), content: {
              ModerationResultsPanel(
                store: moderation,
                engine: engine,
                eventHandler: context.eventHandler,
              )
            }))
          } label: { _ in
            ModerationStatusLabel(store: moderation)
          } isEnabled: { context in
            context.engine != nil
          }
          NavigationBar.Buttons.export()
        }
      }
    }
  }
}

import Foundation

/// Example: Adjust moderation thresholds based on your platform's needs.
///
/// Pass one of these to `ModerationStore(service:)` in place of the
/// service `ContentModerationEditorStarterKit` installs by default, or define your
/// own `ModerationThresholds`.
enum ExampleCustomThresholds {
  /// Family-friendly platforms flag content earlier.
  static func strictService(apiKey: String) -> ModerationService {
    GatewayModerationService(apiKey: apiKey, thresholds: .strict)
  }

  /// Adult-only platforms flag content later.
  static func relaxedService(apiKey: String) -> ModerationService {
    GatewayModerationService(apiKey: apiKey, thresholds: .relaxed)
  }

  /// Custom thresholds for platform-specific rules.
  static func customService(apiKey: String) -> ModerationService {
    GatewayModerationService(
      apiKey: apiKey,
      thresholds: ModerationThresholds(failed: 0.7, warning: 0.3),
    )
  }
}

StarterKit/
├── ContentModerationEditorStarterKit.swift   # SwiftUI view that launches the editor
├── ContentModerationEditorConfiguration.swift # Editor configuration (callbacks + UI components)
├── callbacks/
│   ├── OnCreate+ContentModeration.swift      # Editor initialization logic
│   └── OnExport+ContentModeration.swift      # Export flow, gated on the moderation result
├── components/
│   ├── CanvasMenu+ContentModeration.swift    # Canvas menu configuration
│   ├── Dock+ContentModeration.swift          # Dock configuration
│   ├── InspectorBar+ContentModeration.swift  # Inspector bar configuration
│   └── NavigationBar+ContentModeration.swift # Navigation bar, incl. the validate button
├── moderation/
│   ├── ModerationTypes.swift                 # Result types and threshold mapping
│   ├── ModerationService.swift               # Service protocol + default implementation
│   ├── ModerationScanner.swift               # Scene scan and block selection
│   ├── ModerationStore.swift                 # Shared validation state
│   └── ui/                                   # Results panel, result row, status icon, export alert
├── examples/
│   └── ExampleCustomThresholds.swift         # Stricter and more relaxed presets
└── content-moderation-example.scene          # Bundled demo scene

NavigationBar.Button(id: "my.app.navigationBar.button.validateContent") { context in
  guard let engine = context.engine else { return }
  context.eventHandler.send(.openSheet(style: .default(), content: {
    ModerationResultsPanel(
      store: moderation,
      engine: engine,
      eventHandler: context.eventHandler,
    )
  }))
} label: { _ in
  ModerationStatusLabel(store: moderation)
} isEnabled: { context in
  context.engine != nil
}

// `refreshNeedsValidation` recomputes rather than reading the cached flag: a
// missed history update may leave the icon stale, but it must never open this
// gate on a design the store has not just compared.
if moderation.refreshNeedsValidation(engine: engine) {
  let reason: ModerationExportAlert.Reason = moderation.hasValidated ? .contentChanged : .neverValidated
  eventHandler.send(.openSheet(style: .default(), content: {
    ModerationExportAlert(
      store: moderation,
      reason: reason,
      engine: engine,
      eventHandler: eventHandler,
      // `existing` is non-escaping, so the override path exports directly
      // instead of chaining. With no other export handler registered in
      // this kit the two are equivalent.
      onExportAnyway: {
        Task {
          do {
            try await exportScene(engine: engine, eventHandler: eventHandler)
          } catch {
            eventHandler.send(.showErrorAlert(error))
          }
        }
      },
    )
  }))
  return
}

if let outcome = moderation.outcome, !outcome.isCertifiablyClean {
  eventHandler.send(.openSheet(style: .default(), content: {
    ModerationResultsPanel(
      store: moderation,
      engine: engine,
      eventHandler: eventHandler,
      isExportBlocked: true,
    )
  }))
  return
}

/// Example: Adjust moderation thresholds based on your platform's needs.
///
/// Pass one of these to `ModerationStore(service:)` in place of the
/// service `ContentModerationEditorStarterKit` installs by default, or define your
/// own `ModerationThresholds`.
enum ExampleCustomThresholds {
  /// Family-friendly platforms flag content earlier.
  static func strictService(apiKey: String) -> ModerationService {
    GatewayModerationService(apiKey: apiKey, thresholds: .strict)
  }

  /// Adult-only platforms flag content later.
  static func relaxedService(apiKey: String) -> ModerationService {
    GatewayModerationService(apiKey: apiKey, thresholds: .relaxed)
  }

  /// Custom thresholds for platform-specific rules.
  static func customService(apiKey: String) -> ModerationService {
    GatewayModerationService(
      apiKey: apiKey,
      thresholds: ModerationThresholds(failed: 0.7, warning: 0.3),
    )
  }
}

let secrets = Secrets(
  // ...
  gatewayApiKey: "sk_live_your_key_here",
)

struct MyModerationService: ModerationService {
  func check(_ content: ModerationContent) async throws -> [ModerationCheckResult] {
    switch content {
    case let .image(url):
      try await checkImage(url) // Your backend, mapped to ModerationCheckResult values.
    case let .text(text):
      try await checkText(text)
    }
  }
}

#if SWIFT_PACKAGE
  let bundle = Bundle.module
#else
  let bundle = Bundle(for: ContentModerationEditorConfiguration.self)
#endif
let sceneURL = bundle.url(forResource: "content-moderation-example", withExtension: "scene")!
try await engine.scene.load(from: sceneURL)

.imgly.configuration {
  ContentModerationEditorConfiguration()
  EditorConfiguration { builder in
    builder.onLoaded { context, existing in
      try await existing() // keeps the kit's reset and change tracking
      // your own setup
    }
  }
}

let basePath = try engine.editor.getSettingString("basePath")
guard let baseURL = URL(string: basePath) else { return }
let sourceIDs = [
  "ly.img.sticker", "ly.img.vector.shape", "ly.img.filter", "ly.img.color.palette",
  "ly.img.effect", "ly.img.blur", "ly.img.typeface", "ly.img.crop.presets",
  "ly.img.page.presets", "ly.img.text", "ly.img.text.styles", "ly.img.text.curves", "ly.img.text.components",
  "ly.img.image",
]
try await withThrowingTaskGroup(of: String.self) { group in
  for id in sourceIDs {
    group.addTask {
      try await engine.asset.addLocalAssetSourceFromJSON(
        baseURL.appendingPathComponent(id).appendingPathComponent("content.json"),
      )
    }
  }
  for try await _ in group {}
}

try engine.asset.addLocalSource(
  sourceID: "ly.img.image.upload",
  supportedMimeTypes: ["image/jpeg", "image/png", "image/svg+xml", "image/gif", "image/apng", "image/bmp"],
)

// Required even though the dock's photo roll button is omitted: the asset
// library still shows a Photo Roll section, and `InspectorBar.Buttons.replace()`
// offers it, so the source has to exist. Images added this way have local URIs
// and are uploaded to the gateway before being checked, like any other image.
try engine.asset.addSource(PhotoRollAssetSource(engine: engine))

guard let scene = try engine.scene.get() else {
  throw EditorError("No scene was found.")
}
let data = try await engine.block.export(scene, mimeType: .pdf) { engine in
  try engine.scene.getPages().forEach {
    try engine.block.setScopeEnabled($0, key: "layer/visibility", enabled: true)
    try engine.block.setVisible($0, visible: true)
  }
}
let url = FileManager.default.temporaryDirectory.appendingPathComponent("Export", conformingTo: .pdf)
try data.write(to: url, options: [.atomic])
eventHandler.send(.shareFile(url))