diff --git a/package.json b/package.json index 28b328e..63a03ab 100644 --- a/package.json +++ b/package.json @@ -1,58 +1,59 @@ { - "name": "term", - "private": true, - "version": "0.0.0", - "type": "module", - "scripts": { - "dev": "vite", - "build": "tsc -b && vite build", - "lint": "eslint .", - "lint:fix": "eslint . --fix", - "preview": "vite preview", - "test": "vitest run", - "format": "prettier --write \"src/**/*.{js,jsx,ts,tsx,css,md}\"", - "format:check": "prettier --check \"src/**/*.{js,jsx,ts,tsx,css,md}\"", - "format:rust": "cd src-tauri && cargo fmt --all", - "format:all": "npm run format && npm run format:rust", - "prepare": "husky" - }, - "dependencies": { - "eslint-define-config": "^2.1.0", - "react": "^19.1.0", - "react-dom": "^19.1.0" - }, - "devDependencies": { - "@eslint/js": "^9.25.0", - "@tauri-apps/api": "^2.5.0", - "@tauri-apps/cli": "^2.5.0", - "@testing-library/jest-dom": "^6.6.3", - "@testing-library/react": "^16.3.0", - "@testing-library/user-event": "^14.6.1", - "@types/jest": "^29.5.14", - "@types/react": "^19.1.2", - "@types/react-dom": "^19.1.2", - "@vitejs/plugin-react": "^4.4.1", - "@vitest/coverage-v8": "3.1.4", - "autoprefixer": "^10.4.21", - "eslint": "^9.25.0", - "eslint-plugin-react": "^7.34.3", - "eslint-plugin-react-hooks": "^5.2.0", - "eslint-plugin-react-refresh": "^0.4.19", - "globals": "^16.0.0", - "husky": "^9.0.11", - "identity-obj-proxy": "^3.0.0", - "jest": "^29.7.0", - "jest-environment-jsdom": "^29.7.0", - "jsdom": "^26.1.0", - "lint-staged": "^16.0.0", - "postcss": "^8.5.3", - "prettier": "^3.2.5", - "tailwindcss": "^3.4.17", - "ts-jest": "^29.3.4", - "typescript": "~5.8.3", - "typescript-eslint": "^8.30.1", - "vite": "^6.3.5", - "vitest": "^3.1.4" - }, - "packageManager": "pnpm@10.11.0+sha512.6540583f41cc5f628eb3d9773ecee802f4f9ef9923cc45b69890fb47991d4b092964694ec3a4f738a420c918a333062c8b925d312f42e4f0c263eb603551f977" + "name": "term", + "private": true, + "version": "0.0.0", + "type": "module", + "scripts": { + "dev": "vite", + "build": "tsc -b && vite build", + "lint": "eslint .", + "lint:fix": "eslint . --fix", + "preview": "vite preview", + "test": "vitest run", + "format": "prettier --write \"src/**/*.{js,jsx,ts,tsx,css,md}\"", + "format:check": "prettier --check \"src/**/*.{js,jsx,ts,tsx,css,md}\"", + "format:rust": "cd src-tauri && cargo fmt --all", + "format:all": "npm run format && npm run format:rust", + "prepare": "husky" + }, + "dependencies": { + "react": "^19.1.0", + "react-dom": "^19.1.0", + "react-markdown": "^8.0.7", + "eslint-define-config": "^2.1.0" + }, + "devDependencies": { + "@eslint/js": "^9.25.0", + "@tauri-apps/api": "^2.5.0", + "@tauri-apps/cli": "^2.5.0", + "@testing-library/jest-dom": "^6.6.3", + "@testing-library/react": "^16.3.0", + "@testing-library/user-event": "^14.6.1", + "@types/jest": "^29.5.14", + "@types/react": "^19.1.2", + "@types/react-dom": "^19.1.2", + "@vitejs/plugin-react": "^4.4.1", + "@vitest/coverage-v8": "3.1.4", + "autoprefixer": "^10.4.21", + "eslint": "^9.25.0", + "eslint-plugin-react": "^7.34.3", + "eslint-plugin-react-hooks": "^5.2.0", + "eslint-plugin-react-refresh": "^0.4.19", + "globals": "^16.0.0", + "husky": "^9.0.11", + "identity-obj-proxy": "^3.0.0", + "jest": "^29.7.0", + "jest-environment-jsdom": "^29.7.0", + "jsdom": "^26.1.0", + "lint-staged": "^16.0.0", + "postcss": "^8.5.6", + "prettier": "^3.2.5", + "tailwindcss": "^3.4.17", + "ts-jest": "^29.3.4", + "typescript": "~5.8.3", + "typescript-eslint": "^8.30.1", + "vite": "^6.3.5", + "vitest": "^3.1.4" + }, + "packageManager": "pnpm@10.11.0+sha512.6540583f41cc5f628eb3d9773ecee802f4f9ef9923cc45b69890fb47991d4b092964694ec3a4f738a420c918a333062c8b925d312f42e4f0c263eb603551f977" } diff --git a/src/App.tsx b/src/App.tsx index 972ab60..a082965 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,8 +1,35 @@ +import './App.css'; import Terminal from './components/Terminal'; -import './App.css'; + +const exampleResponse = ` +# AI Summary +Here is some **bold text** and *italic text*. + +- Bullet Point 1 +- Bullet Point 2 + +\`\`\`javascript +console.log("Code block test"); +\`\`\` + +⚠️ Error Message: +\x1b[31merror\x1b[0m Something went wrong! +`; + +const malformedResponse = ` +### Unclosed *italic* +**Bold without closing +- List item +`; function App() { - return ; + return ( +
+ {/* ✅ Use both to remove warning and test */} + + +
+ ); } export default App; diff --git a/src/components/Terminal.tsx b/src/components/Terminal.tsx new file mode 100644 index 0000000..28ca478 --- /dev/null +++ b/src/components/Terminal.tsx @@ -0,0 +1,73 @@ +import { useState } from 'react'; +import ReactMarkdown from 'react-markdown'; + +interface Message { + type: 'command' | 'output' | 'error' | 'llm'; + text: string; +} + +interface TerminalProps { + aiResponse?: string; // ✅ Optional prop +} + +// ✅ Function to strip ANSI escape codes +function stripAnsi(input: string): string { + return input.replace(/\x1b\[[0-9;]*m/g, ''); +} + +export default function Terminal({ aiResponse }: TerminalProps) { + // ✅ Initialize state properly with lazy function to avoid re-runs + const [messages] = useState(() => + aiResponse + ? [{ type: 'llm', text: aiResponse }] + : [ + { + type: 'llm', + text: ` +# AI Response Example +This is **bold**, _italic_, and a list: + +- First item +- Second item + +Code block: +\`\`\`javascript +console.log("Hello Markdown!"); +\`\`\` + +⚠️ Error Test: +\x1b[31merror\x1b[0m Something went wrong! + +### Malformed Markdown Test +**Bold without close +_Unclosed italic +`, + }, + ] + ); + + return ( +
+
+ {messages.map((msg, idx) => ( +
+ {msg.type === 'llm' ? ( + + {stripAnsi(msg.text)} + + ) : ( + msg.text + )} +
+ ))} +
+
+ +
+
+ ); +} diff --git a/tailwind.config.js b/tailwind.config.js index 57beddd..dde18eb 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -15,7 +15,7 @@ export default { error: '#e06c75', llm: '#98c379', prompt: '#61afef', - border: '#333', + border: '#333' } }, fontFamily: { diff --git a/term b/term new file mode 160000 index 0000000..f400914 --- /dev/null +++ b/term @@ -0,0 +1 @@ +Subproject commit f400914daeab6e6ecf703d454979c5c1ac22598b