import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { EditorWarning } from "../EditorWarning";
import { useEditContext } from "../client/editContext";
export function ItemLocked({ item }) {
    var editContext = useEditContext();
    if (!editContext)
        return;
    if (item.hasLock) {
        if (!item.canLock)
            return;
        return (_jsx(EditorWarning, { title: "Item locked", severity: "warning", children: _jsx("button", { onClick: () => {
                    const items = [item];
                    editContext.operations.unlockItems(items);
                }, className: "cursor-pointer", children: "Release lock" }) }));
    }
    // Backend serializes `lockedBy` as a string and uses "" when the item is not
    // locked, so the previous `== null` check never matched and this banner was
    // effectively dead code. Show it whenever someone else holds the lock.
    if (item.lockedBy != null && item.lockedBy !== "") {
        return (_jsx(EditorWarning, { title: "Item is locked", severity: "warning", children: _jsxs("div", { children: ["Locked by ", item.lockedBy] }) }));
    }
    // else {
    //   return (
    //     <EditorWarning title="Item not locked" severity="warning">
    //       {item.canLock && (
    //         <button
    //           onClick={() => {
    //             const items: ItemDescriptor[] = [item];
    //             if ((item as ComponentData).linkedComponentItem)
    //               items.push((item as ComponentData).linkedComponentItem);
    //             editContext!.lockItems(items);
    //           }}
    //         >
    //           Lock item
    //         </button>
    //       )}
    //     </EditorWarning>
    //   );
    // }
}
//# sourceMappingURL=ItemLocked.js.map