old4ever/local-cal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(components): standardize main component file formatting

Browse Source
This commit is contained in:
Dmytro Stanchiev
2026-04-07 08:10:05 -04:00
parent 954e73c007
commit fd5716f39e
12 changed files with 1002 additions and 846 deletions
Download Patch File Download Diff File Expand all files Collapse all files

148
src/components/ai-toolbar.tsx
View File

@@ -1,80 +1,84 @@
import { Button } from '@/components/ui/button'
import { Textarea } from '@/components/ui/textarea'
import { Card } from '@/components/ui/card'
import { Button } from "@/components/ui/button";
import { Textarea } from "@/components/ui/textarea";
import { Card } from "@/components/ui/card";
interface AIToolbarProps {
isAuthenticated: boolean
isPending: boolean
aiPrompt: string
setAiPrompt: (prompt: string) => void
aiLoading: boolean
onAiCreate: () => void
onAiSummarize: () => void
summary: string | null
summaryUpdated: string | null
isAuthenticated: boolean;
isPending: boolean;
aiPrompt: string;
setAiPrompt: (prompt: string) => void;
aiLoading: boolean;
onAiCreate: () => void;
onAiSummarize: () => void;
summary: string | null;
summaryUpdated: string | null;
}
export const AIToolbar = ({
isAuthenticated,
isPending,
aiPrompt,
setAiPrompt,
aiLoading,
onAiCreate,
onAiSummarize,
summary,
summaryUpdated
isAuthenticated,
isPending,
aiPrompt,
setAiPrompt,
aiLoading,
onAiCreate,
onAiSummarize,
summary,
summaryUpdated,
}: AIToolbarProps) => {
return (
<>
{isPending ? (
<div className='mb-4 p-4 text-center animate-pulse bg-muted'>Loading...</div>
) : (
<div>
{isAuthenticated ? (
<div className="flex flex-col sm:flex-row gap-4 mb-4 items-start">
<div className='w-full'>
<Textarea
className="wrap-anywhere field-sizing-content resize-none w-full min-h-[2.5rem] max-h-64 overflow-y-auto sm:overflow-y-visible px-3 py-2 scroll-p-8 placeholder:italic"
style={{ clipPath: "inset(0 round 1rem)" }}
placeholder='Describe event for AI to create'
value={aiPrompt}
onChange={e => setAiPrompt(e.target.value)}
/>
</div>
<div className='flex flex-row gap-2 pt-1'>
<Button onClick={onAiCreate} disabled={aiLoading}>
{aiLoading ? 'Thinking...' : 'AI Create'}
</Button>
</div>
</div>
) : (
<div className="mb-4 p-4 border border-dashed rounded-lg text-center">
<div className="text-sm text-muted-foreground">
Sign in to unlock natural language event creation powered by AI
</div>
</div>
)}
</div>
)}
return (
<>
{isPending ? (
<div className="mb-4 p-4 text-center animate-pulse bg-muted">
Loading...
</div>
) : (
<div>
{isAuthenticated ? (
<div className="flex flex-col sm:flex-row gap-4 mb-4 items-start">
<div className="w-full">
<Textarea
className="wrap-anywhere field-sizing-content resize-none w-full min-h-[2.5rem] max-h-64 overflow-y-auto sm:overflow-y-visible px-3 py-2 scroll-p-8 placeholder:italic"
style={{ clipPath: "inset(0 round 1rem)" }}
placeholder="Describe event for AI to create"
value={aiPrompt}
onChange={(e) => setAiPrompt(e.target.value)}
/>
</div>
<div className="flex flex-row gap-2 pt-1">
<Button onClick={onAiCreate} disabled={aiLoading}>
{aiLoading ? "Thinking..." : "AI Create"}
</Button>
</div>
</div>
) : (
<div className="mb-4 p-4 border border-dashed rounded-lg text-center">
<div className="text-sm text-muted-foreground">
Sign in to unlock natural language event creation powered by AI
</div>
</div>
)}
</div>
)}
{/* Summary Panel */}
{summary && (
<Card className="p-4 mb-4">
<div className="text-sm mb-1">
Summary updated {summaryUpdated}
</div>
<div>{summary}</div>
</Card>
)}
{/* Summary Panel */}
{summary && (
<Card className="p-4 mb-4">
<div className="text-sm mb-1">Summary updated {summaryUpdated}</div>
<div>{summary}</div>
</Card>
)}
{/* AI Actions Toolbar */}
<p className='text-muted-foreground text-sm pb-2 pl-1'>AI actions</p>
<div className="gap-2 mb-4">
<Button variant="secondary" onClick={onAiSummarize} disabled={aiLoading}>
{aiLoading ? 'Summarizing...' : 'AI Summarize'}
</Button>
</div>
</>
)
}
{/* AI Actions Toolbar */}
<p className="text-muted-foreground text-sm pb-2 pl-1">AI actions</p>
<div className="gap-2 mb-4">
<Button
variant="secondary"
onClick={onAiSummarize}
disabled={aiLoading}
>
{aiLoading ? "Summarizing..." : "AI Summarize"}
</Button>
</div>
</>
);
};