From b5890dd1891c37357aece026897cf1b449382e95 Mon Sep 17 00:00:00 2001
From: Hugo Bois <hugo.bois@hotmail.fr>
Date: Fri, 27 Feb 2026 01:24:09 +0100
Subject: [PATCH] added translations, fixed orphan-prevention extension

---
 components/board/BoardCanvas.tsx              | 16 ++---
 components/board/BoardCard.tsx                |  8 ++-
 components/editor/sidebar/ContextMenu.tsx     | 32 +++++-----
 components/navbar/ProjectNavbar.module.css    | 26 +++++++--
 components/navbar/ProjectNavbar.tsx           | 32 +++++-----
 components/navbar/dropdown/DropdownItem.tsx   |  2 +-
 components/popup/PopupCharacterItem.tsx       | 38 ++++++------
 components/popup/PopupImportFile.tsx          | 12 ++--
 components/popup/PopupSceneItem.tsx           | 14 +++--
 messages/de.json                              | 58 +++++++++++++++++++
 messages/en.json                              | 58 +++++++++++++++++++
 messages/es.json                              | 58 +++++++++++++++++++
 messages/fr.json                              | 58 +++++++++++++++++++
 messages/ja.json                              | 58 +++++++++++++++++++
 messages/ko.json                              | 58 +++++++++++++++++++
 messages/pl.json                              | 58 +++++++++++++++++++
 messages/zh.json                              | 58 +++++++++++++++++++
 .../extensions/orphan-prevention-extension.ts | 11 ++--
 18 files changed, 578 insertions(+), 77 deletions(-)

diff --git a/components/board/BoardCanvas.tsx b/components/board/BoardCanvas.tsx
index cf7dd8b5..f707bef4 100644
--- a/components/board/BoardCanvas.tsx
+++ b/components/board/BoardCanvas.tsx
@@ -7,6 +7,7 @@ import BoardCard, { BoardCardData } from "./BoardCard";
 import styles from "./BoardCanvas.module.css";
 import { v4 as uuidv4 } from "uuid";
 import { Trash2, Plus, Minus, Copy } from "lucide-react";
+import { useTranslations } from "next-intl";
 
 const GRID_SIZE = 20;
 const MIN_SCALE = 0.25;
@@ -42,6 +43,7 @@ interface ArrowContextMenuState {
 
 const BoardCanvas = ({ isVisible }: { isVisible: boolean }) => {
     const { repository, isYjsReady } = useContext(ProjectContext);
+    const t = useTranslations("board");
     const ydoc = repository?.getState();
     const containerRef = useRef<HTMLDivElement>(null);
     const canvasRef = useRef<HTMLDivElement>(null);
@@ -928,14 +930,14 @@ const BoardCanvas = ({ isVisible }: { isVisible: boolean }) => {
                             onClick={() => handleDuplicateCard(cardContextMenu.card)}
                         >
                             <Copy size={16} />
-                            <p className="unselectable">Duplicate</p>
+                            <p className="unselectable">{t("duplicate")}</p>
                         </div>
                         <div
                             className={styles.context_menu_item}
                             onClick={() => handleDeleteCard(cardContextMenu.card.id)}
                         >
                             <Trash2 size={16} />
-                            <p className="unselectable">Delete</p>
+                            <p className="unselectable">{t("delete")}</p>
                         </div>
                     </div>
                 )}
@@ -954,7 +956,7 @@ const BoardCanvas = ({ isVisible }: { isVisible: boolean }) => {
                             onClick={() => handleDeleteArrow(arrowContextMenu.arrow.id)}
                         >
                             <Trash2 size={16} />
-                            <p className="unselectable">Delete</p>
+                            <p className="unselectable">{t("delete")}</p>
                         </div>
                     </div>
                 )}
