AI somewhat added

2026-06-22 12:37:38 +02:00
parent 571af27f50
commit be5808f3fc
18 changed files with 4428 additions and 3 deletions
@@ -0,0 +1,86 @@
+"use client"
+
+import { useState, useCallback } from "react"
+import { AIChat } from "@/components/ai/ai-chat"
+import { JobSelector } from "@/components/ai/job-selector"
+import { Bot, Lightbulb, Target, MessageSquare } from "lucide-react"
+
+export default function AIAssistantPage() {
+  const [selectedJob, setSelectedJob] = useState<{ job_title: string; keywords: string[]; industry: string; description: string } | null>(null)
+
+  const handleJobSelect = useCallback((job: typeof selectedJob) => {
+    setSelectedJob(job)
+  }, [])
+
+  return (
+    <div className="flex h-[calc(100vh-3.5rem)]">
+      <div className="flex-1 flex flex-col min-w-0">
+        <div className="border-b border-[#2a2a35] px-6 py-4">
+          <div className="flex items-center gap-3">
+            <div className="h-9 w-9 rounded-lg bg-[#1BB0CE]/15 flex items-center justify-center">
+              <Bot className="h-5 w-5 text-[#1BB0CE]" />
+            </div>
+            <div>
+              <h1 className="text-lg font-semibold text-[#e8e8ef]">AI Sales Assistant</h1>
+              <p className="text-xs text-[#6a6a75]">Uncensored sales tips and strategies powered by local AI</p>
+            </div>
+          </div>
+        </div>
+
+        <div className="flex-1 flex">
+          <div className="flex-1 flex flex-col min-w-0 border-r border-[#2a2a35]">
+            <AIChat />
+          </div>
+
+          <div className="w-72 flex-none p-4 space-y-4 overflow-y-auto">
+            <div>
+              <h3 className="text-xs font-semibold text-[#6a6a75] uppercase tracking-wider mb-2 flex items-center gap-1.5">
+                <Target className="h-3.5 w-3.5" />
+                Target Job
+              </h3>
+              <JobSelector onSelect={handleJobSelect} />
+            </div>
+
+            {selectedJob && (
+              <div className="bg-[#1a1a24] border border-[#2a2a35] rounded-lg p-3 space-y-2">
+                <h4 className="text-sm font-medium text-[#e8e8ef]">{selectedJob.job_title}</h4>
+                <div className="flex items-center gap-1.5">
+                  <span className="text-xs px-1.5 py-0.5 rounded bg-[#1BB0CE]/10 text-[#1BB0CE]">{selectedJob.industry}</span>
+                </div>
+                <p className="text-xs text-[#8a8a95]">{selectedJob.description}</p>
+                <div className="flex flex-wrap gap-1">
+                  {selectedJob.keywords.map((kw, i) => (
+                    <span key={i} className="text-xs px-1.5 py-0.5 rounded bg-[#2a2a35] text-[#6a6a75]">
+                      {kw}
+                    </span>
+                  ))}
+                </div>
+              </div>
+            )}
+
+            <div className="bg-[#1a1a24] border border-[#2a2a35] rounded-lg p-3 space-y-2">
+              <h4 className="text-xs font-semibold text-[#6a6a75] uppercase tracking-wider flex items-center gap-1.5">
+                <Lightbulb className="h-3.5 w-3.5" />
+                Tips
+              </h4>
+              <ul className="space-y-1.5 text-xs text-[#8a8a95]">
+                <li className="flex gap-2">
+                  <MessageSquare className="h-3 w-3 mt-0.5 flex-none text-[#1BB0CE]" />
+                  Ask for cold email templates for a specific job
+                </li>
+                <li className="flex gap-2">
+                  <MessageSquare className="h-3 w-3 mt-0.5 flex-none text-[#1BB0CE]" />
+                  Request objection handling tips
+                </li>
+                <li className="flex gap-2">
+                  <MessageSquare className="h-3 w-3 mt-0.5 flex-none text-[#1BB0CE]" />
+                  Ask for outreach strategies per industry
+                </li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}