From b16690d317382250a6388bb930e19dec9c49014c Mon Sep 17 00:00:00 2001
From: Prozilla <business@prozilla.dev>
Date: Wed, 1 May 2024 17:25:18 +0200
Subject: [PATCH] Improved share modal

---
 .../apps/text-editor/TextEditor.jsx           |  2 ++
 src/components/modals/share/Share.jsx         | 13 +++++++++--
 src/components/modals/share/Share.module.css  | 23 +++++++++++++++++--
 src/components/windows/WindowView.jsx         |  2 +-
 src/hooks/_utils/keyboard.js                  |  1 +
 5 files changed, 36 insertions(+), 5 deletions(-)

diff --git a/src/components/apps/text-editor/TextEditor.jsx b/src/components/apps/text-editor/TextEditor.jsx
index 8271dc9..4ae8776 100644
--- a/src/components/apps/text-editor/TextEditor.jsx
+++ b/src/components/apps/text-editor/TextEditor.jsx
@@ -171,6 +171,8 @@ export function TextEditor({ file, setTitle, setIconUrl, close, mode, app, modal
 						"Zoom In": ["Control", "+"],
 						"Zoom Out": ["Control", "-"],
 						"Reset Zoom": ["Control", "0"],
+						"Edit mode": ["Control v"],
+						"Preview mode": ["Control v"],
 					}
 				}}
 			/>
diff --git a/src/components/modals/share/Share.jsx b/src/components/modals/share/Share.jsx
index e555b8f..7269206 100644
--- a/src/components/modals/share/Share.jsx
+++ b/src/components/modals/share/Share.jsx
@@ -7,6 +7,9 @@ import AppsManager from "../../../features/apps/appsManager.js";
 import utilStyles from "../../../styles/utils.module.css";
 import { Button } from "../../_utils/button/Button.jsx";
 import Option from "./Option.jsx";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faSquare } from "@fortawesome/free-regular-svg-icons";
+import { faSquareCheck } from "@fortawesome/free-solid-svg-icons";
 
 const APP_OPTIONS = {
 	"terminal": [
@@ -94,10 +97,16 @@ export function Share({ modal, params, ...props }) {
 						)}
 					</select>
 				</label>
-				<label className={styles.Label}>
+				{appId !== "" ? <label className={styles.Label}>
 					<p>Fullscreen:</p>
 					<input className={styles.Input} name="fullscreen" type="checkbox" checked={fullscreen} value={fullscreen} onChange={onFullscreenChange}/>
-				</label>
+					<div className={styles.Checkbox}>
+						{fullscreen 
+							? <FontAwesomeIcon icon={faSquareCheck}/>
+							: <FontAwesomeIcon icon={faSquare}/>
+						}
+					</div>
+				</label> : null}
 				{APP_OPTIONS[appId]?.map(({ label, name }) =>
 					<Option key={name} name={name} label={label} setOption={setOption}/>
 				)}
diff --git a/src/components/modals/share/Share.module.css b/src/components/modals/share/Share.module.css
index 3a181b6..670ff12 100644
--- a/src/components/modals/share/Share.module.css
+++ b/src/components/modals/share/Share.module.css
@@ -74,8 +74,27 @@ select.Input > * {
 }
 
 .Input[type=checkbox] {
-	background-color: var(--background-color-b);
-	outline: none;
+	display: none;
+}
+
+.Checkbox {
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	width: 1.25rem;
+	height: 1.25rem;
+	cursor: pointer;
+}
+
+.Checkbox > svg {
+	width: 100%;
+	height: 100%;
+	object-fit: contain;
+	fill: var(--foreground-color-a);
+}
+
+.Checkbox > svg > * {
+	fill: inherit;
 }
 
 .Url {
diff --git a/src/components/windows/WindowView.jsx b/src/components/windows/WindowView.jsx
index 971a412..bade872 100644
--- a/src/components/windows/WindowView.jsx
+++ b/src/components/windows/WindowView.jsx
@@ -73,7 +73,7 @@ export const WindowView = memo(({ id, app, size, position, onInteract, options,
 				close();
 			}}/>
 			<Divider/>
-			<ClickAction label={"Share"} icon={ModalsManager.getModalIconUrl("share")} onTrigger={() => {
+			<ClickAction label={"Share"} icon={ModalsManager.getModalIconUrl("share")} shortcut={["Alt", "s"]} onTrigger={() => {
 				openWindowedModal({
 					appId: app.id,
 					fullscreen: maximized,
diff --git a/src/hooks/_utils/keyboard.js b/src/hooks/_utils/keyboard.js
index e26aa90..1696e03 100644
--- a/src/hooks/_utils/keyboard.js
+++ b/src/hooks/_utils/keyboard.js
@@ -48,6 +48,7 @@ export function useShortcuts({ options, shortcuts, useCategories = true }) {
 					continue;
 
 				event.preventDefault();
+				event.stopPropagation();
 
 				if (!shortcut.includes(event.key) || !allowExecution)
 					continue;