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

Merge branch 'main' of https://github.com/devaine/CodeRED-Astra into cloud-prep

Browse source
This commit is contained in:
Christbru 2025-10-18 17:18:41 -05:00
commit ad42500422
20 changed files with 1270 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

29
eslint.config.js Normal file
View file

@ -0,0 +1,29 @@
import js from "@eslint/js";
import globals from "globals";
import reactHooks from "eslint-plugin-react-hooks";
import reactRefresh from "eslint-plugin-react-refresh";
import { defineConfig, globalIgnores } from "eslint/config";
export default defineConfig([
globalIgnores(["dist"]),
{
files: ["**/*.{js,jsx}"],
extends: [
js.configs.recommended,
reactHooks.configs["recommended-latest"],
reactRefresh.configs.vite,
],
languageOptions: {
ecmaVersion: 2020,
globals: globals.browser,
parserOptions: {
ecmaVersion: "latest",
ecmaFeatures: { jsx: true },
sourceType: "module",
},
},
rules: {
"no-unused-vars": ["error", { varsIgnorePattern: "^[A-Z_]" }],
},
},
]);

45
package.json Normal file
View file

@ -0,0 +1,45 @@
{
"name": "codered-astra",
"private": true,
"scripts": {
"build": "vite build",
"dev": "vite",
"host": "vite host",
"format": "prettier --write \"**/*.{ts,tsx,md}\"",
"clean-dist": "find apps/ -type d -name 'dist' -print0 | xargs -r0 -- rm -r",
"clean-all": "find apps/ -type d -name 'dist' -print0 | xargs -r0 -- rm -r && find . -path ./node_modules -prune -o -name 'node_modules' | xargs rm -rf "
},
"license": "ISC",
"dependencies": {
"@google/genai": "^1.25.0",
"@tailwindcss/postcss": "^4.1.14",
"@tailwindcss/vite": "^4.1.14",
"@vitejs/plugin-react": "^5.0.4",
"bootstrap": "^5.3.8",
"bootstrap-icons": "^1.13.1",
"cors": "^2.8.5",
"dotenv": "^17.2.3",
"express": "^5.1.0",
"helmet": "^8.1.0",
"lucide-react": "^0.546.0",
"pg": "^8.16.3",
"react": "^19.2.0",
"react-bootstrap": "^2.10.10",
"react-dom": "^19.2.0",
"react-router": "^7.9.4",
"react-router-dom": "^7.9.4",
"vite-jsconfig-paths": "^2.0.1"
},
"packageManager": ">=npm@10.9.0",
"devDependencies": {
"eslint": "^9.38.0",
"eslint-plugin-import": "^2.32.0",
"eslint-plugin-react": "^7.37.5",
"eslint-plugin-react-hooks": "^7.0.0",
"eslint-plugin-react-refresh": "^0.4.24",
"nodemon": "^3.1.10",
"prettier": "^3.6.2",
"tailwindcss": "^4.1.14",
"vite": "^7.1.10"
}
}

12
src/app/index.jsx Normal file
View file

@ -0,0 +1,12 @@
import React from "react";
import ChatLayout from "src/components/ui/ChatLayout";
function App() {
return (
<div className="min-h-screen bg-slate-900 text-white flex items-center justify-center p-6">
<ChatLayout />
</div>
);
}
export default App;

0
src/components/layouts/dashboard-layout.jsx Normal file
View file

19
src/components/ui/Button/DeleteButton.jsx Normal file
View file

@ -0,0 +1,19 @@
import Button from 'react-bootstrap/Button';
export default function DeleteButton({ onClick, variant = "outline-danger", children, ...props }) {
return (
<Button onClick={onClick} variant={variant} {...props}>
{children || "Delete"}{" "}
<svg
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
fill="currentColor"
className="bi bi-trash3"
viewBox="0 0 16 16"
>
<path d="M6.5 1h3a.5.5 0 0 1 .5.5v1H6v-1a.5.5 0 0 1 .5-.5M11 2.5v-1A1.5 1.5 0 0 0 9.5 0h-3A1.5 1.5 0 0 0 5 1.5v1H1.5a.5.5 0 0 0 0 1h.538l.853 10.66A2 2 0 0 0 4.885 16h6.23a2 2 0 0 0 1.994-1.84l.853-10.66h.538a.5.5 0 0 0 0-1zm1.958 1-.846 10.58a1 1 0 0 1-.997.92h-6.23a1 1 0 0 1-.997-.92L3.042 3.5zm-7.487 1a.5.5 0 0 1 .528.47l.5 8.5a.5.5 0 0 1-.998.06L5 5.03a.5.5 0 0 1 .47-.53Zm5.058 0a.5.5 0 0 1 .47.53l-.5 8.5a.5.5 0 1 1-.998-.06l.5-8.5a.5.5 0 0 1 .528-.47M8 4.5a.5.5 0 0 1 .5.5v8.5a.5.5 0 0 1-1 0V5a.5.5 0 0 1 .5-.5"/>
</svg>
</Button>
);
}

