From cc113f15c8756cfa4b4f42a833474495efcbeb3a Mon Sep 17 00:00:00 2001
From: Prozilla <business@prozilla.dev>
Date: Sat, 29 Jul 2023 17:55:19 +0200
Subject: [PATCH] Added unsaved changes indicator for text editor

---
 .../applications/text-editor/TextEditor.jsx   | 25 +++++++++++++++++--
 1 file changed, 23 insertions(+), 2 deletions(-)

diff --git a/src/components/applications/text-editor/TextEditor.jsx b/src/components/applications/text-editor/TextEditor.jsx
index 736cc0e..da29fb9 100644
--- a/src/components/applications/text-editor/TextEditor.jsx
+++ b/src/components/applications/text-editor/TextEditor.jsx
@@ -8,20 +8,25 @@ import { HeaderMenu } from "../.common/HeaderMenu.jsx";
  * @param {Object} props
  * @param {VirtualFile} props.file
  */
-export function TextEditor({ file }) {
+export function TextEditor({ file, setTitle }) {
 	const [currentFile, setCurrentFile] = useState(file);
 	const [content, setContent] = useState(file?.content);
+	const [unsavedChanges, setUnsavedChanges] = useState(false);
 
 	useEffect(() => {
 		setContent(currentFile?.content ?? "");
 	}, [currentFile]);
 
+	useEffect(() => {
+		setTitle(`${currentFile?.id ?? "Untitled"}${unsavedChanges ? "*" : ""} - Text Editor`);
+	}, [currentFile, setTitle, unsavedChanges]);
+
 	const newText = () => {
 		setCurrentFile(null);
 	}
 
 	const saveTextAs = () => {
-
+		setUnsavedChanges(false);
 	}
 
 	const saveText = () => {
@@ -29,13 +34,28 @@ export function TextEditor({ file }) {
 			return saveTextAs();
 
 		currentFile.content = content;
+		setUnsavedChanges(false);
 	}
 
 	const onChange = (event) => {
 		const value = event.target.value;
+
+		if (currentFile != null) {
+			setUnsavedChanges(currentFile.content !== value);
+		} else {
+			setUnsavedChanges(value !== "");
+		}
+
 		return setContent(value);
 	};
 
+	const onKeyDown = (event) => {
+		if (event.key === "s" && event.ctrlKey) {
+			event.preventDefault();
+			saveText();
+		}
+	};
+
 	return (
 		<div className={styles.Container}>
 			<HeaderMenu
@@ -47,6 +67,7 @@ export function TextEditor({ file }) {
 				className={styles.View}
 				value={content}
 				onChange={onChange}
+				onKeyDown={onKeyDown}
 				spellCheck={false}
 				autoComplete="off"
 				autoFocus