fix: hiding long form tasks and fixing shortcut keys

Kabeer2004 · Kabeer2004 · commit 6671e05e983a · 2025-08-27T02:38:03.000+05:30
diff --git a/src/client/app/settings/page.js b/src/client/app/settings/page.js
@@ -231,12 +231,18 @@ const WhatsAppSettings = () => {
 				WhatsApp Notifications
 			</h2>
 			<p className="text-neutral-400 mb-6">
-				Receive important notifications, task updates, and reminders on WhatsApp.
+				Receive important notifications, task updates, and reminders on
+				WhatsApp.
 			</p>
 			<div className="bg-neutral-900/50 p-6 rounded-2xl border border-neutral-800">
 				<div className="space-y-4">
 					<p className="text-neutral-400 text-sm">
-						Receive important notifications, task updates, and reminders on WhatsApp. We're in the process of getting an official number, so for now, messages will come from our co-founder Sarthak (+91827507823), who may also occasionally reach out for feedback. Please enter your number with the country code.
+						Receive important notifications, task updates, and
+						reminders on WhatsApp. We're in the process of getting
+						an official number, so for now, messages will come from
+						our co-founder Sarthak (+91827507823), who may also
+						occasionally reach out for feedback. Please enter your
+						number with the country code.
 					</p>
 					{isNotifLoading ? (
 						<div className="flex justify-center mt-4">
@@ -324,18 +330,20 @@ const WhatsAppSettings = () => {
 
 const ShortcutsSettings = () => {
 	const shortcuts = {
-		Global: [
-			{ keys: ["Ctrl", "M"], description: "Open Chat" },
-			{ keys: ["Ctrl", "B"], description: "Toggle Notifications" },
-			{ keys: ["Esc"], description: "Close Modal / Chat" },
-			{ keys: ["Ctrl", "K"], description: "Open Command Palette" }
+		General: [
+			{ keys: ["Ctrl", "K"], description: "Open Search" },
+			{
+				keys: ["Ctrl", "Shift", "E"],
+				description: "Toggle Notifications"
+			},
+			{ keys: ["Esc"], description: "Close Modal / Popup" }
 		],
 		Navigation: [
-			{ keys: ["Ctrl", "H"], description: "Go to Chat" },
-			{ keys: ["Ctrl", "J"], description: "Go to Notes" },
-			{ keys: ["Ctrl", "A"], description: "Go to Tasks" },
-			{ keys: ["Ctrl", "I"], description: "Go to Integrations" },
-			{ keys: ["Ctrl", "S"], description: "Go to Settings" }
+			{ keys: ["Ctrl", "Shift", "1"], description: "Go to Chat" },
+			{ keys: ["Ctrl", "Shift", "2"], description: "Go to Tasks" },
+			{ keys: ["Ctrl", "Shift", "3"], description: "Go to Memories" },
+			{ keys: ["Ctrl", "Shift", "4"], description: "Go to Integrations" },
+			{ keys: ["Ctrl", "Shift", "5"], description: "Go to Settings" }
 		]
 	}
 
diff --git a/src/client/components/CommandPallete.js b/src/client/components/CommandPallete.js
@@ -7,7 +7,8 @@ import {
 	IconChecklist,
 	IconPlugConnected,
 	IconAdjustments,
-	IconPlus
+	IconPlus,
+	IconBrain
 } from "@tabler/icons-react"
 import { useRouter } from "next/navigation"
 
@@ -36,25 +37,40 @@ const CommandPalette = ({ open, setOpen }) => {
 			onOpenChange={setOpen}
 			label="Global Command Menu"
 		>
+			{/* The 'label' prop provides the accessible name for the dialog, satisfying accessibility requirements. */}
 			<Command.Input placeholder="Type a command or search..." />
 			<Command.List>
 				<Command.Empty>No results found.</Command.Empty>
 
 				<Command.Group heading="Navigation">
 					<Command.Item
-						onSelect={() =>
-							runCommand(() => router.push("/integrations"))
-						}
+						onSelect={() => runCommand(() => router.push("/chat"))}
 					>
-						<IconPlugConnected className="mr-2 h-4 w-4" />
-						Go to Integrations
+						<IconMessage className="mr-2 h-4 w-4" />
+						Go to Chat
 					</Command.Item>
 					<Command.Item
 						onSelect={() => runCommand(() => router.push("/tasks"))}
 					>
 						<IconChecklist className="mr-2 h-4 w-4" />
 						Go to Tasks
 					</Command.Item>
+					<Command.Item
+						onSelect={() =>
+							runCommand(() => router.push("/memories"))
+						}
+					>
+						<IconBrain className="mr-2 h-4 w-4" />
+						Go to Memories
+					</Command.Item>
+					<Command.Item
+						onSelect={() =>
+							runCommand(() => router.push("/integrations"))
+						}
+					>
+						<IconPlugConnected className="mr-2 h-4 w-4" />
+						Go to Integrations
+					</Command.Item>
 					<Command.Item
 						onSelect={() =>
 							runCommand(() => router.push("/settings"))
@@ -67,15 +83,7 @@ const CommandPalette = ({ open, setOpen }) => {
 
 				<Command.Group heading="Actions">
 					<Command.Item
-						onSelect={() => {
-							runCommand(() => router.push("/tasks?action=add"))
-						}}
-					>
-						<IconMessage className="mr-2 h-4 w-4" />
-						New Chat
-					</Command.Item>
-					<Command.Item
-						onSelect={() => runCommand(() => router.push("/chat"))}
+						onSelect={() => runCommand(() => router.push("/tasks"))}
 					>
 						<IconPlus className="mr-2 h-4 w-4" />
 						New Task
diff --git a/src/client/components/LayoutWrapper.js b/src/client/components/LayoutWrapper.js
@@ -13,7 +13,6 @@ import { AnimatePresence } from "framer-motion"
 import NotificationsOverlay from "@components/NotificationsOverlay"
 import { IconMenu2, IconLoader, IconX } from "@tabler/icons-react"
 import Sidebar from "@components/Sidebar"
-import CommandPalette from "./CommandPallete"
 import GlobalSearch from "./GlobalSearch"
 import { useGlobalShortcuts } from "@hooks/useGlobalShortcuts"
 import { cn } from "@utils/cn"
@@ -47,7 +46,6 @@ export default function LayoutWrapper({ children }) {
 	// ... (keep all your existing state declarations)
 	const [isNotificationsOpen, setNotificationsOpen] = useState(false)
 	const [isSearchOpen, setSearchOpen] = useState(false)
-	const [isCommandPaletteOpen, setCommandPaletteOpen] = useState(false)
 	const [isSidebarCollapsed, setSidebarCollapsed] = useState(true)
 	const [isMobileNavOpen, setMobileNavOpen] = useState(false)
 	const [unreadCount, setUnreadCount] = useState(0)
@@ -158,7 +156,7 @@ export default function LayoutWrapper({ children }) {
 		const checkStatus = async () => {
 			// No need to set isLoading(true) here, it's already true by default.
 			try {
-				const res = await fetch("/api/user/data", {method: "POST"})
+				const res = await fetch("/api/user/data", { method: "POST" })
 				if (!res.ok) throw new Error("Could not verify user status.")
 				const result = await res.json()
 				const data = result?.data || {}
@@ -297,8 +295,10 @@ export default function LayoutWrapper({ children }) {
 		setUnreadCount(0)
 	}, [])
 
-	useGlobalShortcuts(handleNotificationsOpen, () =>
-		setCommandPaletteOpen((prev) => !prev)
+	useGlobalShortcuts(
+		handleNotificationsOpen,
+		() => setSearchOpen(true) // New: Pass search open function
+		// Removed: Command palette toggle is no longer needed
 	)
 
 	// PWA Update Handler
@@ -476,12 +476,6 @@ export default function LayoutWrapper({ children }) {
 					</button>
 				</>
 			)}
-			{showNav && (
-				<CommandPalette
-					open={isCommandPaletteOpen}
-					setOpen={setCommandPaletteOpen}
-				/>
-			)}
 			<div
 				className={cn(
 					"flex-1 transition-[padding-left] duration-300 ease-in-out",
diff --git a/src/client/components/tasks/TaskComposer.js b/src/client/components/tasks/TaskComposer.js
@@ -48,22 +48,22 @@ const tabs = [
 			"For complex projects that require a larger team of AI workers.",
 		icon: <IconUsersGroup size={18} />,
 		isProFeature: true
-	},
-	{
-		id: "long_form",
-		label: "Long-Form",
-		description:
-			"For complex, multi-step tasks that run over an extended period.",
-		icon: <IconClock size={18} />,
-		isProFeature: false // Free feature for now (considered for Pro in future)
 	}
+	// {
+	// 	id: "long_form",
+	// 	label: "Long-Form",
+	// 	description:
+	// 		"For complex, multi-step tasks that run over an extended period.",
+	// 	icon: <IconClock size={18} />,
+	// 	isProFeature: false // Free feature for now (considered for Pro in future)
+	// }
 ]
 
-const longFormPlaceholders = [
-	"Organize my upcoming business trip to New York next week.",
-	"Help me plan and execute a marketing campaign for our new product launch.",
-	"Onboard the new hire, John Doe, by setting up his accounts and sending him the required documents."
-]
+// const longFormPlaceholders = [
+// 	"Organize my upcoming business trip to New York next week.",
+// 	"Help me plan and execute a marketing campaign for our new product launch.",
+// 	"Onboard the new hire, John Doe, by setting up his accounts and sending him the required documents."
+// ]
 
 const oncePlaceholders = [
 	"Draft a follow-up email to the client about the new proposal.",
@@ -392,13 +392,12 @@ const TaskComposer = ({
 										)}
 									>
 										<TextLoop>
-											{(activeTab === "long_form"
-												? longFormPlaceholders
-												: activeTab === "once"
-													? oncePlaceholders
-													: activeTab === "recurring"
-														? recurringPlaceholders
-														: swarmPlaceholders
+											{(activeTab === "once"
+												? // ? longFormPlaceholders
+													oncePlaceholders
+												: activeTab === "recurring"
+													? recurringPlaceholders
+													: swarmPlaceholders
 											).map((p) => (
 												<span key={p}>{p}</span>
 											))}
diff --git a/src/client/hooks/useGlobalShortcuts.js b/src/client/hooks/useGlobalShortcuts.js
@@ -7,12 +7,9 @@ import { usePathname, useRouter } from "next/navigation"
  * Custom hook to manage global keyboard shortcuts.
  * It intelligently adds/removes listeners based on the current route.
  * @param {function} onNotificationsOpen - Callback to open notifications.
- * @param {function} onCommandPaletteToggle - Callback to toggle the command palette.
+ * @param {function} onSearchOpen - Callback to open the global search.
  */
-export function useGlobalShortcuts(
-	onNotificationsOpen,
-	onCommandPaletteToggle
-) {
+export function useGlobalShortcuts(onNotificationsOpen, onSearchOpen) {
 	const router = useRouter()
 	const pathname = usePathname()
 
@@ -21,27 +18,44 @@ export function useGlobalShortcuts(
 
 	const handleKeyDown = useCallback(
 		(e) => {
+			// Use e.code for physical key presses, ignoring layout/shift changes for the key itself
 			if (e.ctrlKey) {
-				switch (e.key.toLowerCase()) {
-					case "t":
-						router.push("/tasks")
-						break
-					case "b":
-						onNotificationsOpen()
-						break
-					case "k":
-						onCommandPaletteToggle()
-						break
-					case "m":
-						router.push("/chat")
-						break
-					default:
-						return
+				if (e.shiftKey) {
+					switch (e.code) {
+						case "Digit1":
+							router.push("/chat")
+							break
+						case "Digit2":
+							router.push("/tasks")
+							break
+						case "Digit3":
+							router.push("/memories")
+							break
+						case "Digit4":
+							router.push("/integrations")
+							break
+						case "Digit5":
+							router.push("/settings")
+							break
+						case "KeyE": // E for Events/Notifications
+							onNotificationsOpen()
+							break
+						default:
+							return
+					}
+				} else {
+					switch (e.code) {
+						case "KeyK": // K for Kommand/Search
+							onSearchOpen()
+							break
+						default:
+							return
+					}
 				}
 				e.preventDefault()
 			}
 		},
-		[router, onNotificationsOpen, onCommandPaletteToggle]
+		[router, onNotificationsOpen, onSearchOpen]
 	)
 
 	useEffect(() => {
