10d4de5d69
- Show Coming Soon placeholder in production for both widget versions - Widget available in development mode only - Added tests verifying environment-based behavior - Use runtime check for testability (isDevelopment function vs constant) Refs #338 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
86 lines
2.5 KiB
TypeScript
86 lines
2.5 KiB
TypeScript
"use client";
|
|
|
|
import { useState } from "react";
|
|
import { Button } from "@mosaic/ui";
|
|
import { useRouter } from "next/navigation";
|
|
import { ComingSoon } from "@/components/ui/ComingSoon";
|
|
|
|
/**
|
|
* Check if we're in development mode (runtime check for testability)
|
|
*/
|
|
function isDevelopment(): boolean {
|
|
return process.env.NODE_ENV === "development";
|
|
}
|
|
|
|
/**
|
|
* Internal Quick Capture Widget implementation
|
|
*/
|
|
function QuickCaptureWidgetInternal(): React.JSX.Element {
|
|
const [idea, setIdea] = useState("");
|
|
const router = useRouter();
|
|
|
|
const handleSubmit = (e: React.SyntheticEvent<HTMLFormElement>): void => {
|
|
e.preventDefault();
|
|
if (!idea.trim()) return;
|
|
|
|
// TODO: Implement quick capture API call
|
|
// For now, just show a success indicator
|
|
console.log("Quick capture:", idea);
|
|
setIdea("");
|
|
};
|
|
|
|
const goToTasks = (): void => {
|
|
router.push("/tasks");
|
|
};
|
|
|
|
return (
|
|
<div className="bg-white rounded-lg shadow-sm border border-gray-200 p-6">
|
|
<h2 className="text-lg font-semibold text-gray-900 mb-4">Quick Capture</h2>
|
|
<p className="text-sm text-gray-600 mb-4">Quickly jot down ideas or brain dumps</p>
|
|
<form onSubmit={handleSubmit} className="space-y-3">
|
|
<textarea
|
|
value={idea}
|
|
onChange={(e) => {
|
|
setIdea(e.target.value);
|
|
}}
|
|
placeholder="What's on your mind?"
|
|
className="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent resize-none"
|
|
rows={3}
|
|
/>
|
|
<div className="flex gap-2">
|
|
<Button type="submit" variant="primary" size="sm">
|
|
Save Note
|
|
</Button>
|
|
<Button type="button" variant="secondary" size="sm" onClick={goToTasks}>
|
|
Create Task
|
|
</Button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
/**
|
|
* Quick Capture Widget (Dashboard version)
|
|
*
|
|
* In production: Shows Coming Soon placeholder
|
|
* In development: Full widget functionality
|
|
*/
|
|
export function QuickCaptureWidget(): React.JSX.Element {
|
|
// In production, show Coming Soon placeholder
|
|
if (!isDevelopment()) {
|
|
return (
|
|
<div className="bg-white rounded-lg shadow-sm border border-gray-200 p-6">
|
|
<ComingSoon
|
|
feature="Quick Capture"
|
|
description="Quickly jot down ideas for later organization. This feature is currently under development."
|
|
className="!p-0 !min-h-0"
|
|
/>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
// In development, show full widget functionality
|
|
return <QuickCaptureWidgetInternal />;
|
|
}
|