New mask/zone editor and motion tuner (#11020)

* initial working konva

* working multi polygons

* multi zones

* clean up

* new zone dialog

* clean up

* relative coordinates and colors

* fix color order

* better motion tuner

* objects for zones

* progress

* merge dev

* edit pane

* motion and object masks

* filtering

* add objects and unsaved to type

* motion tuner, edit controls, tooltips

* object and motion edit panes

* polygon item component, switch color, object form, hover cards

* working zone edit pane

* working motion masks

* object masks and deletion of all types

* use FilterSwitch

* motion tuner fixes and tweaks

* clean up

* tweaks

* spaces in camera name

* tweaks

* allow dragging of points while drawing polygon

* turn off editing mode when switching camera

* limit interpolated coordinates and use crosshair cursor

* padding

* fix tooltip trigger for icons

* konva tweaks

* consolidate

* fix top menu items on mobile

web/src/components/settings/ObjectSettings.tsx

@@ -0,0 +1,31 @@
+import { useMemo } from "react";
+import DebugCameraImage from "../camera/DebugCameraImage";
+import { FrigateConfig } from "@/types/frigateConfig";
+import useSWR from "swr";
+import ActivityIndicator from "../indicators/activity-indicator";
+
+type ObjectSettingsProps = {
+  selectedCamera?: string;
+};
+
+export default function ObjectSettings({
+  selectedCamera,
+}: ObjectSettingsProps) {
+  const { data: config } = useSWR<FrigateConfig>("config");
+
+  const cameraConfig = useMemo(() => {
+    if (config && selectedCamera) {
+      return config.cameras[selectedCamera];
+    }
+  }, [config, selectedCamera]);
+
+  if (!cameraConfig) {
+    return <ActivityIndicator />;
+  }
+
+  return (
+    <div className="flex flex-col h-50">
+      <DebugCameraImage cameraConfig={cameraConfig} className="size-full" />
+    </div>
+  );
+}