From 5249f9caa01d0dd23ac2635826b06809aacbb303 Mon Sep 17 00:00:00 2001 From: Jason Schrader Date: Mon, 13 Jan 2025 20:14:14 -0700 Subject: [PATCH 01/41] hotfix: remove wrangler.toml --- wrangler.toml | 4 ---- 1 file changed, 4 deletions(-) delete mode 100644 wrangler.toml diff --git a/wrangler.toml b/wrangler.toml deleted file mode 100644 index dc231f63..00000000 --- a/wrangler.toml +++ /dev/null @@ -1,4 +0,0 @@ -name = "aibtcdev-frontend" -compatibility_date = "2024-09-23" -compatibility_flags = ["nodejs_compat"] -pages_build_output_dir = ".vercel/output/static" From 863daebfab538e874682ba51921ab966955b66e7 Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Tue, 14 Jan 2025 10:34:44 +0545 Subject: [PATCH 02/41] fix: seperate thread component --- src/components/threads/CreateThreadButton.tsx | 50 +++++++++++++++++++ src/components/threads/thread-list.tsx | 32 ++---------- 2 files changed, 54 insertions(+), 28 deletions(-) create mode 100644 src/components/threads/CreateThreadButton.tsx diff --git a/src/components/threads/CreateThreadButton.tsx b/src/components/threads/CreateThreadButton.tsx new file mode 100644 index 00000000..a3df6a68 --- /dev/null +++ b/src/components/threads/CreateThreadButton.tsx @@ -0,0 +1,50 @@ +"use client"; + +import { Button } from "@/components/ui/button"; +import { Plus } from "lucide-react"; +import { useThreads } from "@/hooks/use-threads"; +import { useAgents } from "@/hooks/use-agents"; +import { useSessionStore } from "@/store/session"; +import { useChatStore } from "@/store/chat"; +import { useThreadsStore } from "@/store/threads"; + +interface CreateThreadButtonProps { + className?: string; + variant?: "default" | "ghost" | "link"; +} + +export function CreateThreadButton({ + className = "w-full bg-blue-600 hover:bg-blue-500 text-white", + variant = "default", +}: CreateThreadButtonProps) { + const { createThread } = useThreads(); + const { agents } = useAgents(); + const { userId } = useSessionStore(); + const { setActiveThread } = useChatStore(); + + const handleNewThread = async () => { + if (agents.length > 0) { + if (userId) { + const thread = await createThread(userId); + if (thread) { + useThreadsStore.getState().addThread(thread); + setActiveThread(thread.id); + } + } + } else { + alert("Please create an agent first"); + } + }; + + return ( + + ); +} diff --git a/src/components/threads/thread-list.tsx b/src/components/threads/thread-list.tsx index 08b5546f..d95d919f 100644 --- a/src/components/threads/thread-list.tsx +++ b/src/components/threads/thread-list.tsx @@ -1,9 +1,8 @@ "use client"; -import { Button } from "@/components/ui/button"; import { ScrollArea } from "@/components/ui/scroll-area"; -import { Plus, ChevronRight } from "lucide-react"; -import { useThreads } from "@/hooks/use-threads"; +import { Button } from "@/components/ui/button"; +import { ChevronRight } from "lucide-react"; import { useAgents } from "@/hooks/use-agents"; import { format } from "date-fns"; import { useSessionStore } from "@/store/session"; @@ -11,14 +10,13 @@ import { useChatStore } from "@/store/chat"; import { useThreadsStore } from "@/store/threads"; import { useEffect } from "react"; import { useRouter } from "next/navigation"; +import { CreateThreadButton } from "./CreateThreadButton"; export function ThreadList({ setLeftPanelOpen, }: { setLeftPanelOpen?: (open: boolean) => void; }) { - const { createThread } = useThreads(); - const { agents } = useAgents(); const { userId } = useSessionStore(); const { setActiveThread, activeThreadId } = useChatStore(); const { threads, isLoading: loading, fetchThreads } = useThreadsStore(); @@ -31,20 +29,6 @@ export function ThreadList({ } }, [userId, fetchThreads]); - const handleNewThread = async () => { - if (agents.length > 0) { - if (userId) { - const thread = await createThread(userId); - if (thread) { - useThreadsStore.getState().addThread(thread); - setActiveThread(thread.id); - } - } - } else { - alert("Please create an agent first"); - } - }; - const handleThreadClick = (threadId: string) => { if (threadId === activeThreadId) return; setActiveThread(threadId); @@ -56,15 +40,7 @@ export function ThreadList({
{/* New Thread Button */}
- +
{/* Recent Threads */} From 3d8a43ccfc23cf95622b99f5522eaf1b9309159a Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Tue, 14 Jan 2025 10:44:01 +0545 Subject: [PATCH 03/41] fix: change thread to chat --- src/components/chat/chat-window.tsx | 7 +++---- src/components/threads/CreateThreadButton.tsx | 2 +- src/components/threads/thread-list.tsx | 11 ++--------- src/hooks/use-threads.ts | 2 +- 4 files changed, 7 insertions(+), 15 deletions(-) diff --git a/src/components/chat/chat-window.tsx b/src/components/chat/chat-window.tsx index b5ff13f9..457837e8 100644 --- a/src/components/chat/chat-window.tsx +++ b/src/components/chat/chat-window.tsx @@ -23,6 +23,7 @@ import { cn } from "@/lib/utils"; import { ScrollArea } from "@/components/ui/scroll-area"; import { AgentSelector } from "./agent-selector"; import { useAgents } from "@/hooks/use-agents"; +import { CreateThreadButton } from "../threads/CreateThreadButton"; export function ChatWindow() { const { @@ -159,11 +160,9 @@ export function ChatWindow() {

- Select a Thread -

-

- Choose a thread from the sidebar to start chatting + Start a new Chat

+
); diff --git a/src/components/threads/CreateThreadButton.tsx b/src/components/threads/CreateThreadButton.tsx index a3df6a68..6c22df50 100644 --- a/src/components/threads/CreateThreadButton.tsx +++ b/src/components/threads/CreateThreadButton.tsx @@ -44,7 +44,7 @@ export function CreateThreadButton({ disabled={agents.length === 0} > - New Thread + New Chat ); } diff --git a/src/components/threads/thread-list.tsx b/src/components/threads/thread-list.tsx index d95d919f..873053a9 100644 --- a/src/components/threads/thread-list.tsx +++ b/src/components/threads/thread-list.tsx @@ -3,14 +3,12 @@ import { ScrollArea } from "@/components/ui/scroll-area"; import { Button } from "@/components/ui/button"; import { ChevronRight } from "lucide-react"; -import { useAgents } from "@/hooks/use-agents"; import { format } from "date-fns"; import { useSessionStore } from "@/store/session"; import { useChatStore } from "@/store/chat"; import { useThreadsStore } from "@/store/threads"; import { useEffect } from "react"; import { useRouter } from "next/navigation"; -import { CreateThreadButton } from "./CreateThreadButton"; export function ThreadList({ setLeftPanelOpen, @@ -38,16 +36,11 @@ export function ThreadList({ return (
- {/* New Thread Button */} -
- -
- {/* Recent Threads */}

- Recent Threads + Recent Chats

@@ -56,7 +49,7 @@ export function ThreadList({
Loading...
) : threads.length === 0 ? (
- No threads yet + No chats yet
) : ( threads.map((thread) => ( diff --git a/src/hooks/use-threads.ts b/src/hooks/use-threads.ts index 792cb43c..ae389df4 100644 --- a/src/hooks/use-threads.ts +++ b/src/hooks/use-threads.ts @@ -44,7 +44,7 @@ export function useThreads() { .insert([ { profile_id: profileId, - title: "New Thread", + title: "New Chat", }, ]) .select() From 5b1a5f7e09971b62508b7a90138a645b9cdf19b1 Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Tue, 14 Jan 2025 10:55:22 +0545 Subject: [PATCH 04/41] fix: chat window --- src/components/chat/chat-window.tsx | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/src/components/chat/chat-window.tsx b/src/components/chat/chat-window.tsx index 457837e8..e6e78604 100644 --- a/src/components/chat/chat-window.tsx +++ b/src/components/chat/chat-window.tsx @@ -169,8 +169,8 @@ export function ChatWindow() { } return ( -
- {/* Header - Fixed at top */} +
+ {/* Header */}
{!isConnected && ( @@ -251,13 +251,13 @@ export function ChatWindow() {
- {/* Delete Confirmation Dialog */} + {/* Delete Dialog */} - Clear Thread Messages + Clear Chat Messages - Are you sure you want to clear all messages in this thread? This + Are you sure you want to clear all messages in this chat? This action cannot be undone. @@ -276,9 +276,9 @@ export function ChatWindow() { - {/* Message List - Scrollable area */} + {/* Message List */}
- +
{chatError && (
- {/* Input - Fixed at bottom */} -
+ {/* Input */} +
Date: Tue, 14 Jan 2025 10:57:57 +0545 Subject: [PATCH 05/41] fix: remove z-index --- src/components/chat/chat-window.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/chat/chat-window.tsx b/src/components/chat/chat-window.tsx index e6e78604..ee4766ff 100644 --- a/src/components/chat/chat-window.tsx +++ b/src/components/chat/chat-window.tsx @@ -171,7 +171,7 @@ export function ChatWindow() { return (
{/* Header */} -
+
{!isConnected && ( From 330ed482aa00461c42ca0330759f98d7947ab94c Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Tue, 14 Jan 2025 11:06:59 +0545 Subject: [PATCH 06/41] fix: wallet panel in mobile --- src/app/application-layout.tsx | 2 +- src/components/wallet/wallet-panel.tsx | 4 +++- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/src/app/application-layout.tsx b/src/app/application-layout.tsx index 7ab109df..3a88ec8b 100644 --- a/src/app/application-layout.tsx +++ b/src/app/application-layout.tsx @@ -90,7 +90,7 @@ export default function ApplicationLayout({ onClick={() => setRightPanelOpen(!rightPanelOpen)} className="text-zinc-400" > - + Wallet
diff --git a/src/components/wallet/wallet-panel.tsx b/src/components/wallet/wallet-panel.tsx index 1d6240d2..343d11ac 100644 --- a/src/components/wallet/wallet-panel.tsx +++ b/src/components/wallet/wallet-panel.tsx @@ -78,7 +78,9 @@ export function WalletPanel({ onClose }: WalletPanelProps) {

Wallets

- + {onClose && ( - + Select Tools
- +
- + setSearchTerm(e.target.value)} - className="h-8 bg-black/20 border-zinc-800/40 text-sm" + className="h-8 bg-black/20 border-zinc-800/40 text-sm pl-9 w-full" />
@@ -226,21 +226,22 @@ export function AgentForm({ {tools.map((tool) => (
handleToolToggle(tool.id)} + className="mt-1" /> -
+
-

+

{tool.description}

From efb6e89ab94629d66de83fb05ff870a2f433f796 Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Tue, 14 Jan 2025 13:03:06 +0545 Subject: [PATCH 09/41] fix: fix user guide --- src/app/application-layout.tsx | 12 +++-- src/components/chat/chat-window.tsx | 20 +++++-- src/components/reusables/CustomCard.tsx | 6 +-- src/components/reusables/steps.ts | 52 +++++++++++++------ src/components/threads/CreateThreadButton.tsx | 2 +- src/components/wallet/wallet-panel.tsx | 3 +- 6 files changed, 61 insertions(+), 34 deletions(-) diff --git a/src/app/application-layout.tsx b/src/app/application-layout.tsx index 3a88ec8b..1845b363 100644 --- a/src/app/application-layout.tsx +++ b/src/app/application-layout.tsx @@ -26,10 +26,11 @@ interface ApplicationLayoutProps { } const navigation = [ - { name: "Chat", href: "/chat", icon: MessageSquare }, - { name: "Agents", href: "/agents", icon: Users }, - { name: "DAOs", href: "/daos", icon: Boxes }, + { id: "chat", name: "Chat", href: "/chat", icon: MessageSquare }, + { id: "agents", name: "Agents", href: "/agents", icon: Users }, + { id: "daos", name: "DAOs", href: "/daos", icon: Boxes }, { + id: "profile", name: "Profile", href: "/profile", icon: ({ className }: { className?: string }) => ( @@ -138,8 +139,9 @@ export default function ApplicationLayout({ const isActive = pathname === item.href; return ( -
+
{children} diff --git a/src/components/chat/chat-window.tsx b/src/components/chat/chat-window.tsx index ee4766ff..89c07002 100644 --- a/src/components/chat/chat-window.tsx +++ b/src/components/chat/chat-window.tsx @@ -24,6 +24,7 @@ import { ScrollArea } from "@/components/ui/scroll-area"; import { AgentSelector } from "./agent-selector"; import { useAgents } from "@/hooks/use-agents"; import { CreateThreadButton } from "../threads/CreateThreadButton"; +import { useNextStep } from "nextstepjs"; export function ChatWindow() { const { @@ -107,6 +108,12 @@ export function ChatWindow() { } }; + const { startNextStep } = useNextStep(); + + const handleStartMainTour = () => { + startNextStep("mainTour"); + }; + if (!accessToken) { return (
@@ -158,11 +165,14 @@ export function ChatWindow() { if (!activeThreadId) { return (
-
-

- Start a new Chat -

- +
+ {/* Adjust button size and spacing for different screen sizes */} +
+ +
+
+ +
); diff --git a/src/components/reusables/CustomCard.tsx b/src/components/reusables/CustomCard.tsx index bc41e2c2..45a1c941 100644 --- a/src/components/reusables/CustomCard.tsx +++ b/src/components/reusables/CustomCard.tsx @@ -46,11 +46,7 @@ const CustomCard: React.FC = ({
)} - {step.showSkip && ( - - )} + {step.showSkip && } ); diff --git a/src/components/reusables/steps.ts b/src/components/reusables/steps.ts index 58381785..14eb412d 100644 --- a/src/components/reusables/steps.ts +++ b/src/components/reusables/steps.ts @@ -7,52 +7,70 @@ export const tourSteps: Tour[] = [ { icon: "👋", title: "Welcome to AIBTC.DEV.", - content: "I'm your guide to help you get started..", + content: "I'll guide your through the basics to get started. Let's dive in!", selector: "#step1", //now you can assign any component this id and it will guide you to this step... side: "bottom", //position where you want to show the guide card showControls: true, //default showSkip: true, //default }, { - icon: "💬", - title: "Threads", - content: "It consist your threads which is basically a chat history", + icon: "", + title: "Chats 💬", + content: "All your past conversations lives here.", selector: "#step2", side: "right", showControls: true, showSkip: true, }, { - icon: "💬", - title: "Add thread", - content: "You can add new thread by clicking this button and start a chat.", + icon: "", + title: "Start a new chat 💬", + content: "You can start a new chat from here.", selector: "#step3", side: "right", showControls: true, showSkip: true, }, { - icon: "🧭", - title: "Navigations", - content: "You can create agents, DAOs and go to your profile from here..", - selector: "#step4", + icon: "", + title: "Agents 🤖", + content: "View, manage and assign tasks to your AI agents.", + selector: "#agents", side: "right", showControls: true, showSkip: true, }, { - icon: "👜", - title: "Wallet", - content: "These is your personal wallet.", + icon: "", + title: "DAOs 🏛️", + content: "Explore and participate in decentralized organizations.", + selector: "#daos", + side: "right", + showControls: true, + showSkip: true, + }, + { + icon: "", + title: "Profile 🥷🏻", + content: "Manage your account settings and personal details.", + selector: "#profile", + side: "right", + showControls: true, + showSkip: true, + }, + { + icon: "", + title: "Wallet 🔒", + content: "This is your personal wallet.", selector: "#step5", side: "right", showControls: true, showSkip: true, }, { - icon: "🤖", - title: "Agent Wallets", - content: "These are your agent wallets. You can fund them by copying their address and sending stx to them..", + icon: "", + title: "Agent Wallets 🤖", + content: "These are your agent wallets.", selector: "#step6", side: "left", showControls: true, diff --git a/src/components/threads/CreateThreadButton.tsx b/src/components/threads/CreateThreadButton.tsx index 6c22df50..4f65294b 100644 --- a/src/components/threads/CreateThreadButton.tsx +++ b/src/components/threads/CreateThreadButton.tsx @@ -43,7 +43,7 @@ export function CreateThreadButton({ onClick={handleNewThread} disabled={agents.length === 0} > - + {/* */} New Chat ); diff --git a/src/components/wallet/wallet-panel.tsx b/src/components/wallet/wallet-panel.tsx index 351c1a58..3f3bec3a 100644 --- a/src/components/wallet/wallet-panel.tsx +++ b/src/components/wallet/wallet-panel.tsx @@ -89,7 +89,8 @@ export function WalletPanel({ onClose }: WalletPanelProps) {

Wallets

- {onClose && ( From f6d8da22abdaeab04a0d012f8bdfd06c72480671 Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Tue, 14 Jan 2025 15:35:32 +0545 Subject: [PATCH 10/41] fix: show guide to new user only --- src/components/chat/chat-window.tsx | 12 +---- src/components/reusables/CustomCard.tsx | 29 +++++++++- src/components/reusables/StartGuide.tsx | 30 +++++++++++ src/hooks/use-guide.ts | 70 +++++++++++++++++++++++++ 4 files changed, 129 insertions(+), 12 deletions(-) create mode 100644 src/components/reusables/StartGuide.tsx create mode 100644 src/hooks/use-guide.ts diff --git a/src/components/chat/chat-window.tsx b/src/components/chat/chat-window.tsx index 89c07002..bc67944e 100644 --- a/src/components/chat/chat-window.tsx +++ b/src/components/chat/chat-window.tsx @@ -24,7 +24,7 @@ import { ScrollArea } from "@/components/ui/scroll-area"; import { AgentSelector } from "./agent-selector"; import { useAgents } from "@/hooks/use-agents"; import { CreateThreadButton } from "../threads/CreateThreadButton"; -import { useNextStep } from "nextstepjs"; +import { StartGuide } from "../reusables/StartGuide"; export function ChatWindow() { const { @@ -108,12 +108,6 @@ export function ChatWindow() { } }; - const { startNextStep } = useNextStep(); - - const handleStartMainTour = () => { - startNextStep("mainTour"); - }; - if (!accessToken) { return (
@@ -169,9 +163,7 @@ export function ChatWindow() { {/* Adjust button size and spacing for different screen sizes */}
-
-
- +
diff --git a/src/components/reusables/CustomCard.tsx b/src/components/reusables/CustomCard.tsx index 45a1c941..bc08609a 100644 --- a/src/components/reusables/CustomCard.tsx +++ b/src/components/reusables/CustomCard.tsx @@ -9,6 +9,7 @@ import { CardTitle, } from "@/components/ui/card"; import { Button } from "@/components/ui/button"; +import { useGuide } from "@/hooks/use-guide"; const CustomCard: React.FC = ({ step, @@ -19,6 +20,24 @@ const CustomCard: React.FC = ({ skipTour, arrow, }) => { + const { updateGuideCompletion } = useGuide(); + + const handleFinish = async () => { + console.log("Finishing guide..."); + await updateGuideCompletion(); + console.log("Guide completion updated, moving to next step"); + nextStep(); + }; + + const handleSkip = async () => { + console.log("Skipping guide..."); + await updateGuideCompletion(); + console.log("Guide completion updated, skipping tour"); + if (skipTour) { + skipTour(); + } + }; + return ( @@ -41,12 +60,18 @@ const CustomCard: React.FC = ({ > Previous -
)} - {step.showSkip && } + {step.showSkip && skipTour && ( + + )} ); diff --git a/src/components/reusables/StartGuide.tsx b/src/components/reusables/StartGuide.tsx new file mode 100644 index 00000000..237eda89 --- /dev/null +++ b/src/components/reusables/StartGuide.tsx @@ -0,0 +1,30 @@ +"use client"; + +import { Button } from "@/components/ui/button"; +import { useNextStep } from "nextstepjs"; +import { useGuide } from "@/hooks/use-guide"; + +export function StartGuide() { + const { startNextStep } = useNextStep(); + const { hasCompletedGuide, loading } = useGuide(); + + const handleStartMainTour = () => { + startNextStep("mainTour"); + }; + + // Don't render anything while loading + if (loading) { + return null; + } + + // Don't render if guide is completed + if (hasCompletedGuide) { + return null; + } + + return ( +
+ +
+ ); +} diff --git a/src/hooks/use-guide.ts b/src/hooks/use-guide.ts new file mode 100644 index 00000000..34ab71ee --- /dev/null +++ b/src/hooks/use-guide.ts @@ -0,0 +1,70 @@ +import { useState, useEffect } from "react"; +import { supabase } from "@/utils/supabase/client"; + +export function useGuide() { + const [hasCompletedGuide, setHasCompletedGuide] = useState(false); + const [loading, setLoading] = useState(true); + + useEffect(() => { + checkGuideCompletion(); + }, []); + + async function checkGuideCompletion() { + try { + const { data: { user } } = await supabase.auth.getUser(); + console.log("Current user:", user); + + if (user) { + const { data, error } = await supabase + .from("profiles") + .select("has_completed_guide") + .eq("id", user.id) + .single(); + + if (error) { + console.error("Error fetching guide completion status:", error); + return; + } + + console.log("Guide completion data:", data); + setHasCompletedGuide(data?.has_completed_guide || false); + } else { + console.log("No user found during check"); + } + } catch (error) { + console.error("Error in checkGuideCompletion:", error); + } finally { + setLoading(false); + } + } + + async function updateGuideCompletion() { + try { + const { data: { user } } = await supabase.auth.getUser(); + console.log("Updating guide completion for user:", user); + + if (!user) { + console.error("No user found during update"); + return; + } + + const { data, error } = await supabase + .from("profiles") + .update({ has_completed_guide: true }) + .eq("id", user.id) + .select(); + + if (error) { + console.error("Error updating guide completion:", error); + throw error; + } + + console.log("Update result:", data); + setHasCompletedGuide(true); + } catch (error) { + console.error("Error in updateGuideCompletion:", error); + } + } + + return { hasCompletedGuide, loading, updateGuideCompletion }; +} From b3e50d52921325ae16dcadfb8142250dab6ce7ea Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Tue, 14 Jan 2025 15:37:13 +0545 Subject: [PATCH 11/41] fix: remove unused vars --- src/components/threads/CreateThreadButton.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/threads/CreateThreadButton.tsx b/src/components/threads/CreateThreadButton.tsx index 4f65294b..4d69b5e5 100644 --- a/src/components/threads/CreateThreadButton.tsx +++ b/src/components/threads/CreateThreadButton.tsx @@ -1,7 +1,6 @@ "use client"; import { Button } from "@/components/ui/button"; -import { Plus } from "lucide-react"; import { useThreads } from "@/hooks/use-threads"; import { useAgents } from "@/hooks/use-agents"; import { useSessionStore } from "@/store/session"; From fe82e8487f6c94fe547c189691b4884c571bd531 Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Tue, 14 Jan 2025 15:39:53 +0545 Subject: [PATCH 12/41] fix: show guide in desktop only --- src/components/chat/chat-window.tsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/components/chat/chat-window.tsx b/src/components/chat/chat-window.tsx index bc67944e..c2534071 100644 --- a/src/components/chat/chat-window.tsx +++ b/src/components/chat/chat-window.tsx @@ -161,9 +161,11 @@ export function ChatWindow() {
{/* Adjust button size and spacing for different screen sizes */} -
+
- +
+ +
From 3a399b7c10ec0ae24c43ca3e5116b0b146ba9b17 Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Tue, 14 Jan 2025 15:43:02 +0545 Subject: [PATCH 13/41] fix: remove duplicates --- src/components/wallet/wallet-panel.tsx | 11 ----------- 1 file changed, 11 deletions(-) diff --git a/src/components/wallet/wallet-panel.tsx b/src/components/wallet/wallet-panel.tsx index 3f3bec3a..f435a02e 100644 --- a/src/components/wallet/wallet-panel.tsx +++ b/src/components/wallet/wallet-panel.tsx @@ -7,7 +7,6 @@ import { Copy, Check, X, Wallet as WalletIcon } from "lucide-react"; import { useWalletStore } from "@/store/wallet"; import { useSessionStore } from "@/store/session"; import { Avatar, AvatarImage, AvatarFallback } from "@/components/ui/avatar"; -import { useNextStep } from "nextstepjs"; import { useToast } from "@/hooks/use-toast"; import dynamic from "next/dynamic"; import type { Wallet, Agent } from "@/types/supabase"; @@ -67,12 +66,6 @@ export function WalletPanel({ onClose }: WalletPanelProps) { (wallet) => !wallet.agent?.is_archived ); - const { startNextStep } = useNextStep(); - - const handleStartMainTour = () => { - startNextStep("mainTour"); - }; - const handleAmountChange = (address: string, value: string) => { if (value === "" || /^\d*\.?\d*$/.test(value)) { setStxAmounts((prev) => ({ ...prev, [address]: value })); @@ -89,10 +82,6 @@ export function WalletPanel({ onClose }: WalletPanelProps) {

Wallets

- {/* ADD md:block to display it. HIDDEN FOR NOW..... */} - {onClose && (
{/* Active Agents */} -
+
{activeAgents.map((agent) => ( -
+
{agent.name}
-
-

{agent.name}

+
+

{agent.name}

- {/* {agent.goal || agent.role} */} + {agent.goal || agent.role}

@@ -81,26 +81,26 @@ export default function AgentsPage() { Archived Agents
-
+
{archivedAgents.map((agent) => ( -
+
{agent.name}
-
-
-

{agent.name}

+
+
+

{agent.name}

Archived From 449b691ab0940ce87020c52f50c76cf752f4b303 Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Tue, 14 Jan 2025 15:54:58 +0545 Subject: [PATCH 16/41] fix: comment out /chat route --- src/app/application-layout.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/app/application-layout.tsx b/src/app/application-layout.tsx index 1845b363..c2b40a06 100644 --- a/src/app/application-layout.tsx +++ b/src/app/application-layout.tsx @@ -6,7 +6,7 @@ import { usePathname } from "next/navigation"; import { cn } from "@/lib/utils"; import { Users, - MessageSquare, + // MessageSquare, Boxes, Menu, Wallet, @@ -26,7 +26,8 @@ interface ApplicationLayoutProps { } const navigation = [ - { id: "chat", name: "Chat", href: "/chat", icon: MessageSquare }, + // COMMENTING THIS OUT SINCE WE NO LONGER NEED IT..... + // { id: "chat", name: "Chat", href: "/chat", icon: MessageSquare }, { id: "agents", name: "Agents", href: "/agents", icon: Users }, { id: "daos", name: "DAOs", href: "/daos", icon: Boxes }, { From 9a2768ca0791d6de183e2b0e13aec2a4b36fe673 Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Tue, 14 Jan 2025 15:58:10 +0545 Subject: [PATCH 17/41] fix: add brand logo --- src/app/application-layout.tsx | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) diff --git a/src/app/application-layout.tsx b/src/app/application-layout.tsx index c2b40a06..9e23ad82 100644 --- a/src/app/application-layout.tsx +++ b/src/app/application-layout.tsx @@ -84,7 +84,12 @@ export default function ApplicationLayout({ width={20} height={20} /> - AIBTCDEV + AIBTCDEV

Create Your First AI Agent

- To start chatting, you will need to create at least one AI agent. - Agents are AI assistants that you can customize with specific roles - and capabilities. + To start chatting, you will need to create at an AI agent. Customize + it with roles, backstory and capabilities.

From ab0dea6951d86953d7c01faf48f833379556c8b7 Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Tue, 14 Jan 2025 18:38:47 +0545 Subject: [PATCH 23/41] fix: remove empty div --- src/app/application-layout.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/app/application-layout.tsx b/src/app/application-layout.tsx index 6427e903..418af39a 100644 --- a/src/app/application-layout.tsx +++ b/src/app/application-layout.tsx @@ -178,7 +178,6 @@ export default function ApplicationLayout({ {/* Main Content */}
-
{children}
From 554906b5bb070459807299a11ed32dfab74879cd Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Tue, 14 Jan 2025 18:41:28 +0545 Subject: [PATCH 24/41] fix: cleanups --- src/components/reusables/steps.ts | 2 +- src/components/wallet/stacks-component.tsx | 6 +++++- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/src/components/reusables/steps.ts b/src/components/reusables/steps.ts index d69769af..6bbd8946 100644 --- a/src/components/reusables/steps.ts +++ b/src/components/reusables/steps.ts @@ -7,7 +7,7 @@ export const tourSteps: Tour[] = [ { icon: "", title: "Welcome to AIBTC.DEV. 👋", - content: "I'll guide your through the basics to get started. Let's dive in!", + content: "I'll guide you through the basics to get started. Let's dive in!", selector: "#step1", //now you can assign any component this id and it will guide you to this step... side: "bottom", //position where you want to show the guide card showControls: true, //default diff --git a/src/components/wallet/stacks-component.tsx b/src/components/wallet/stacks-component.tsx index d8abdf07..8d82c3a2 100644 --- a/src/components/wallet/stacks-component.tsx +++ b/src/components/wallet/stacks-component.tsx @@ -34,7 +34,11 @@ export default function StacksComponents({ network: network, onFinish: (data) => { const explorerUrl = `https://explorer.stacks.co/txid/${data.txId}`; - onToast("Success", "Fund will appear soon.", "default"); + onToast( + "Success", + "Transfer sent to agent, funds will arrive soon.", + "default" + ); return { txId: data.txId, explorerUrl: explorerUrl, From b02bf555d636fc62518024dbdfc6989c88d69200 Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Tue, 14 Jan 2025 18:42:20 +0545 Subject: [PATCH 25/41] fix: cleanups --- src/components/reusables/steps.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/reusables/steps.ts b/src/components/reusables/steps.ts index 6bbd8946..98680a0a 100644 --- a/src/components/reusables/steps.ts +++ b/src/components/reusables/steps.ts @@ -60,7 +60,7 @@ export const tourSteps: Tour[] = [ }, { icon: "", - title: "Wallet 🔒", + title: "Assistant Wallet 🔒", content: "This is your connected wallet.", selector: "#step5", side: "right", From 90f2f5ee8e445077db7f74f56adf3923b52b5fbd Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Tue, 14 Jan 2025 18:54:08 +0545 Subject: [PATCH 26/41] fix: update layout --- src/app/application-layout.tsx | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/src/app/application-layout.tsx b/src/app/application-layout.tsx index 418af39a..68f1f676 100644 --- a/src/app/application-layout.tsx +++ b/src/app/application-layout.tsx @@ -134,6 +134,10 @@ export default function ApplicationLayout({ {/* Navigation */}
+ {/* Thread List */} +
+ +
- {/* Thread List */} -
- -
- {/* Sign Out Button */}
); +export const getRandomImageUrl = () => { + const randomNum = Math.floor(Math.random() * 25); // 0 to 24 + const imageName = `aibtcdev_pattern_1_tiles_${randomNum}.jpg`; + return `${ + supabase.storage.from("agent-image").getPublicUrl(imageName).data.publicUrl + }`; +}; + export default function NewAgentPage() { const router = useRouter(); const { userId } = useSessionStore(); @@ -62,17 +70,9 @@ export default function NewAgentPage() { const handleSubmit = async (e: React.FormEvent) => { e.preventDefault(); - // Create combined name for image URL only - const imageUrlName = `${agent.name}_${ - process.env.NEXT_PUBLIC_STACKS_NETWORK === "mainnet" - ? stxAddresses.mainnet - : stxAddresses.testnet - }`; const updatedAgent = { ...agent, - image_url: `https://bitcoinfaces.xyz/api/get-image?name=${encodeURIComponent( - imageUrlName - )}`, + image_url: getRandomImageUrl(), }; setSaving(true); diff --git a/src/app/agents/page.tsx b/src/app/agents/page.tsx index c3bb746a..1bbd19e9 100644 --- a/src/app/agents/page.tsx +++ b/src/app/agents/page.tsx @@ -5,7 +5,6 @@ import { Button } from "@/components/ui/button"; import { Plus, Archive } from "lucide-react"; import { Heading } from "@/components/ui/heading"; import { useAgentsList } from "@/hooks/use-agents-list"; -import Image from "next/image"; import { useState } from "react"; import { cn } from "@/lib/utils"; @@ -53,15 +52,21 @@ export default function AgentsPage() { key={agent.id} className="group flex items-center p-4 bg-card hover:bg-muted transition-colors duration-200 rounded-lg" > -
- {agent.name} +
+
+ + {agent.name ? agent.name.charAt(0).toUpperCase() : "?"} + +

{agent.name}

@@ -88,15 +93,21 @@ export default function AgentsPage() { key={agent.id} className="group flex items-center p-4 bg-card hover:bg-muted transition-colors duration-200 rounded-lg opacity-75 hover:opacity-100" > -
- {agent.name} +
+
+ + {agent.name ? agent.name.charAt(0).toUpperCase() : "?"} + +
diff --git a/src/components/agents/agent-details-panel.tsx b/src/components/agents/agent-details-panel.tsx index b1768723..9ff9c04c 100644 --- a/src/components/agents/agent-details-panel.tsx +++ b/src/components/agents/agent-details-panel.tsx @@ -2,7 +2,6 @@ import { Settings } from "lucide-react"; import { Button } from "@/components/ui/button"; import { Agent } from "@/types/supabase"; import { useRouter } from "next/navigation"; -import Image from "next/image"; import { cn } from "@/lib/utils"; import { useWalletStore } from "@/store/wallet"; import { Copy, Check } from "lucide-react"; @@ -74,17 +73,19 @@ export function AgentDetailsPanel({ agent }: AgentDetailsPanelProps) { "w-40 h-40 sm:w-full sm:h-auto sm:aspect-square mx-auto overflow-hidden rounded-2xl border border-zinc-800/40 bg-zinc-900/50 relative", agent.is_archived && "grayscale" )} + style={{ + backgroundImage: `url(${ + agent.image_url || "/placeholder-agent.png" + })`, + backgroundSize: "cover", + backgroundPosition: "center", + }} > - {agent.name} { - e.currentTarget.src = `https://avatar.vercel.sh/${agent.name}`; - }} - /> +
+ + {agent.name ? agent.name.charAt(0).toUpperCase() : "?"} + +

diff --git a/src/components/wallet/wallet-panel.tsx b/src/components/wallet/wallet-panel.tsx index f435a02e..8ada2cb6 100644 --- a/src/components/wallet/wallet-panel.tsx +++ b/src/components/wallet/wallet-panel.tsx @@ -6,7 +6,6 @@ import { Button } from "@/components/ui/button"; import { Copy, Check, X, Wallet as WalletIcon } from "lucide-react"; import { useWalletStore } from "@/store/wallet"; import { useSessionStore } from "@/store/session"; -import { Avatar, AvatarImage, AvatarFallback } from "@/components/ui/avatar"; import { useToast } from "@/hooks/use-toast"; import dynamic from "next/dynamic"; import type { Wallet, Agent } from "@/types/supabase"; @@ -211,14 +210,22 @@ export function WalletPanel({ onClose }: WalletPanelProps) { className="bg-zinc-800/50 rounded-lg p-4 space-y-3 mt-3" >
- - - - {wallet.agent?.name?.[0]?.toUpperCase() || "A"} - - +
+
+
+ + {wallet.agent?.name?.[0]?.toUpperCase() || "A"} + +
+
+
{wallet.agent?.name || "Agent"} From 17ac77689e9fffcc1da5025bc41145979b918b1a Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Tue, 14 Jan 2025 23:39:03 +0545 Subject: [PATCH 31/41] fix: build errors --- src/app/agents/[id]/edit/page.tsx | 2 +- src/app/agents/new/page.tsx | 33 ++----------------------------- src/lib/generate-image.ts | 8 ++++++++ 3 files changed, 11 insertions(+), 32 deletions(-) create mode 100644 src/lib/generate-image.ts diff --git a/src/app/agents/[id]/edit/page.tsx b/src/app/agents/[id]/edit/page.tsx index 75242bfd..22d335d2 100644 --- a/src/app/agents/[id]/edit/page.tsx +++ b/src/app/agents/[id]/edit/page.tsx @@ -6,7 +6,7 @@ import { AgentForm } from "@/components/agents/agent-form"; import { Agent } from "@/types/supabase"; import { supabase } from "@/utils/supabase/client"; import { useSessionStore } from "@/store/session"; -import { getRandomImageUrl } from "../../new/page"; +import { getRandomImageUrl } from "@/lib/generate-image"; export const runtime = "edge"; diff --git a/src/app/agents/new/page.tsx b/src/app/agents/new/page.tsx index 852e8604..1ec0c25f 100644 --- a/src/app/agents/new/page.tsx +++ b/src/app/agents/new/page.tsx @@ -1,12 +1,13 @@ "use client"; -import { useState, useEffect } from "react"; +import { useState } from "react"; import { useRouter } from "next/navigation"; import { AgentForm } from "@/components/agents/agent-form"; import { Agent } from "@/types/supabase"; import { supabase } from "@/utils/supabase/client"; import { useSessionStore } from "@/store/session"; import { useWalletStore } from "@/store/wallet"; +import { getRandomImageUrl } from "@/lib/generate-image"; // Loading Modal Component const LoadingModal = () => ( @@ -20,22 +21,10 @@ const LoadingModal = () => (
); -export const getRandomImageUrl = () => { - const randomNum = Math.floor(Math.random() * 25); // 0 to 24 - const imageName = `aibtcdev_pattern_1_tiles_${randomNum}.jpg`; - return `${ - supabase.storage.from("agent-image").getPublicUrl(imageName).data.publicUrl - }`; -}; - export default function NewAgentPage() { const router = useRouter(); const { userId } = useSessionStore(); const fetchWallets = useWalletStore((state) => state.fetchWallets); - const [stxAddresses, setStxAddresses] = useState<{ - testnet: string; - mainnet: string; - }>({ testnet: "", mainnet: "" }); const [agent, setAgent] = useState>({ name: "", @@ -49,24 +38,6 @@ export default function NewAgentPage() { const [saving, setSaving] = useState(false); const [showLoadingModal, setShowLoadingModal] = useState(false); - useEffect(() => { - try { - const blockstackSession = localStorage.getItem("blockstack-session"); - if (blockstackSession) { - const sessionData = JSON.parse(blockstackSession); - const addresses = sessionData?.userData?.profile?.stxAddress; - if (addresses) { - setStxAddresses({ - testnet: addresses.testnet, - mainnet: addresses.mainnet, - }); - } - } - } catch (error) { - console.error("Error reading blockstack session:", error); - } - }, []); - const handleSubmit = async (e: React.FormEvent) => { e.preventDefault(); diff --git a/src/lib/generate-image.ts b/src/lib/generate-image.ts new file mode 100644 index 00000000..ef8cc5b9 --- /dev/null +++ b/src/lib/generate-image.ts @@ -0,0 +1,8 @@ +import { supabase } from "@/utils/supabase/client"; + +export const getRandomImageUrl = () => { + const randomNum = Math.floor(Math.random() * 25); // 0 to 24 + const imageName = `aibtcdev_pattern_1_tiles_${randomNum}.jpg`; + return `${supabase.storage.from("agent-image").getPublicUrl(imageName).data.publicUrl + }`; +}; \ No newline at end of file From d74c1ce3ae22b14389bc97408dc80f7acc8a76b0 Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Tue, 14 Jan 2025 23:47:31 +0545 Subject: [PATCH 32/41] fix: update image in agent selector too --- src/components/chat/agent-selector.tsx | 96 ++++++++++---------------- 1 file changed, 38 insertions(+), 58 deletions(-) diff --git a/src/components/chat/agent-selector.tsx b/src/components/chat/agent-selector.tsx index a8689005..d555c9f5 100644 --- a/src/components/chat/agent-selector.tsx +++ b/src/components/chat/agent-selector.tsx @@ -63,6 +63,37 @@ export function AgentSelector({ (agent) => agent.id === internalSelectedId ); + const AgentImage = ({ + agent, + className = "", + }: { + agent?: any; + className?: string; + }) => ( +
+
+ {agent?.name +
+ + {agent?.name ? agent.name.charAt(0).toUpperCase() : "A"} + +
+
+
+ ); + if (loading) { return (
@@ -83,69 +114,24 @@ export function AgentSelector({ data-shape="circle" className="group h-11 w-11 rounded-full p-0 border-0 bg-background/50 backdrop-blur-sm hover:bg-background/80 transition-colors duration-200 [&>span]:!p-0 [&>svg]:hidden" > - -
- AI BTC Dev -
-
- } - > + }> {selectedAgent ? ( selectedAgent.image_url ? ( -
-
- {selectedAgent.name} -
-
+ ) : (
) ) : ( -
-
- AI BTC Dev -
-
+ )}
-
- AI BTC Dev -
+ Assistant @@ -155,15 +141,7 @@ export function AgentSelector({
{agent.image_url ? ( -
- {agent.name} -
+ ) : (
@@ -179,3 +157,5 @@ export function AgentSelector({ ); } + +export default AgentSelector; From 614d607b55c7eba2380aa6e7c5b81e694bbd73b1 Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Tue, 14 Jan 2025 23:51:42 +0545 Subject: [PATCH 33/41] fix: more fixups --- src/components/chat/agent-selector.tsx | 51 +++++++++++++++----------- 1 file changed, 29 insertions(+), 22 deletions(-) diff --git a/src/components/chat/agent-selector.tsx b/src/components/chat/agent-selector.tsx index d555c9f5..48b47ab1 100644 --- a/src/components/chat/agent-selector.tsx +++ b/src/components/chat/agent-selector.tsx @@ -69,30 +69,37 @@ export function AgentSelector({ }: { agent?: any; className?: string; - }) => ( -
-
- {agent?.name -
- - {agent?.name ? agent.name.charAt(0).toUpperCase() : "A"} - + }) => { + const shouldShowOverlay = + agent?.name && agent.name.toLowerCase() !== "assistant"; + + return ( +
+
+ {agent?.name + {shouldShowOverlay && ( +
+ + {agent.name.charAt(0).toUpperCase()} + +
+ )}
-
- ); + ); + }; if (loading) { return ( From 8cd251f1d1309ca042378abee7c793382736f90f Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Tue, 14 Jan 2025 23:55:09 +0545 Subject: [PATCH 34/41] fix: image for chat bubble --- src/components/chat/chat-message-bubble.tsx | 38 +++++++++++++++------ 1 file changed, 27 insertions(+), 11 deletions(-) diff --git a/src/components/chat/chat-message-bubble.tsx b/src/components/chat/chat-message-bubble.tsx index e74b46fc..fe22b422 100644 --- a/src/components/chat/chat-message-bubble.tsx +++ b/src/components/chat/chat-message-bubble.tsx @@ -12,6 +12,32 @@ export function ChatMessageBubble({ message }: { message: Message }) { message.role === "assistant" ? message.agent_id : null ); + const AgentAvatar = () => { + const shouldShowOverlay = + agent?.name && agent.name.toLowerCase() !== "assistant"; + + return ( + + + + AI BTC Dev + + {shouldShowOverlay && ( +
+ + {agent.name.charAt(0).toUpperCase()} + +
+ )} + + ); + }; + return (
) : ( - - - - AI BTC Dev - - + )}
From 6b5aa217403ff4da8a5b4d2db28d7b1e7f3caba3 Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Wed, 15 Jan 2025 00:01:02 +0545 Subject: [PATCH 35/41] fix: type --- src/components/chat/agent-selector.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/chat/agent-selector.tsx b/src/components/chat/agent-selector.tsx index 48b47ab1..e654d26e 100644 --- a/src/components/chat/agent-selector.tsx +++ b/src/components/chat/agent-selector.tsx @@ -11,6 +11,7 @@ import { SelectTrigger, SelectValue, } from "@/components/ui/select"; +import { Agent } from "@/types/supabase"; interface AgentSelectorProps { selectedAgentId: string | null; @@ -67,7 +68,7 @@ export function AgentSelector({ agent, className = "", }: { - agent?: any; + agent?: Agent; className?: string; }) => { const shouldShowOverlay = From c6c6a5d685eb43727e43e0d9b6f3bf912b70c1de Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Wed, 15 Jan 2025 00:24:39 +0545 Subject: [PATCH 36/41] fix: add early return condition --- src/components/chat/chat-message-bubble.tsx | 38 ++++++--------------- src/hooks/use-agent.ts | 11 +++--- 2 files changed, 18 insertions(+), 31 deletions(-) diff --git a/src/components/chat/chat-message-bubble.tsx b/src/components/chat/chat-message-bubble.tsx index fe22b422..e74b46fc 100644 --- a/src/components/chat/chat-message-bubble.tsx +++ b/src/components/chat/chat-message-bubble.tsx @@ -12,32 +12,6 @@ export function ChatMessageBubble({ message }: { message: Message }) { message.role === "assistant" ? message.agent_id : null ); - const AgentAvatar = () => { - const shouldShowOverlay = - agent?.name && agent.name.toLowerCase() !== "assistant"; - - return ( - - - - AI BTC Dev - - {shouldShowOverlay && ( -
- - {agent.name.charAt(0).toUpperCase()} - -
- )} - - ); - }; - return (
) : ( - + + + + AI BTC Dev + + )}
diff --git a/src/hooks/use-agent.ts b/src/hooks/use-agent.ts index 0a34c298..b2a36403 100644 --- a/src/hooks/use-agent.ts +++ b/src/hooks/use-agent.ts @@ -110,14 +110,16 @@ export function useAgentForm() { } // Hook for fetching agent data -export function useAgent(agentId: string | null) { +export function useAgent(agentId: string | null | undefined) { const [agent, setAgent] = useState(null); const [isLoading, setIsLoading] = useState(true); const [error, setError] = useState(null); useEffect(() => { const fetchAgent = async () => { - if (!agentId) { + setError(null); + + if (!agentId || agentId === "None") { setAgent(null); setIsLoading(false); return; @@ -137,8 +139,9 @@ export function useAgent(agentId: string | null) { setAgent(data); } catch (err) { - setError(err as Error); - console.error("Error fetching agent:", err); + const error = err as Error; + setError(error); + console.error("Error fetching agent:", error.message); } finally { setIsLoading(false); } From e035a3bbb13cf3228dcf6da6d22e89402dffc546 Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Wed, 15 Jan 2025 00:30:46 +0545 Subject: [PATCH 37/41] fix: image in chat bubble --- src/components/chat/chat-message-bubble.tsx | 38 +++++++++++++++------ 1 file changed, 27 insertions(+), 11 deletions(-) diff --git a/src/components/chat/chat-message-bubble.tsx b/src/components/chat/chat-message-bubble.tsx index e74b46fc..fe22b422 100644 --- a/src/components/chat/chat-message-bubble.tsx +++ b/src/components/chat/chat-message-bubble.tsx @@ -12,6 +12,32 @@ export function ChatMessageBubble({ message }: { message: Message }) { message.role === "assistant" ? message.agent_id : null ); + const AgentAvatar = () => { + const shouldShowOverlay = + agent?.name && agent.name.toLowerCase() !== "assistant"; + + return ( + + + + AI BTC Dev + + {shouldShowOverlay && ( +
+ + {agent.name.charAt(0).toUpperCase()} + +
+ )} + + ); + }; + return (
) : ( - - - - AI BTC Dev - - + )}
From 679e176890150cb21f6cb7022a285e14f813a24a Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Wed, 15 Jan 2025 00:32:03 +0545 Subject: [PATCH 38/41] fix: comment out logs --- src/components/chat/chat-window.tsx | 2 +- src/hooks/use-agent-name.ts | 10 +++++----- src/store/chat.ts | 12 ++++++------ 3 files changed, 12 insertions(+), 12 deletions(-) diff --git a/src/components/chat/chat-window.tsx b/src/components/chat/chat-window.tsx index 1ff6a61f..bde719d1 100644 --- a/src/components/chat/chat-window.tsx +++ b/src/components/chat/chat-window.tsx @@ -91,7 +91,7 @@ export function ChatWindow() { return () => { mounted = false; if (process.env.NODE_ENV !== "development") { - console.log("ChatWindow unmounting, disconnecting WebSocket"); + // console.log("ChatWindow unmounting, disconnecting WebSocket"); memoizedDisconnect(); } }; diff --git a/src/hooks/use-agent-name.ts b/src/hooks/use-agent-name.ts index 0cd5a4c7..8ae194ce 100644 --- a/src/hooks/use-agent-name.ts +++ b/src/hooks/use-agent-name.ts @@ -5,16 +5,16 @@ export function useAgentName(agentId: string | undefined) { const [agentName, setAgentName] = useState(null); useEffect(() => { - console.log("useAgentName hook called with agentId:", agentId); - + // console.log("useAgentName hook called with agentId:", agentId); + const fetchAgentName = async () => { if (!agentId) { - console.log("No agentId provided, skipping fetch"); + // console.log("No agentId provided, skipping fetch"); return; } try { - console.log("Fetching agent name for id:", agentId); + // console.log("Fetching agent name for id:", agentId); const { data, error } = await supabase .from("agents") .select("name") @@ -26,7 +26,7 @@ export function useAgentName(agentId: string | undefined) { return; } - console.log("Fetched agent name:", data.name); + // console.log("Fetched agent name:", data.name); setAgentName(data.name); } catch (error) { console.error("Error fetching agent name:", error); diff --git a/src/store/chat.ts b/src/store/chat.ts index cf2e88f3..36146dab 100644 --- a/src/store/chat.ts +++ b/src/store/chat.ts @@ -54,7 +54,7 @@ export const useChatStore = create((set, get) => ({ connect: (accessToken: string) => { // Don't reconnect if already connected or connecting if (globalWs && (globalWs.readyState === WebSocket.OPEN || globalWs.readyState === WebSocket.CONNECTING)) { - console.log('WebSocket already connected or connecting, skipping connection'); + // console.log('WebSocket already connected or connecting, skipping connection'); return; } @@ -64,16 +64,16 @@ export const useChatStore = create((set, get) => ({ throw new Error("WebSocket URL not configured"); } - console.log('Creating new WebSocket connection'); + // console.log('Creating new WebSocket connection'); globalWs = new WebSocket(`${wsUrl}?token=${accessToken}`); globalWs.onopen = () => { - console.log('WebSocket connected'); + // console.log('WebSocket connected'); set({ isConnected: true, error: null, ws: globalWs }); }; globalWs.onclose = () => { - console.log('WebSocket disconnected'); + // console.log('WebSocket disconnected'); set({ isConnected: false, ws: null }); globalWs = null; }; @@ -86,7 +86,7 @@ export const useChatStore = create((set, get) => ({ globalWs.onmessage = (event) => { try { const data = JSON.parse(event.data); - console.log('Received message:', data); + // console.log('Received message:', data); if (data.type === "token") { get().addMessage(data); } else { @@ -104,7 +104,7 @@ export const useChatStore = create((set, get) => ({ disconnect: () => { if (globalWs?.readyState === WebSocket.OPEN || globalWs?.readyState === WebSocket.CONNECTING) { - console.log('Closing WebSocket connection'); + // console.log('Closing WebSocket connection'); globalWs.close(); globalWs = null; set({ isConnected: false, ws: null }); From 669898a7a0099d0082bd2a3d93a8f18152deebdf Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Wed, 15 Jan 2025 10:22:04 +0545 Subject: [PATCH 39/41] fix: twitter og image --- src/app/layout.tsx | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/src/app/layout.tsx b/src/app/layout.tsx index e6fa1892..84720c6e 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -25,7 +25,7 @@ export const metadata: Metadata = { type: "website", images: [ { - url: "logos/aibtcdev-avatar-1000px.png", + url: "https://app.aibtc.dev/logos/aibtcdev-avatar-1000px.png", width: 1000, height: 1000, alt: "AIBTC", @@ -34,7 +34,14 @@ export const metadata: Metadata = { }, twitter: { card: "summary_large_image", - images: ["logos/aibtcdev-avatar-1000px.png"], + images: [ + { + url: "https://app.aibtc.dev/logos/aibtcdev-pattern-1-with-text-social.png", + alt: "AIBTC", + width: 1200, + height: 630, + }, + ], }, }; From dd98abe2bff7c04546e9f6b6552f1fc8318a2b45 Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Wed, 15 Jan 2025 10:31:00 +0545 Subject: [PATCH 40/41] fix: meta title for DAOs --- src/app/daos/[id]/layout-client.tsx | 140 ++++++++++++++++++++++++++++ src/app/daos/[id]/layout.tsx | 100 ++++---------------- 2 files changed, 159 insertions(+), 81 deletions(-) create mode 100644 src/app/daos/[id]/layout-client.tsx diff --git a/src/app/daos/[id]/layout-client.tsx b/src/app/daos/[id]/layout-client.tsx new file mode 100644 index 00000000..fe6162af --- /dev/null +++ b/src/app/daos/[id]/layout-client.tsx @@ -0,0 +1,140 @@ +"use client"; + +import React, { useEffect, useState } from "react"; +import { useParams, usePathname } from "next/navigation"; +import Link from "next/link"; +import { + ChevronRight, + Info, + Activity, + Users, + Blocks, + Loader2, +} from "lucide-react"; +import { supabase } from "@/utils/supabase/client"; + +interface DAO { + id: string; + name: string; + mission: string; + description: string; + image_url: string; + is_graduated: boolean; + is_deployed: boolean; + created_at: string; +} + +export function DAOLayoutClient({ children }: { children: React.ReactNode }) { + const params = useParams(); + const id = params.id as string; + const pathname = usePathname(); + const [dao, setDao] = useState(null); + const [loading, setLoading] = useState(true); + + const isOverview = pathname === `/daos/${id}`; + const isExtensions = pathname === `/daos/${id}/extensions`; + const isHolders = pathname === `/daos/${id}/holders`; + const isProposals = pathname === `/daos/${id}/proposals`; + + useEffect(() => { + const fetchDAO = async () => { + try { + const { data, error } = await supabase + .from("daos") + .select("*") + .eq("id", id) + .single(); + + if (error) throw error; + setDao(data); + } catch (error) { + console.error("Error fetching DAO:", error); + } finally { + setLoading(false); + } + }; + + fetchDAO(); + }, [id]); + + if (loading) { + return ( +
+ +
+ ); + } + + return ( +
+ {/* Breadcrumb */} +
+ + DAOs + + + + {dao?.name || "Details"} + +
+ + {/* DAO Title */} +

{dao?.name}

+ + {/* Navigation Tabs */} +
+ +
+ + Overview +
+ + +
+ + Extensions +
+ + +
+ + Holders +
+ + +
+ + Proposals +
+ +
+ + {/* Content */} +
{children}
+
+ ); +} diff --git a/src/app/daos/[id]/layout.tsx b/src/app/daos/[id]/layout.tsx index 9d5df21c..1d0fab62 100644 --- a/src/app/daos/[id]/layout.tsx +++ b/src/app/daos/[id]/layout.tsx @@ -1,85 +1,23 @@ -"use client"; +import { Metadata } from "next"; +import { DAOLayoutClient } from "./layout-client"; +import { supabase } from "@/utils/supabase/client"; -import React from "react"; -import { useParams, usePathname } from "next/navigation"; -import Link from "next/link"; -import { ChevronRight, Info, Activity, Users, Blocks } from "lucide-react"; +export async function generateMetadata({ + params, +}: { + params: { id: string }; +}): Promise { + const { data: dao } = await supabase + .from("daos") + .select("name") + .eq("id", params.id) + .single(); -export default function DAOLayout({ children }: { children: React.ReactNode }) { - const params = useParams(); - const id = params.id as string; - const pathname = usePathname(); - - const isOverview = pathname === `/daos/${id}`; - const isExtensions = pathname === `/daos/${id}/extensions`; - const isHolders = pathname === `/daos/${id}/holders`; - const isProposals = pathname === `/daos/${id}/proposals`; - - return ( -
- {/* Breadcrumb */} -
- - DAOs - - - Details -
- - {/* Navigation Tabs */} -
- -
- - Overview -
- - -
- - Extensions -
- - -
- - Holders -
- - -
- - Proposals -
- -
+ return { + title: dao?.name ? `${dao.name} - DAO Details` : "DAO Details", + }; +} - {/* Content */} -
{children}
-
- ); +export default function DAOLayout({ children }: { children: React.ReactNode }) { + return {children}; } From 847dedf5ecbf180ccd6bcad9d973c81b1b6c8dc1 Mon Sep 17 00:00:00 2001 From: biwasbhandari Date: Wed, 15 Jan 2025 11:21:12 +0545 Subject: [PATCH 41/41] fix: dao layout --- src/app/daos/[id]/layout.tsx | 78 +++++++++++++++++++++++++++++++++--- 1 file changed, 72 insertions(+), 6 deletions(-) diff --git a/src/app/daos/[id]/layout.tsx b/src/app/daos/[id]/layout.tsx index 1d0fab62..631e7df5 100644 --- a/src/app/daos/[id]/layout.tsx +++ b/src/app/daos/[id]/layout.tsx @@ -2,19 +2,85 @@ import { Metadata } from "next"; import { DAOLayoutClient } from "./layout-client"; import { supabase } from "@/utils/supabase/client"; +// Twitter recommends 2:1 ratio images +// Minimum dimensions: 300x157 +// Maximum dimensions: 4096x4096 +// Recommended dimensions: 1200x600 +const TWITTER_IMAGE_WIDTH = 1200; +const TWITTER_IMAGE_HEIGHT = 600; + +// Open Graph recommends 1.91:1 ratio +const OG_IMAGE_WIDTH = 1200; +const OG_IMAGE_HEIGHT = 628; + export async function generateMetadata({ params, }: { params: { id: string }; }): Promise { - const { data: dao } = await supabase - .from("daos") - .select("name") - .eq("id", params.id) - .single(); + const [{ data: dao }, { data: token }] = await Promise.all([ + supabase + .from("daos") + .select("name, description") + .eq("id", params.id) + .single(), + supabase + .from("tokens") + .select("image_url") + .eq("dao_id", params.id) + .single(), + ]); + + if (!dao) { + return { + title: "DAO Not Found", + description: "The requested DAO could not be found.", + }; + } + + // Generate separate URLs for Twitter and Open Graph with correct dimensions + const twitterImageUrl = token?.image_url + ? `${token.image_url}?w=${TWITTER_IMAGE_WIDTH}&h=${TWITTER_IMAGE_HEIGHT}&fit=cover&auto=format` + : undefined; + + const ogImageUrl = token?.image_url + ? `${token.image_url}?w=${OG_IMAGE_WIDTH}&h=${OG_IMAGE_HEIGHT}&fit=cover&auto=format` + : undefined; return { - title: dao?.name ? `${dao.name} - DAO Details` : "DAO Details", + title: dao.name, + description: dao.description, + openGraph: { + title: dao.name, + description: dao.description, + images: ogImageUrl + ? [ + { + url: ogImageUrl, + width: OG_IMAGE_WIDTH, + height: OG_IMAGE_HEIGHT, + alt: `${dao.name} token logo`, + }, + ] + : undefined, + type: "website", + }, + twitter: { + card: "summary_large_image", + title: dao.name, + description: dao.description, + // Twitter specific image with 2:1 ratio + images: twitterImageUrl ? [twitterImageUrl] : undefined, + creator: "@aibtcdev", + }, + alternates: { + canonical: `/daos/${params.id}`, + }, + robots: { + index: true, + follow: true, + }, + keywords: [dao.name, "DAO", "Blockchain", "Governance", "Token"], }; }