devaine/CodeRED-Astra
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat(skematic): added skematic button

Browse source
This commit is contained in:
JK-le-dev 2025-10-18 23:20:00 -05:00
commit af7a246e77
4 changed files with 24 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

16
web-app/src/components/ui/button/schematic-button.jsx Normal file
View file

@ -0,0 +1,16 @@
import React from "react";
import { motion } from "motion/react";
import { FilePlus2 } from "lucide-react";
export default function SchematicButton({ onClick }) {
return (
<motion.button
onClick={onClick}
className=" bg-gray-700 p-2 rounded-2xl"
whileHover={{ scale: 1.1 }}
whileTap={{ scale: 0.9 }}
>
<FilePlus2 />
</motion.button>
);
}

2
web-app/src/components/ui/chat/chat-header.jsx
View file

@ -5,7 +5,7 @@ export default function ChatHeader({ title = "Title of Chat" }) {
<div className="w-full flex justify-center"> <div className="w-full flex justify-center">
<header className="text-slate-100 fixed top-4 "> <header className="text-slate-100 fixed top-4 ">
<div> <div>
<h1 className="text-lg font-semibold shadow-lg shadow-indigo-600 bg-gray-900 px-6 py-2 rounded-4xl border-2 border-gray-800"> <h1 className="text-lg font-semibold shadow-md shadow-indigo-600 bg-gray-900 px-6 py-2 rounded-4xl border-2 border-gray-800">
{title} {title}
</h1> </h1>
</div> </div>

4
web-app/src/components/ui/chat/chat-window.jsx
View file

@ -5,7 +5,7 @@ function MessageBubble({ message }) {
return ( return (
<div className={`flex ${isUser ? "justify-end" : "justify-start"} py-2`}> <div className={`flex ${isUser ? "justify-end" : "justify-start"} py-2`}>
<div <div
className={`p-3 rounded-lg ${isUser ? "bg-indigo-600 text-white" : "bg-gray-700 text-slate-100"}`} className={`p-3 rounded-xl ${isUser ? "bg-indigo-600 text-white rounded-tr-sm" : "bg-gray-700 text-slate-100 rounded-tl-sm"}`}
> >
<div className="text-sm">{message.content}</div> <div className="text-sm">{message.content}</div>
</div> </div>
@ -15,7 +15,7 @@ function MessageBubble({ message }) {
export default function ChatWindow({ messages }) { export default function ChatWindow({ messages }) {
return ( return (
<div className="flex-1 overflow-auto px-2 pb-20"> <div className="flex-1 overflow-auto px-2 pt-4 pb-32">
<div className=""> <div className="">
{messages.map((m, i) => ( {messages.map((m, i) => (
<MessageBubble key={i} message={m} /> <MessageBubble key={i} message={m} />

6
web-app/src/components/ui/chat/message-input.jsx
View file

@ -1,6 +1,7 @@
import React, { useState } from "react"; import React, { useState } from "react";
import DeleteButton from "src/components/ui/button/delete-button"; import DeleteButton from "src/components/ui/button/delete-button";
import DownButton from "src/components/ui/button/down-button"; import DownButton from "src/components/ui/button/down-button";
import SchematicButton from "src/components/ui/button/schematic-button";
import { motion } from "motion/react"; import { motion } from "motion/react";
import { BotMessageSquare } from "lucide-react"; import { BotMessageSquare } from "lucide-react";
@ -19,7 +20,10 @@ export default function MessageInput({ onSend }) {
<footer className="fixed bottom-6 max-w-2xl w-full px-4"> <footer className="fixed bottom-6 max-w-2xl w-full px-4">
<div className="flex flex-col gap-2"> <div className="flex flex-col gap-2">
<div className="flex justify-between"> <div className="flex justify-between">
<DeleteButton></DeleteButton> <div className="flex gap-2">
<SchematicButton></SchematicButton>
<DeleteButton></DeleteButton>
</div>
<DownButton></DownButton> <DownButton></DownButton>
</div> </div>
<form <form