13
src/components/ui/Button/NewChatButton.css Normal file
View file

@ -0,0 +1,13 @@
.custom-btn {
background-color: white !important;
border: 2px solid #0F2862 !important;
color: #0F2862 !important;
transition: all 0.25s ease;
}
.custom-btn:hover,
.custom-btn:focus {
background-color: #0F2862 !important;
color: white !important;
border-color: #0F2862 !important;
}

19
src/components/ui/Button/NewChatButton.jsx Normal file
View file

@ -0,0 +1,19 @@
import Button from 'react-bootstrap/Button';
import './NewChatButton.css'
export default function NewChatButton({ onClick, variant = "outline-light", children, ...props }) {
return (
<Button onClick={onClick} className="custom-btn" {...props}>
{children || "New Chat"}{" "}
<svg
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
fill="currentColor"
className="bi bi-plus-lg"
viewBox="0 0 16 16"
>
<path fillRule="evenodd" d="M8 2a.5.5 0 0 1 .5.5v5h5a.5.5 0 0 1 0 1h-5v5a.5.5 0 0 1-1 0v-5h-5a.5.5 0 0 1 0-1h5v-5A.5.5 0 0 1 8 2"/>
</svg>
</Button>
);
}

19
src/components/ui/ChatHeader.jsx Normal file
View file

@ -0,0 +1,19 @@
import React from "react";
export default function ChatHeader({ title = "AI Assistant" }) {
return (
<header className="flex items-center justify-between px-4 py-3 bg-gradient-to-r from-slate-800 to-slate-900 text-white">
<div className="flex items-center gap-3">
<div className="w-10 h-10 bg-indigo-500 rounded flex items-center justify-center font-bold">
AI
</div>
<div>
<h1 className="text-lg font-semibold">{title}</h1>
<p className="text-sm text-slate-300">
Ask anything — AI is listening
</p>
</div>
</div>
</header>
);
}

34
src/components/ui/ChatLayout.jsx Normal file
View file

@ -0,0 +1,34 @@
import React, { useState } from "react";
import ChatHeader from "./ChatHeader";
import ChatWindow from "./ChatWindow";
import MessageInput from "./MessageInput";
export default function ChatLayout() {
const [messages, setMessages] = useState([
{
role: "assistant",
content: "Hello — I can help you with code, explanations, and more.",
},
]);
function handleSend(text) {
const userMsg = { role: "user", content: text };
setMessages((s) => [...s, userMsg]);
// fake assistant reply after short delay
setTimeout(() => {
setMessages((s) => [
...s,
{ role: "assistant", content: `You said: ${text}` },
]);
}, 600);
}
return (
<div className="flex flex-col h-[80vh] w-full max-w-3xl mx-auto rounded-lg overflow-hidden shadow-lg border border-slate-700">
<ChatHeader />
<ChatWindow messages={messages} />
<MessageInput onSend={handleSend} />
</div>
);
}

37
src/components/ui/ChatWindow.jsx Normal file
View file

@ -0,0 +1,37 @@
import React from "react";
import { useRef } from "react";
function MessageBubble({ message }) {
const isUser = message.role === "user";
return (
<div
className={`flex ${isUser ? "justify-end" : "justify-start"} px-4 py-2`}
>
<div
className={`max-w-[70%] p-3 rounded-lg ${isUser ? "bg-indigo-600 text-white" : "bg-slate-700 text-slate-100"}`}
>
<div className="text-sm">{message.content}</div>
</div>
</div>
);
}
export default function ChatWindow({ messages }) {
const chatRef = useRef(null);
// Auto-scroll to bottom when new messages appear
useEffect(() => {
chatRef.current?.scrollTo({
top: chatRef.current.scrollHeight,
behavior: "smooth",
});
}, [messages]);
return (
<main className="flex-1 overflow-auto p-2 bg-gradient-to-b from-slate-900 to-slate-800">
<div className="space-y-2">
{messages.map((m, i) => (
<MessageBubble key={i} message={m} />
))}
</div>
</main>
);
}

31
src/components/ui/MessageInput.jsx Normal file
View file

