{messages.length === 0 && (
-
Ask mascot anything
+
Ask chatbot anything
)}
{messages.slice(-8).map((msg, i) => (
@@ -72,7 +72,7 @@ export function ChatPanel({ inputRef: externalInputRef }: ChatPanelProps) {
diff --git a/services/frontend/src/components/mascot/mascot-canvas.tsx b/services/frontend/src/components/chatbot/chatbot-canvas.tsx
similarity index 95%
rename from services/frontend/src/components/mascot/mascot-canvas.tsx
rename to services/frontend/src/components/chatbot/chatbot-canvas.tsx
index b037c56..6d04821 100644
--- a/services/frontend/src/components/mascot/mascot-canvas.tsx
+++ b/services/frontend/src/components/chatbot/chatbot-canvas.tsx
@@ -1,7 +1,7 @@
"use client";
import { useEffect, useRef } from "react";
-import { useMascot } from "./mascot-context";
+import { useChatbot } from "./chatbot-context";
/**
* Live2D Cubism WebGL canvas.
@@ -10,15 +10,15 @@ import { useMascot } from "./mascot-context";
* Integration requires:
* 1. Live2D Cubism SDK for Web (npm: @live2d/cubism)
* 2. Model files: .model3.json, .moc3, .physics3.json, textures
- * 3. Place model files in public/mascot/
+ * 3. Place model files in public/chatbot/
*
* The current implementation shows a placeholder character.
* Replace with actual Cubism SDK integration when model files are available.
*/
-export function MascotCanvas() {
+export function ChatbotCanvas() {
const canvasRef = useRef
(null);
- const { expression } = useMascot();
+ const { expression } = useChatbot();
// Placeholder: draw a simple avatar face that responds to expression
useEffect(() => {
diff --git a/services/frontend/src/components/mascot/mascot-container.tsx b/services/frontend/src/components/chatbot/chatbot-container.tsx
similarity index 92%
rename from services/frontend/src/components/mascot/mascot-container.tsx
rename to services/frontend/src/components/chatbot/chatbot-container.tsx
index 1144bbe..4217cc6 100644
--- a/services/frontend/src/components/mascot/mascot-container.tsx
+++ b/services/frontend/src/components/chatbot/chatbot-container.tsx
@@ -2,12 +2,12 @@
import { useRef, useState, useCallback, useEffect } from "react";
import { Bot, MessageCircle, Minimize2 } from "lucide-react";
-import { useMascot } from "./mascot-context";
-import { MascotCanvas } from "./mascot-canvas";
+import { useChatbot } from "./chatbot-context";
+import { ChatbotCanvas } from "./chatbot-canvas";
import { ChatPanel } from "./chat-panel";
-export function MascotContainer() {
- const { minimized, setMinimized, chatOpen, setChatOpen } = useMascot();
+export function ChatbotContainer() {
+ const { minimized, setMinimized, chatOpen, setChatOpen } = useChatbot();
const [position, setPosition] = useState({ x: 0, y: 0 });
const [dragging, setDragging] = useState(false);
const [dragStart, setDragStart] = useState({ x: 0, y: 0 });
@@ -42,7 +42,7 @@ export function MascotContainer() {
onMouseUp={handleMouseUp}
onMouseLeave={handleMouseUp}
>
- {/* Main mascot bubble */}
+ {/* Main chatbot bubble */}
setMinimized(false)}
className="w-full h-full flex items-center justify-center"
onMouseDown={handleMouseDown}
- aria-label="Open mascot"
+ aria-label="Open chatbot"
>
@@ -67,7 +67,7 @@ export function MascotContainer() {
onMouseDown={handleMouseDown}
>
- Mascot
+ Chatbot