@@ -970,10 +972,10 @@ const BoardCanvas = ({ isVisible }: { isVisible: boolean }) => {
                 </div>
 
                 <div className={styles.hints}>
-                    <span>Middle-click to pan</span>
-                    <span>Drag to select cards</span>
-                    <span>Double-click to create card</span>
-                    <span>Hold Shift to move freely</span>
+                    <span>{t("hints.pan")}</span>
+                    <span>{t("hints.select")}</span>
+                    <span>{t("hints.create")}</span>
+                    <span>{t("hints.move")}</span>
                 </div>
             </div>
         </div>
diff --git a/components/board/BoardCard.tsx b/components/board/BoardCard.tsx
index 946adf27..ee25f0ee 100644
--- a/components/board/BoardCard.tsx
+++ b/components/board/BoardCard.tsx
@@ -2,6 +2,7 @@
 
 import { useRef, useState, useCallback, useEffect } from "react";
 import styles from "./BoardCanvas.module.css";
+import { useTranslations } from "next-intl";
 
 export interface BoardCardData {
     id: string;
@@ -39,6 +40,7 @@ const BoardCard = ({
     isConnecting,
     isSelected,
 }: BoardCardProps) => {
+    const t = useTranslations("board");
     const cardRef = useRef<HTMLDivElement>(null);
     const [isDragging, setIsDragging] = useState(false);
     const [isEditing, setIsEditing] = useState(false);
@@ -263,12 +265,12 @@ const BoardCard = ({
                         onKeyDown={handleTitleKeyDown}
                         onClick={(e) => e.stopPropagation()}
                         onMouseDown={(e) => e.stopPropagation()}
-                        placeholder="Title"
+                        placeholder={t("titlePlaceholder")}
                         autoFocus
                     />
                 ) : (
                     <span className={styles.card_header_title} onDoubleClick={handleTitleDoubleClick}>
-                        {card.title || "Untitled"}
+                        {card.title || t("untitled")}
                     </span>
                 )}
             </div>
@@ -290,7 +292,7 @@ const BoardCard = ({
                         onKeyDown={handleDescriptionKeyDown}
                         onClick={(e) => e.stopPropagation()}
                         onMouseDown={(e) => e.stopPropagation()}
-                        placeholder="Description"
+                        placeholder={t("descriptionPlaceholder")}
                         autoFocus
                     />
                 )}
diff --git a/components/editor/sidebar/ContextMenu.tsx b/components/editor/sidebar/ContextMenu.tsx
index 3cdb28e8..35b313cc 100644
--- a/components/editor/sidebar/ContextMenu.tsx
+++ b/components/editor/sidebar/ContextMenu.tsx
@@ -11,6 +11,7 @@ import { copyText, cutText, focusOnPosition, pasteText, selectTextInEditor } fro
 import { addCharacterPopup, editCharacterPopup, editScenePopup } from "@src/lib/screenplay/popup";
 import { ProjectContext } from "@src/context/ProjectContext";
 import { useUser } from "@src/lib/utils/hooks";
+import { useTranslations } from "next-intl";
 import {
     ArrowDownRight,
     ClipboardPaste,
@@ -69,6 +70,7 @@ export type SceneContextProps = {
 };
 
 const SceneItemMenu = (props: any) => {
+    const t = useTranslations("contextMenu");
     const userCtx = useContext(UserContext);
     const { editor } = useContext(ProjectContext);
     const scene: Scene = props.props.scene;
@@ -76,18 +78,18 @@ const SceneItemMenu = (props: any) => {
     return (
         <>
             <ContextMenuItem
-                text={"Go to scene"}
+                text={t("goToScene")}
                 icon={ArrowDownRight}
                 action={() => focusOnPosition(editor!, scene.position)}
             />
-            <ContextMenuItem text={"Edit"} icon={Pencil} action={() => editScenePopup(scene, userCtx)} />
+            <ContextMenuItem text={t("edit")} icon={Pencil} action={() => editScenePopup(scene, userCtx)} />
             <ContextMenuItem
-                text={"Cut"}
+                text={t("cut")}
                 icon={Scissors}
                 action={() => cutText(editor!, scene.position, scene.nextPosition)}
             />
             <ContextMenuItem
-                text={"Select in editor"}
+                text={t("selectInEditor")}
                 icon={SquareDashedMousePointer}
                 action={() => selectTextInEditor(editor!, scene.position, scene.nextPosition)}
             />
@@ -115,6 +117,7 @@ export type CharacterContextProps = {
 };
 
 const CharacterItemMenu = (props: any) => {
+    const t = useTranslations("contextMenu");
     const userCtx = useContext(UserContext);
     const projectCtx = useContext(ProjectContext);
     const { toggleCharacterHighlight } = projectCtx;
@@ -122,15 +125,15 @@ const CharacterItemMenu = (props: any) => {
 
     return (
         <>
-            <ContextMenuItem text={"Edit"} icon={Pencil} action={() => editCharacterPopup(character, userCtx)} />
-            <ContextMenuItem text={"Remove"} icon={Trash2} action={() => deleteCharacter(character.name, projectCtx)} />
+            <ContextMenuItem text={t("edit")} icon={Pencil} action={() => editCharacterPopup(character, userCtx)} />
+            <ContextMenuItem text={t("remove")} icon={Trash2} action={() => deleteCharacter(character.name, projectCtx)} />
             <ContextMenuItem
-                text={"Paste"}
+                text={t("paste")}
                 icon={ClipboardPaste}
                 action={() => pasteText(projectCtx.editor!, character.name)}
             />
             <ContextMenuItem
-                text={"Highlight"}
+                text={t("highlight")}
                 icon={Highlighter}
                 action={() => toggleCharacterHighlight(character.name)}
             />
@@ -139,8 +142,9 @@ const CharacterItemMenu = (props: any) => {
 };
 
 const CharacterListMenu = (props: any) => {
+    const t = useTranslations("contextMenu");
     const userCtx = useContext(UserContext);
-    return <ContextMenuItem icon={UserRound} text={"Add character"} action={() => addCharacterPopup(userCtx)} />;
+    return <ContextMenuItem icon={UserRound} text={t("addCharacter")} action={() => addCharacterPopup(userCtx)} />;
 };
 
 /* ======================== */
@@ -152,15 +156,16 @@ export type LocationContextProps = {
 };
 
 const LocationItemMenu = (props: any) => {
+    const t = useTranslations("contextMenu");
     const projectCtx = useContext(ProjectContext);
     const location: LocationData = props.props.location;
 
     return (
         <>
-            <ContextMenuItem icon={Trash2} text={"Remove"} action={() => deleteLocation(location.name, projectCtx)} />
+            <ContextMenuItem icon={Trash2} text={t("remove")} action={() => deleteLocation(location.name, projectCtx)} />
             <ContextMenuItem
                 icon={ClipboardPaste}
-                text={"Paste"}
+                text={t("paste")}
                 action={() => pasteText(projectCtx.editor!, location.name)}
             />
         </>
@@ -177,6 +182,7 @@ export type EditorSelectionContextProps = {
 };
 
 const EditorSelectionMenu = (props: any) => {
+    const t = useTranslations("contextMenu");
     const projectCtx = useContext(ProjectContext);
     const { repository, editor, setActiveCommentId } = projectCtx;
     const { from, to } = props.props as EditorSelectionContextProps;
@@ -207,8 +213,8 @@ const EditorSelectionMenu = (props: any) => {
 
     return (
         <>
-            <ContextMenuItem text={"Add Comment"} icon={MessageSquarePlus} action={handleAddComment} />
-            <ContextMenuItem text={"Search on web"} icon={Search} action={handleSearchOnWeb} />
+            <ContextMenuItem text={t("addComment")} icon={MessageSquarePlus} action={handleAddComment} />
+            <ContextMenuItem text={t("searchOnWeb")} icon={Search} action={handleSearchOnWeb} />
         </>
     );
 };
diff --git a/components/navbar/ProjectNavbar.module.css b/components/navbar/ProjectNavbar.module.css
index 02442a1f..58544169 100644
--- a/components/navbar/ProjectNavbar.module.css
+++ b/components/navbar/ProjectNavbar.module.css
@@ -144,16 +144,35 @@
     background-color: var(--secondary-hover);
 }
 
+.title_wrapper {
+    display: inline-grid;
+    align-items: center;
+}
+
+.title_wrapper::after {
+    content: attr(data-value) " ";
+    visibility: hidden;
+    white-space: pre;
+    grid-area: 1 / 1;
+    font-size: 0.9rem;
+    font-family: inherit;
+    letter-spacing: inherit;
+    padding: 4px 8px;
+}
+
 .title_box {
     border: none;
     background: none;
     font-size: 0.9rem;
+    font-family: inherit;
+    letter-spacing: inherit;
     border-radius: 6px;
     padding: 4px 8px;
     color: var(--primary-text);
-    width: auto;
-    max-width: 200px;
-    padding-right: 8px;
+    box-sizing: border-box;
+    grid-area: 1 / 1;
+    width: 100%;
+    min-width: 0;
 }
 
 .title_box:focus {
@@ -165,7 +184,6 @@
     background-color: var(--secondary-hover);
 }
 
-
 .notlogged_btns {
     display: flex;
     flex-direction: row;
diff --git a/components/navbar/ProjectNavbar.tsx b/components/navbar/ProjectNavbar.tsx
index 718099ac..34aa5b4e 100644
--- a/components/navbar/ProjectNavbar.tsx
+++ b/components/navbar/ProjectNavbar.tsx
@@ -217,21 +217,23 @@ const ProjectNavbar = () => {
                 <div className={navbar.center}>
                     <div className={navbar.projectTitle}>
                         <StatusIndicator />
-                        <input
-                            type="text"
-                            className={navbar.title_box}
-                            size={Math.max(projectTitle.length, 3)}
-                            onChange={(e) => {
-                                isLocalEdit.current = true;
-                                setProjectTitle(e.target.value);
-                                setContextTitle(e.target.value);
-                                deferredTitleUpdate(projectId, e.target.value);
-                            }}
-                            onBlur={() => {
-                                isLocalEdit.current = false;
-                            }}
-                            value={projectTitle}
-                        />
+                        <div className={navbar.title_wrapper} data-value={projectTitle}>
+                            <input
+                                type="text"
+                                className={navbar.title_box}
+                                size={1}
+                                onChange={(e) => {
+                                    isLocalEdit.current = true;
+                                    setProjectTitle(e.target.value);
+                                    setContextTitle(e.target.value);
+                                    deferredTitleUpdate(projectId, e.target.value);
+                                }}
+                                onBlur={() => {
+                                    isLocalEdit.current = false;
+                                }}
+                                value={projectTitle}
+                            />
+                        </div>
                     </div>
                     {(hasScreenplay || hasTitlePage) && (
                         <div className={navbar.projectTitle}>
diff --git a/components/navbar/dropdown/DropdownItem.tsx b/components/navbar/dropdown/DropdownItem.tsx
index 89deba0a..b394c4b3 100644
--- a/components/navbar/dropdown/DropdownItem.tsx
+++ b/components/navbar/dropdown/DropdownItem.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { ForwardedRef, MutableRefObject, RefObject, forwardRef } from "react";
+import { ForwardedRef, forwardRef } from "react";
 import dropdown from "./DropdownItem.module.css";
 
 type Props = {
diff --git a/components/popup/PopupCharacterItem.tsx b/components/popup/PopupCharacterItem.tsx
index dc3345ae..57e9343f 100644
--- a/components/popup/PopupCharacterItem.tsx
+++ b/components/popup/PopupCharacterItem.tsx
@@ -16,6 +16,7 @@ import { UserContext } from "@src/context/UserContext";
 import { PopupCharacterData, PopupData, PopupType, closePopup } from "@src/lib/screenplay/popup";
 import { countOccurrences } from "@src/lib/screenplay/screenplay";
 import { ColorPicker } from "@components/utils/ColorPicker";
+import { useTranslations } from "next-intl";
 
 import CloseSVG from "@public/images/close.svg";
 
@@ -30,33 +31,32 @@ type NewNameWarningProps = {
     nameOccurrences: number;
     oldName: string;
     newName: string;
+    t: any;
 };
 
 const NewNameWarning = (props: NewNameWarningProps) => {
     return (
         <div className={join(popup.info, form_info.warn)}>
             <p>
-                Are you sure you want to update {props.nameOccurrences} occurrences of word {props.oldName} to{" "}
-                {props.newName}? Take extra care of common words whose update might be unwated.
+                {props.t("updateOccurrences", { count: props.nameOccurrences, oldName: props.oldName, newName: props.newName })}
             </p>
             <div className={popup.info_btns}>
                 <button className={join(form.btn, popup.info_btn)} type="button" onClick={props.onNewNameConfirm}>
-                    Yes
+                    {props.t("yes")}
                 </button>
                 <button className={join(form.btn, popup.info_btn)} onClick={() => props.setNewNameWarning(false)}>
-                    No, do not change
+                    {props.t("noDoNotChange")}
                 </button>
             </div>
         </div>
     );
 };
 
-const TakenNameError = (newName: string) => {
+const TakenNameError = (newName: string, t: any) => {
     return (
         <div className={join(popup.info, form_info.error)}>
             <p>
-                A character with the name {newName} already exists. Please choose a different name or edit the existing
-                character instead.
+                {t("takenNameError", { newName })}
             </p>
         </div>
     );
@@ -66,6 +66,7 @@ export const PopupCharacterItem = ({ type, data: { character } }: PopupData<Popu
     const projectCtx = useContext(ProjectContext);
     const userCtx = useContext(UserContext);
     const { position, handleMouseDown, isDragging } = useDraggable();
+    const t = useTranslations("popup.character");
 
     const [newNameWarning, setNewNameWarning] = useState<boolean>(false);
     const [takenNameError, setTakenNameError] = useState<boolean>(false);
@@ -168,7 +169,7 @@ export const PopupCharacterItem = ({ type, data: { character } }: PopupData<Popu
     };
 
     let def: any = {
-        title: "Create Character",
+        title: t("create"),
         onSubmit: onCreate,
         name: "",
         synopsis: "",
@@ -177,7 +178,7 @@ export const PopupCharacterItem = ({ type, data: { character } }: PopupData<Popu
     };
 
     if (type === PopupType.EditCharacter) {
-        def.title = "Edit Character";
+        def.title = t("edit");
         def.onSubmit = onEdit;
         def.name = character?.name;
         def.synopsis = character?.synopsis;
@@ -197,7 +198,7 @@ export const PopupCharacterItem = ({ type, data: { character } }: PopupData<Popu
                     <CloseSVG className={popup.close_btn} onClick={() => closePopup(userCtx)} alt="Close icon" />
                 </div>
                 <form className={popup.form} onSubmit={def.onSubmit}>
-                    {takenNameError && TakenNameError(newName)}
+                    {takenNameError && TakenNameError(newName, t)}
                     {newNameWarning &&
                         NewNameWarning({
                             setNewNameWarning,
@@ -205,10 +206,11 @@ export const PopupCharacterItem = ({ type, data: { character } }: PopupData<Popu
                             nameOccurrences,
                             oldName: character?.name!,
                             newName,
+                            t
                         })}
                     <div className={styles.element}>
                         <div className={styles.element_header}>
-                            <p>Name</p>
+                            <p>{t("name")}</p>
                             <input
                                 className={join(form.input, popup.input)}
                                 name="name"
@@ -221,29 +223,29 @@ export const PopupCharacterItem = ({ type, data: { character } }: PopupData<Popu
                     </div>
                     <div className={styles.element}>
                         <div className={styles.element_header}>
-                            <p>Gender</p>
+                            <p>{t("gender")}</p>
                             <select
                                 className={popup.select}
                                 name="gender"
                                 defaultValue={def.gender}
                                 disabled={newNameWarning || takenNameError}
                             >
-                                <option value="0">Female</option>
-                                <option value="1">Male</option>
-                                <option value="2">Other</option>
+                                <option value="0">{t("genderFemale")}</option>
+                                <option value="1">{t("genderMale")}</option>
+                                <option value="2">{t("genderOther")}</option>
                             </select>
                         </div>
                         <hr />
                     </div>
                     <div className={styles.element}>
                         <div className={styles.element_header}>
-                            <p>Color</p>
+                            <p>{t("color")}</p>
                             <ColorPicker value={newColor} onChange={setNewColor} />
                         </div>
                         <hr />
                     </div>
                     <div className={styles.element}>
-                        <p>Synopsis</p>
+                        <p>{t("synopsis")}</p>
                         <textarea
                             className={join(form.input, popup.textarea)}
                             name="synopsis"
@@ -256,7 +258,7 @@ export const PopupCharacterItem = ({ type, data: { character } }: PopupData<Popu
                         className={join(form.btn, popup.confirm)}
                         type="submit"
                     >
-                        Confirm
+                        {t("confirm")}
                     </button>
                 </form>
             </div>
diff --git a/components/popup/PopupImportFile.tsx b/components/popup/PopupImportFile.tsx
index 89ec7df6..70c16f91 100644
--- a/components/popup/PopupImportFile.tsx
+++ b/components/popup/PopupImportFile.tsx
@@ -9,10 +9,12 @@ import { useDraggable } from "@src/lib/utils/hooks";
 import { PopupData, PopupImportFileData, closePopup } from "@src/lib/screenplay/popup";
 import { useContext } from "react";
 import { UserContext } from "@src/context/UserContext";
+import { useTranslations } from "next-intl";
 
 const PopupImportFile = ({ data: { confirmImport } }: PopupData<PopupImportFileData>) => {
     const userCtx = useContext(UserContext);
     const { position, handleMouseDown, isDragging } = useDraggable();
+    const t = useTranslations("popup.import");
 
     const onConfirmImport = () => {
         confirmImport();
@@ -27,21 +29,21 @@ const PopupImportFile = ({ data: { confirmImport } }: PopupData<PopupImportFileD
                     onMouseDown={handleMouseDown}
                     style={{ cursor: isDragging ? "grabbing" : "grab" }}
                 >
-                    <h2 className={popup.title}>Confirm Import</h2>
+                    <h2 className={popup.title}>{t("title")}</h2>
                     <CloseSVG className={popup.close_btn} onClick={() => closePopup(userCtx)} alt="Close icon" />
                 </div>
                 <div className={popup.info}>
                     <p>
-                        Are you sure you want to <b>overwrite</b> your current project?
+                        {t.rich("warning", { b: (chunks) => <b>{chunks}</b> })}
                         <br />
-                        You can export your project before importing a new one.
+                        {t("info")}
                     </p>
                 </div>
                 <button className={join(form.btn, popup.confirm, popup.import_confirm)} onClick={onConfirmImport}>
-                    Yes, import
+                    {t("yesImport")}
                 </button>
                 <button className={join(form.btn, popup.cancel)} onClick={() => closePopup(userCtx)}>
-                    No
+                    {t("no")}
                 </button>
             </div>
         </div>
diff --git a/components/popup/PopupSceneItem.tsx b/components/popup/PopupSceneItem.tsx
index e7917b10..c2b3d628 100644
--- a/components/popup/PopupSceneItem.tsx
+++ b/components/popup/PopupSceneItem.tsx
@@ -9,6 +9,7 @@ import { PopupData, PopupSceneData, closePopup } from "@src/lib/screenplay/popup
 import { generateSceneId } from "@src/lib/screenplay/scenes";
 import { ColorPicker } from "@components/utils/ColorPicker";
 import { ScreenplayElement } from "@src/lib/utils/enums";
+import { useTranslations } from "next-intl";
 
 import CloseSVG from "@public/images/close.svg";
 
@@ -20,6 +21,7 @@ export const PopupSceneItem = ({ data: { scene } }: PopupData<PopupSceneData>) =
     const { repository, editor } = useContext(ProjectContext);
     const userCtx = useContext(UserContext);
     const { position, handleMouseDown, isDragging } = useDraggable();
+    const t = useTranslations("popup.scene");
 
     const [synopsis, setSynopsis] = useState<string>(scene.synopsis || "");
     const [color, setColor] = useState<string | undefined>(scene.color);
@@ -92,34 +94,34 @@ export const PopupSceneItem = ({ data: { scene } }: PopupData<PopupSceneData>) =
                     onMouseDown={handleMouseDown}
                     style={{ cursor: isDragging ? "grabbing" : "grab" }}
                 >
-                    <h2 className={popup.title}>Edit Scene</h2>
+                    <h2 className={popup.title}>{t("edit")}</h2>
                     <CloseSVG className={popup.close_btn} onClick={() => closePopup(userCtx)} alt="Close icon" />
                 </div>
                 <form className={popup.form} onSubmit={onSubmit}>
                     <div className={styles.element}>
                         <div className={styles.element_header}>
-                            <p>Scene</p>
+                            <p>{t("sceneTitle")}</p>
                             <input className={join(form.input, popup.input)} value={scene.title} disabled />
                         </div>
                     </div>
                     <div className={styles.element}>
                         <div className={styles.element_header}>
-                            <p>Color</p>
+                            <p>{t("color")}</p>
                             <ColorPicker value={color} onChange={setColor} />
                         </div>
                         <hr />
                     </div>
                     <div className={styles.element}>
-                        <p>Synopsis</p>
+                        <p>{t("synopsis")}</p>
                         <textarea
                             className={join(form.input, popup.textarea)}
                             value={synopsis}
                             onChange={(e) => setSynopsis(e.target.value)}
-                            placeholder="Write a brief description of this scene..."
+                            placeholder={t("synopsisPlaceholder")}
                         />
                     </div>
                     <button className={join(form.btn, popup.confirm)} type="submit">
-                        Save
+                        {t("save")}
                     </button>
                 </form>
             </div>
diff --git a/messages/de.json b/messages/de.json
index fa0eecfc..a1a9c0cd 100644
--- a/messages/de.json
+++ b/messages/de.json
@@ -262,5 +262,63 @@
         "posterHelp": "Empfohlen: 600x900 Pixel (Verhältnis 2:3). Unterstützt PNG und JPG.",
         "saveChanges": "Änderungen speichern",
         "dangerZoneTitle": "Gefahrenbereich"
+    },
+    "contextMenu": {
+        "goToScene": "Gehe zu Szene",
+        "edit": "Bearbeiten",
+        "cut": "Ausschneiden",
+        "selectInEditor": "Im Editor auswählen",
+        "remove": "Entfernen",
+        "paste": "Einfügen",
+        "highlight": "Hervorheben",
+        "addCharacter": "Charakter hinzufügen",
+        "addComment": "Kommentar hinzufügen",
+        "searchOnWeb": "Im Web suchen"
+    },
+    "popup": {
+        "character": {
+            "create": "Charakter erstellen",
+            "edit": "Charakter bearbeiten",
+            "name": "Name",
+            "gender": "Geschlecht",
+            "genderFemale": "Weiblich",
+            "genderMale": "Männlich",
+            "genderOther": "Divers",
+            "color": "Farbe",
+            "synopsis": "Zusammenfassung",
+            "confirm": "Bestätigen",
+            "takenNameError": "Ein Charakter mit dem Namen {newName} existiert bereits. Bitte wähle einen anderen Namen oder bearbeite den bestehenden Charakter.",
+            "updateOccurrences": "Bist du sicher, dass du {count} Vorkommen des Wortes {oldName} zu {newName} aktualisieren möchtest? Sei besonders vorsichtig bei häufigen Wörtern, deren Änderung unerwünscht sein könnte.",
+            "yes": "Ja",
+            "noDoNotChange": "Nein, nicht ändern"
+        },
+        "import": {
+            "title": "Import bestätigen",
+            "warning": "Bist du sicher, dass du dein aktuelles Projekt <b>überschreiben</b> möchtest?",
+            "info": "Du kannst dein Projekt exportieren, bevor du ein neues importierst.",
+            "yesImport": "Ja, importieren",
+            "no": "Nein"
+        },
+        "scene": {
+            "edit": "Szene bearbeiten",
+            "sceneTitle": "Szene",
+            "color": "Farbe",
+            "synopsis": "Zusammenfassung",
+            "synopsisPlaceholder": "Schreibe eine kurze Beschreibung dieser Szene...",
+            "save": "Speichern"
+        }
+    },
+    "board": {
+        "duplicate": "Duplizieren",
+        "delete": "Löschen",
+        "hints": {
+            "pan": "Mittelklick zum Verschieben",
+            "select": "Ziehen zum Auswählen von Karten",
+            "create": "Doppelklick zum Erstellen einer Karte",
+            "move": "Umschalttaste halten für freies Bewegen"
+        },
+        "untitled": "Unbenannt",
+        "titlePlaceholder": "Titel",
+        "descriptionPlaceholder": "Beschreibung"
     }
 }
diff --git a/messages/en.json b/messages/en.json
index d9846eff..2a46f582 100644
--- a/messages/en.json
+++ b/messages/en.json
@@ -262,5 +262,63 @@
         "posterHelp": "Recommended: 600x900 pixels (2:3 ratio). Supports PNG, JPG.",
         "saveChanges": "Save changes",
         "dangerZoneTitle": "Danger zone"
+    },
+    "contextMenu": {
+        "goToScene": "Go to scene",
+        "edit": "Edit",
+        "cut": "Cut",
+        "selectInEditor": "Select in editor",
+        "remove": "Remove",
+        "paste": "Paste",
+        "highlight": "Highlight",
+        "addCharacter": "Add character",
+        "addComment": "Add Comment",
+        "searchOnWeb": "Search on web"
+    },
+    "popup": {
+        "character": {
+            "create": "Create Character",
+            "edit": "Edit Character",
+            "name": "Name",
+            "gender": "Gender",
+            "genderFemale": "Female",
+            "genderMale": "Male",
+            "genderOther": "Other",
+            "color": "Color",
+            "synopsis": "Synopsis",
+            "confirm": "Confirm",
+            "takenNameError": "A character with the name {newName} already exists. Please choose a different name or edit the existing character instead.",
+            "updateOccurrences": "Are you sure you want to update {count} occurrences of word {oldName} to {newName}? Take extra care of common words whose update might be unwated.",
+            "yes": "Yes",
+            "noDoNotChange": "No, do not change"
+        },
+        "import": {
+            "title": "Confirm Import",
+            "warning": "Are you sure you want to <b>overwrite</b> your current project?",
+            "info": "You can export your project before importing a new one.",
+            "yesImport": "Yes, import",
+            "no": "No"
+        },
+        "scene": {
+            "edit": "Edit Scene",
+            "sceneTitle": "Scene",
+            "color": "Color",
+            "synopsis": "Synopsis",
+            "synopsisPlaceholder": "Write a brief description of this scene...",
+            "save": "Save"
+        }
+    },
+    "board": {
+        "duplicate": "Duplicate",
+        "delete": "Delete",
+        "hints": {
+            "pan": "Middle-click to pan",
+            "select": "Drag to select cards",
+            "create": "Double-click to create card",
+            "move": "Hold Shift to move freely"
+        },
+        "untitled": "Untitled",
+        "titlePlaceholder": "Title",
+        "descriptionPlaceholder": "Description"
     }
 }
diff --git a/messages/es.json b/messages/es.json
index 4e6418a4..d5f08321 100644
--- a/messages/es.json
+++ b/messages/es.json
@@ -262,5 +262,63 @@
         "posterHelp": "Recomendado: 600x900 píxeles (proporción 2:3). Compatible con PNG y JPG.",
         "saveChanges": "Guardar cambios",
         "dangerZoneTitle": "Zona de peligro"
+    },
+    "contextMenu": {
+        "goToScene": "Ir a la escena",
+        "edit": "Editar",
+        "cut": "Cortar",
+        "selectInEditor": "Seleccionar en el editor",
+        "remove": "Eliminar",
+        "paste": "Pegar",
+        "highlight": "Resaltar",
+        "addCharacter": "Añadir personaje",
+        "addComment": "Añadir comentario",
+        "searchOnWeb": "Buscar en la web"
+    },
+    "popup": {
+        "character": {
+            "create": "Crear personaje",
+            "edit": "Editar personaje",
+            "name": "Nombre",
+            "gender": "Género",
+            "genderFemale": "Mujer",
+            "genderMale": "Hombre",
+            "genderOther": "Otro",
+            "color": "Color",
+            "synopsis": "Sinopsis",
+            "confirm": "Confirmar",
+            "takenNameError": "Ya existe un personaje con el nombre {newName}. Por favor, elige un nombre diferente o edita el personaje existente.",
+            "updateOccurrences": "¿Estás seguro de que quieres actualizar {count} ocurrencias de la palabra {oldName} a {newName}? Ten especial cuidado con las palabras comunes cuya actualización podría ser indeseada.",
+            "yes": "Sí",
+            "noDoNotChange": "No, no cambiar"
+        },
+        "import": {
+            "title": "Confirmar importación",
+            "warning": "¿Estás seguro de que quieres <b>sobrescribir</b> tu proyecto actual?",
+            "info": "Puedes exportar tu proyecto antes de importar uno nuevo.",
+            "yesImport": "Sí, importar",
+            "no": "No"
+        },
+        "scene": {
+            "edit": "Editar escena",
+            "sceneTitle": "Escena",
+            "color": "Color",
+            "synopsis": "Sinopsis",
+            "synopsisPlaceholder": "Escribe una breve descripción de esta escena...",
+            "save": "Guardar"
+        }
+    },
+    "board": {
+        "duplicate": "Duplicar",
+        "delete": "Eliminar",
+        "hints": {
+            "pan": "Clic central para desplazar",
+            "select": "Arrastrar para seleccionar tarjetas",
+            "create": "Doble clic para crear tarjeta",
+            "move": "Mantener Shift para mover libremente"
+        },
+        "untitled": "Sin título",
+        "titlePlaceholder": "Título",
+        "descriptionPlaceholder": "Descripción"
     }
 }
diff --git a/messages/fr.json b/messages/fr.json
index 94b0c837..93a54e68 100644
--- a/messages/fr.json
+++ b/messages/fr.json
@@ -262,5 +262,63 @@
         "posterHelp": "Recommandé : 600x900 pixels (ratio 2:3). Supporte PNG et JPG.",
         "saveChanges": "Enregistrer",
         "dangerZoneTitle": "Zone dangereuse"
+    },
+    "contextMenu": {
+        "goToScene": "Aller à la scène",
+        "edit": "Modifier",
+        "cut": "Couper",
+        "selectInEditor": "Sélectionner dans l'éditeur",
+        "remove": "Supprimer",
+        "paste": "Coller",
+        "highlight": "Surligner",
+        "addCharacter": "Ajouter un personnage",
+        "addComment": "Ajouter un commentaire",
+        "searchOnWeb": "Rechercher sur le web"
+    },
+    "popup": {
+        "character": {
+            "create": "Créer un personnage",
+            "edit": "Modifier le personnage",
+            "name": "Nom",
+            "gender": "Genre",
+            "genderFemale": "Femme",
+            "genderMale": "Homme",
+            "genderOther": "Autre",
+            "color": "Couleur",
+            "synopsis": "Synopsis",
+            "confirm": "Confirmer",
+            "takenNameError": "Un personnage avec le nom {newName} existe déjà. Veuillez choisir un autre nom ou modifier le personnage existant.",
+            "updateOccurrences": "Êtes-vous sûr de vouloir mettre à jour {count} occurrences du mot {oldName} par {newName} ? Faites particulièrement attention aux mots courants dont la modification pourrait être indésirable.",
+            "yes": "Oui",
+            "noDoNotChange": "Non, ne pas modifier"
+        },
+        "import": {
+            "title": "Confirmer l'importation",
+            "warning": "Êtes-vous sûr de vouloir <b>écraser</b> votre projet actuel ?",
+            "info": "Vous pouvez exporter votre projet avant d'en importer un nouveau.",
+            "yesImport": "Oui, importer",
+            "no": "Non"
+        },
+        "scene": {
+            "edit": "Modifier la scène",
+            "sceneTitle": "Scène",
+            "color": "Couleur",
+            "synopsis": "Synopsis",
+            "synopsisPlaceholder": "Écrivez une brève description de cette scène...",
+            "save": "Enregistrer"
+        }
+    },
+    "board": {
+        "duplicate": "Dupliquer",
+        "delete": "Supprimer",
+        "hints": {
+            "pan": "Clic-milieu pour déplacer",
+            "select": "Glissez pour sélectionner des cartes",
+            "create": "Double-cliquez pour créer une carte",
+            "move": "Maintenez Maj pour vous déplacer librement"
+        },
+        "untitled": "Sans titre",
+        "titlePlaceholder": "Titre",
+        "descriptionPlaceholder": "Description"
     }
 }
diff --git a/messages/ja.json b/messages/ja.json
index 41b1144d..5c9b1431 100644
--- a/messages/ja.json
+++ b/messages/ja.json
@@ -262,5 +262,63 @@
         "posterHelp": "推奨: 600x900ピクセル (2:3比率)。PNG、JPG対応。",
         "saveChanges": "変更を保存",
         "dangerZoneTitle": "危険ゾーン"
+    },
+    "contextMenu": {
+        "goToScene": "シーンへ移動",
+        "edit": "編集",
+        "cut": "切り取り",
+        "selectInEditor": "エディタで選択",
+        "remove": "削除",
+        "paste": "貼り付け",
+        "highlight": "ハイライト",
+        "addCharacter": "キャラクターを追加",
+        "addComment": "コメントを追加",
+        "searchOnWeb": "ウェブで検索"
+    },
+    "popup": {
+        "character": {
+            "create": "キャラクター作成",
+            "edit": "キャラクター編集",
+            "name": "名前",
+            "gender": "性別",
+            "genderFemale": "女性",
+            "genderMale": "男性",
+            "genderOther": "その他",
+            "color": "色",
+            "synopsis": "あらすじ",
+            "confirm": "確認",
+            "takenNameError": "{newName}という名前のキャラクターは既に存在します。別の名前を選択するか、既存のキャラクターを編集してください。",
+            "updateOccurrences": "{oldName}という単語の{count}個の出現を{newName}に更新してもよろしいですか？予期せぬ更新となる可能性がある一般的な単語には特に注意してください。",
+            "yes": "はい",
+            "noDoNotChange": "いいえ、変更しません"
+        },
+        "import": {
+            "title": "インポートの確認",
+            "warning": "現在のプロジェクトを<b>上書き</b>してもよろしいですか？",
+            "info": "新しいプロジェクトをインポートする前に、現在のプロジェクトをエクスポートできます。",
+            "yesImport": "はい、インポートします",
+            "no": "いいえ"
+        },
+        "scene": {
+            "edit": "シーン編集",
+            "sceneTitle": "シーン",
+            "color": "色",
+            "synopsis": "あらすじ",
+            "synopsisPlaceholder": "このシーンの簡単な説明を書いてください...",
+            "save": "保存"
+        }
+    },
+    "board": {
+        "duplicate": "複製",
+        "delete": "削除",
+        "hints": {
+            "pan": "中クリックで移動",
+            "select": "ドラッグでカードを選択",
+            "create": "ダブルクリックでカードを作成",
+            "move": "Shiftキーを押しながらで自由に移動"
+        },
+        "untitled": "無題",
+        "titlePlaceholder": "タイトル",
+        "descriptionPlaceholder": "説明"
     }
 }
diff --git a/messages/ko.json b/messages/ko.json
index 99d9eed9..f50ca98c 100644
--- a/messages/ko.json
+++ b/messages/ko.json
@@ -262,5 +262,63 @@
         "posterHelp": "권장: 600x900픽셀 (2:3 비율). PNG, JPG 지원.",
         "saveChanges": "변경사항 저장",
         "dangerZoneTitle": "위험 구역"
+    },
+    "contextMenu": {
+        "goToScene": "장면으로 이동",
+        "edit": "편집",
+        "cut": "잘라내기",
+        "selectInEditor": "에디터에서 선택",
+        "remove": "삭제",
+        "paste": "붙여넣기",
+        "highlight": "강조",
+        "addCharacter": "캐릭터 추가",
+        "addComment": "댓글 추가",
+        "searchOnWeb": "웹에서 검색"
+    },
+    "popup": {
+        "character": {
+            "create": "캐릭터 생성",
+            "edit": "캐릭터 편집",
+            "name": "이름",
+            "gender": "성별",
+            "genderFemale": "여성",
+            "genderMale": "남성",
+            "genderOther": "기타",
+            "color": "색상",
+            "synopsis": "시놉시스",
+            "confirm": "확인",
+            "takenNameError": "{newName}이라는 이름의 캐릭터가 이미 존재합니다. 다른 이름을 선택하거나 기존 캐릭터를 편집하세요.",
+            "updateOccurrences": "{oldName} 단어의 {count}개 항목을 {newName}(으)로 업데이트하시겠습니까? 원치 않는 업데이트가 될 수 있는 일반적인 단어에 각별히 주의하세요.",
+            "yes": "예",
+            "noDoNotChange": "아니요, 변경하지 않습니다"
+        },
+        "import": {
+            "title": "가져오기 확인",
+            "warning": "현재 프로젝트를 <b>덮어쓰시겠습니까</b>?",
+            "info": "새 프로젝트를 가져오기 전에 현재 프로젝트를 내보낼 수 있습니다.",
+            "yesImport": "예, 가져옵니다",
+            "no": "아니요"
+        },
+        "scene": {
+            "edit": "장면 편집",
+            "sceneTitle": "장면",
+            "color": "색상",
+            "synopsis": "시놉시스",
+            "synopsisPlaceholder": "이 장면에 대한 간단한 설명을 작성하세요...",
+            "save": "저장"
+        }
+    },
+    "board": {
+        "duplicate": "복제",
+        "delete": "삭제",
+        "hints": {
+            "pan": "가운데 클릭하여 이동",
+            "select": "드래그하여 카드 선택",
+            "create": "더블 클릭하여 카드 생성",
+            "move": "자유롭게 이동하려면 Shift 키를 누르세요"
+        },
+        "untitled": "제목 없음",
+        "titlePlaceholder": "제목",
+        "descriptionPlaceholder": "설명"
     }
 }
diff --git a/messages/pl.json b/messages/pl.json
index c88d38fc..cf1d668a 100644
--- a/messages/pl.json
+++ b/messages/pl.json
@@ -262,5 +262,63 @@
         "posterHelp": "Zalecane: 600x900 pikseli (proporcje 2:3). Obsługuje PNG i JPG.",
         "saveChanges": "Zapisz zmiany",
         "dangerZoneTitle": "Strefa niebezpieczna"
+    },
+    "contextMenu": {
+        "goToScene": "Przejdź do sceny",
+        "edit": "Edytuj",
+        "cut": "Wytnij",
+        "selectInEditor": "Wybierz w edytorze",
+        "remove": "Usuń",
+        "paste": "Wklej",
+        "highlight": "Podświetl",
+        "addCharacter": "Dodaj postać",
+        "addComment": "Dodaj komentarz",
+        "searchOnWeb": "Szukaj w sieci"
+    },
+    "popup": {
+        "character": {
+            "create": "Utwórz postać",
+            "edit": "Edytuj postać",
+            "name": "Imię",
+            "gender": "Płeć",
+            "genderFemale": "Kobieta",
+            "genderMale": "Mężczyzna",
+            "genderOther": "Inna",
+            "color": "Kolor",
+            "synopsis": "Streszczenie",
+            "confirm": "Potwierdź",
+            "takenNameError": "Postać o imieniu {newName} już istnieje. Wybierz inne imię lub edytuj istniejącą postać.",
+            "updateOccurrences": "Czy na pewno chcesz zaktualizować {count} wystąpień słowa {oldName} na {newName}? Zwróć szczególną uwagę na popularne słowa, których aktualizacja może być niepożądana.",
+            "yes": "Tak",
+            "noDoNotChange": "Nie, nie zmieniaj"
+        },
+        "import": {
+            "title": "Potwierdź import",
+            "warning": "Czy na pewno chcesz <b>nadpisać</b> swój obecny projekt?",
+            "info": "Możesz wyeksportować swój projekt przed zaimportowaniem nowego.",
+            "yesImport": "Tak, importuj",
+            "no": "Nie"
+        },
+        "scene": {
+            "edit": "Edytuj scenę",
+            "sceneTitle": "Scena",
+            "color": "Kolor",
+            "synopsis": "Streszczenie",
+            "synopsisPlaceholder": "Napisz krótki opis tej sceny...",
+            "save": "Zapisz"
+        }
+    },
+    "board": {
+        "duplicate": "Duplikuj",
+        "delete": "Usuń",
+        "hints": {
+            "pan": "Środkowy przycisk myszy, aby przesunąć",
+            "select": "Przeciągnij, aby wybrać karty",
+            "create": "Kliknij dwukrotnie, aby utworzyć kartę",
+            "move": "Przytrzymaj Shift, aby swobodnie przenosić"
+        },
+        "untitled": "Bez tytułu",
+        "titlePlaceholder": "Tytuł",
+        "descriptionPlaceholder": "Opis"
     }
 }
diff --git a/messages/zh.json b/messages/zh.json
index dab5759d..2e93441c 100644
--- a/messages/zh.json
+++ b/messages/zh.json
@@ -262,5 +262,63 @@
         "posterHelp": "推荐尺寸：600x900 像素（2:3 比例），支持 PNG、JPG。",
         "saveChanges": "保存更改",
         "dangerZoneTitle": "危险区域"
+    },
+    "contextMenu": {
+        "goToScene": "转到场景",
+        "edit": "编辑",
+        "cut": "剪切",
+        "selectInEditor": "在编辑器中选择",
+        "remove": "移除",
+        "paste": "粘贴",
+        "highlight": "高亮",
+        "addCharacter": "添加角色",
+        "addComment": "添加评论",
+        "searchOnWeb": "在网上搜索"
+    },
+    "popup": {
+        "character": {
+            "create": "创建角色",
+            "edit": "编辑角色",
+            "name": "名字",
+            "gender": "性别",
+            "genderFemale": "女",
+            "genderMale": "男",
+            "genderOther": "其他",
+            "color": "颜色",
+            "synopsis": "简介",
+            "confirm": "确认",
+            "takenNameError": "名为 {newName} 的角色已存在。请选择一个不同的名字或编辑现有角色。",
+            "updateOccurrences": "您确定要将单词 {oldName} 的 {count} 个出现更新为 {newName} 吗？请特别注意更新后可能不受欢迎的常用词。",
+            "yes": "是",
+            "noDoNotChange": "否，不更改"
+        },
+        "import": {
+            "title": "确认导入",
+            "warning": "您确定要<b>覆盖</b>当前项目吗？",
+            "info": "您可以在导入新项目之前导出当前项目。",
+            "yesImport": "是的，导入",
+            "no": "否"
+        },
+        "scene": {
+            "edit": "编辑场景",
+            "sceneTitle": "场景",
+            "color": "颜色",
+            "synopsis": "简介",
+            "synopsisPlaceholder": "写一段关于这个场景的简短描述...",
+            "save": "保存"
+        }
+    },
+    "board": {
+        "duplicate": "复制",
+        "delete": "删除",
+        "hints": {
+            "pan": "中键点击以平移",
+            "select": "拖动以选择卡片",
+            "create": "双击以创建卡片",
+            "move": "按住 Shift 自由移动"
+        },
+        "untitled": "无标题",
+        "titlePlaceholder": "标题",
+        "descriptionPlaceholder": "描述"
     }
 }
diff --git a/src/lib/screenplay/extensions/orphan-prevention-extension.ts b/src/lib/screenplay/extensions/orphan-prevention-extension.ts
index d9e99285..a572dedd 100644
--- a/src/lib/screenplay/extensions/orphan-prevention-extension.ts
+++ b/src/lib/screenplay/extensions/orphan-prevention-extension.ts
@@ -92,7 +92,6 @@ async function computeAndDispatch(view: EditorView, isCancelled: () => boolean,
 
                 // If it's dialogue straddling a page break (actually physically crossing the breaker gap)
                 if (isStraddling && lastNode.classList.contains("dialogue")) {
-                    const nodeRect = lastNode.getBoundingClientRect();
                     const computedStyle = window.getComputedStyle(lastNode);
                     
                     const moreElem = document.createElement("div");
@@ -188,10 +187,10 @@ export const OrphanPreventionExtension = Extension.create<OrphanPreventionExtens
             new Plugin({
                 key: pluginKey,
                 state: {
-                    init: () => ({ decos: DecorationSet.empty }),
+                    init: () => ({ decos: DecorationSet.empty, version: 0 }),
                     apply(tr, old, _, newState) {
                         const meta = tr.getMeta(pluginKey);
-                        if (meta instanceof DecorationSet) return { decos: meta };
+                        if (meta instanceof DecorationSet) return { decos: meta, version: old.version };
                         
                         let nextDecos = old.decos;
                         if (tr.docChanged) {
@@ -199,7 +198,7 @@ export const OrphanPreventionExtension = Extension.create<OrphanPreventionExtens
                         }
                         
                         if (meta === "force-update" || tr.docChanged) {
-                            return { decos: nextDecos };
+                            return { decos: nextDecos, version: old.version + 1 };
                         }
                         
                         return old;
@@ -240,9 +239,11 @@ export const OrphanPreventionExtension = Extension.create<OrphanPreventionExtens
                     schedule();
                     return {
                         update(view, prev) {
+                            const prevPluginState = pluginKey.getState(prev);
+                            const currPluginState = pluginKey.getState(view.state);
                             if (
                                 view.state.doc !== prev.doc ||
-                                pluginKey.getState(view.state) !== pluginKey.getState(prev)
+                                (prevPluginState && currPluginState && prevPluginState.version !== currPluginState.version)
                             ) {
                                 schedule();
                             }