@ -0,0 +1,31 @@
import React, { useState } from "react";
export default function MessageInput({ onSend }) {
const [text, setText] = useState("");
function handleSubmit(e) {
e.preventDefault();
if (!text.trim()) return;
onSend(text.trim());
setText("");
}
return (
<form onSubmit={handleSubmit} className="p-3 bg-slate-900">
<div className="flex gap-2">
<input
value={text}
onChange={(e) => setText(e.target.value)}
placeholder="Type a message..."
className="flex-1 rounded-md bg-slate-800 border border-slate-700 px-3 py-2 text-white focus:outline-none focus:ring-2 focus:ring-indigo-500"
/>
<button
type="submit"
className="bg-indigo-500 hover:bg-indigo-600 text-white px-4 py-2 rounded-md"
>
Send
</button>
</div>
</form>
);
}

24
src/index.css Normal file
View file

@ -0,0 +1,24 @@
@import "tailwindcss/preflight";
@import "tailwindcss/utilities";
:root {
--color-primary: 15 40 98;
--color-secondary: 79 95 118;
--color-accent: 158 54 58;
--color-paragraph: 255 255 255;
--color-background: 9 31 54;
}
body {
margin: 0;
background-color: rgb(var(--color-background));
color: rgb(var(--color-paragraph));
font-family:
ui-sans-serif,
system-ui,
-apple-system,
"Segoe UI",
Roboto,
"Helvetica Neue",
Arial;
}

10
src/main.jsx Normal file
View file

@ -0,0 +1,10 @@
import { StrictMode } from "react";
import { createRoot } from "react-dom/client";
import "./index.css";
import App from "./app/index.jsx";
createRoot(document.getElementById("root")).render(
<StrictMode>
<App />
</StrictMode>
);

7
src/styles/theme.css Normal file
View file

@ -0,0 +1,7 @@
@theme {
--color-primary: rgba(15, 40, 98);
--color-secondary: rgba(79, 95, 118);
--color-accent: rgba(158, 54, 58);
--color-paragraph: rgba(255, 255, 255);
--color-background: rgba(9, 31, 54);
}

14
vite.config.js Normal file
View file

@ -0,0 +1,14 @@
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import jsconfigPaths from "vite-jsconfig-paths";
import tailwindcss from "@tailwindcss/vite";
// https://vite.dev/config/
export default defineConfig({
plugins: [tailwindcss(), react(), jsconfigPaths()],
resolve: {
alias: {
src: "/src",
},
},
});

24
web-app/eslint.config.js
View file

@ -1,29 +1,29 @@
import js from '@eslint/js'
import globals from 'globals'
import reactHooks from 'eslint-plugin-react-hooks'
import reactRefresh from 'eslint-plugin-react-refresh'
import { defineConfig, globalIgnores } from 'eslint/config'
import js from "@eslint/js";
import globals from "globals";
import reactHooks from "eslint-plugin-react-hooks";
import reactRefresh from "eslint-plugin-react-refresh";
import { defineConfig, globalIgnores } from "eslint/config";
export default defineConfig([
globalIgnores(['dist']),
globalIgnores(["dist"]),
{
files: ['**/*.{js,jsx}'],
files: ["**/*.{js,jsx}"],
extends: [
js.configs.recommended,
reactHooks.configs['recommended-latest'],
reactHooks.configs["recommended-latest"],
reactRefresh.configs.vite,
],
languageOptions: {
ecmaVersion: 2020,
globals: globals.browser,
parserOptions: {
ecmaVersion: 'latest',
ecmaVersion: "latest",
ecmaFeatures: { jsx: true },
sourceType: 'module',
sourceType: "module",
},
},
rules: {
'no-unused-vars': ['error', { varsIgnorePattern: '^[A-Z_]' }],
"no-unused-vars": ["error", { varsIgnorePattern: "^[A-Z_]" }],
},
},
])
]);

1
web-app/index.html
View file

@ -4,6 +4,7 @@
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="/src/index.css" rel="stylesheet" />
<title>codered-astra</title>
</head>
<body>

940
web-app/package-lock.json generated
View file

File diff suppressed because it is too large Load diff

14
web-app/src/main.jsx
View file

@ -1,10 +1,10 @@
import { StrictMode } from 'react'
import { createRoot } from 'react-dom/client'
import './index.css'
import App from './App.jsx'
import { StrictMode } from "react";
import { createRoot } from "react-dom/client";
import "./index.css";
import App from "./app/index.jsx";
createRoot(document.getElementById('root')).render(
createRoot(document.getElementById("root")).render(
<StrictMode>
<App />
</StrictMode>,
)
</StrictMode>
);

2
web-app/tailwind.config.js
View file

@ -1,6 +1,6 @@
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ["./src/**/*.{html,js}"],
content: ["./src/**/*.{js,ts,jsx,tsx}"],
theme: {
extend: {
colors: {