-
Notifications
You must be signed in to change notification settings - Fork 15
feat: Add basic markdown rendering for AI responses #21 #34
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: master
Are you sure you want to change the base?
Changes from 2 commits
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -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": "[email protected]+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": "[email protected]+sha512.6540583f41cc5f628eb3d9773ecee802f4f9ef9923cc45b69890fb47991d4b092964694ec3a4f738a420c918a333062c8b925d312f42e4f0c263eb603551f977" | ||
| } |
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,8 +1,12 @@ | ||
| import Terminal from './components/Terminal'; | ||
| import './App.css'; | ||
| import Terminal from './components/Terminal'; | ||
|
|
||
| function App() { | ||
| return <Terminal />; | ||
| return ( | ||
| <div className="h-screen w-full"> | ||
| <Terminal /> | ||
| </div> | ||
| ); | ||
| } | ||
|
|
||
| export default App; |
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,37 @@ | ||
| import { useState } from 'react'; | ||
| import ReactMarkdown from 'react-markdown'; | ||
|
|
||
| interface Message { | ||
| type: 'command'|'output'|'error'|'llm'; | ||
| text: string; | ||
| } | ||
|
|
||
| export default function Terminal() { | ||
| const [messages] = useState<Message[]>([ | ||
| { | ||
| type: 'llm', | ||
| text: '**Welcome!**\n\n_Everything you type will render as Markdown._\n\nTry list:\n- Item 1\n- Item 2\n\nCode:\n```\necho hello\n```' | ||
| } | ||
| ]); | ||
|
||
|
|
||
| return ( | ||
| <div className="terminal-container"> | ||
| <div className="terminal-output"> | ||
| {messages.map((msg, idx) => ( | ||
| <div key={idx} className={`terminal-line ${msg.type}`}> | ||
| {msg.type === 'llm' | ||
| ? <ReactMarkdown>{msg.text}</ReactMarkdown> | ||
| : msg.text} | ||
| </div> | ||
| ))} | ||
| </div> | ||
| <div className="terminal-input"> | ||
| <input | ||
| className="font-mono" | ||
| placeholder="Type a command..." | ||
| disabled | ||
| /> | ||
| </div> | ||
| </div> | ||
| ); | ||
| } | ||
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
this isn’t the actual terminal component - the real one is in
components/Terminal/index.tsxand handles input, history, command execution, and AI response handling. this new file isn’t used in the app and doesn’t integrate with anything.