LLM/DocsGPT
1
0
Fork 0
mirror of https://github.com/arc53/DocsGPT.git synced 2025-11-29 08:33:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

preparing for npm publish

Browse Source
This commit is contained in:
ManishMadan2882
2024-02-27 21:31:08 +05:30
parent 9cdd78e68c
commit 5d578d4b3b
8 changed files with 956 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files

918
extensions/react-widget/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

16
extensions/react-widget/package.json
View File

@@ -1,7 +1,9 @@
{
"name": "docsgpt",
"name": "docsgpt-bot",
"private": false,
"version": "0.2.4",
"description": "docsgpt-widget",
"homepage": "https://github.com/arc53/DocsGPT#readme",
"version": "0.2.6",
"type": "module",
"main": "dist/index.umd.js",
"module": "dist/index.es.js",
@@ -24,6 +26,8 @@
"dev": "vite",
"build": "tsc && vite build",
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
"prepare": "npm run build && npm run build-css",
"build-css": "postcss src/index.css -o dist/style.css",
"preview": "vite preview"
},
"dependencies": {
@@ -32,16 +36,18 @@
"@radix-ui/react-slot": "^1.0.2",
"class-variance-authority": "^0.7.0",
"clsx": "^2.1.0",
"postcss-cli": "^11.0.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-markdown": "^9.0.1",
"react-syntax-highlighter": "^15.5.0",
"remark-gfm": "^4.0.0",
"tailwind-merge": "^2.2.1",
"tailwindcss-animate": "^1.0.7"
"tailwindcss-animate": "^1.0.7",
"vite-plugin-dts": "^3.7.3"
},
"devDependencies": {
"@types/node": "^20.11.19",
"@types/node": "^20.11.20",
"@types/react": "^18.2.55",
"@types/react-dom": "^18.2.19",
"@types/react-syntax-highlighter": "^15.5.11",
@@ -57,4 +63,4 @@
"typescript": "^5.2.2",
"vite": "^5.1.0"
}
}
}

0
extensions/react-widget/src/App.css
View File

50
extensions/react-widget/src/components/DocsGPTWidget.tsx
View File

@@ -8,25 +8,22 @@ import { Alert, AlertTitle, AlertDescription } from './ui/alert';
import Dragon from '../assets/cute-docsgpt.svg'
import MessageIcon from '../assets/message.svg'
import Cancel from '../assets/cancel.svg'
import { Query, Status, ChatStates } from '@/models/customTypes';
import { Query, Status } from '@/models/customTypes';
import { fetchAnswerStreaming } from '@/requests/streamingApi';
import Response from './Response';
export const DocsGPTWidget = ({ apiHost = 'https://gptcloud.arc53.com', selectDocs = 'default', apiKey = 'docsgpt-public' }) => {
// processing states
const [chatState, setChatState] = useState<ChatStates>(() => {
if (typeof window !== 'undefined') {
return localStorage.getItem('docsGPTChatState') as ChatStates || ChatStates.Init;
}
return ChatStates.Init;
});
const [prompt, setPrompt] = useState('');
const [status, setStatus] = useState<Status>('idle');
const [queries, setQueries] = useState<Query[]>([])
const [conversationId, setConversationId] = useState<string | null>(null)
const [open, setOpen] = useState<boolean>(false)
const scrollRef = useRef<HTMLDivElement | null>(null);
const scrollToBottom = (element: Element | null) => {
//recursive function to scroll to the last child of the last child ...
// to get to the bottom most element
if (!element) return;
if (element?.children.length === 0) {
element?.scrollIntoView({
@@ -37,13 +34,11 @@ export const DocsGPTWidget = ({ apiHost = 'https://gptcloud.arc53.com', selectDo
const lastChild = element?.children?.[element.children.length - 1]
lastChild && scrollToBottom(lastChild)
};
useEffect(() => {
scrollToBottom(scrollRef.current);
}, [queries.length, queries[queries.length - 1]?.response]);
useEffect(() => {
localStorage.setItem('docsGPTChatState', chatState);
}, [chatState]);
async function stream(question: string) {
setStatus('loading');
try {
@@ -89,17 +84,14 @@ export const DocsGPTWidget = ({ apiHost = 'https://gptcloud.arc53.com', selectDo
e.preventDefault()
queries.push({ prompt })
setPrompt('')
setChatState(ChatStates.Processing)
await stream(prompt)
setChatState(ChatStates.Answer)
}
return (
<>
<div className="dark widget-container font-sans">
<div onClick={() => setChatState(ChatStates.Init)}
className={`${chatState !== 'minimized' ? 'hidden' : ''} cursor-pointer`}>
<div className="dark text-left widget-container font-sans">
<div onClick={() => setOpen(true)}
className={`${open ? 'hidden' : ''} cursor-pointer`}>
<div className="mr-2 mb-2 bottom-2 right-2 absolute w-20 h-20 rounded-full overflow-hidden dark:divide-gray-700 border dark:border-gray-100 bg-gradient-to-br dark:from-[#5AF0EC] dark:to-[#E80D9D] from-gray-900/80 via-gray-900 to-gray-900 font-sans shadow backdrop-blur-sm flex items-center justify-center">
<img
src={MessageIcon}
@@ -108,7 +100,7 @@ export const DocsGPTWidget = ({ apiHost = 'https://gptcloud.arc53.com', selectDo
/>
</div>
</div>
<div className={` ${chatState !== 'minimized' ? '' : 'hidden'} absolute bottom-0 dark:divide-gray-700 rounded-md dark:bg-[#222327] dark:border-gray-700 font-sans shadow backdrop-blur-sm w-full`} style={{ transform: 'translateY(0%) translateZ(0px)' }}>
<div className={`${open ? '' : 'hidden'} absolute bottom-0 dark:divide-gray-700 rounded-md dark:bg-[#222327] dark:border-gray-700 font-sans shadow backdrop-blur-sm w-full`} style={{ transform: 'translateY(0%) translateZ(0px)' }}>
<div>
<img
src={Cancel}
@@ -116,7 +108,7 @@ export const DocsGPTWidget = ({ apiHost = 'https://gptcloud.arc53.com', selectDo
className="cursor-pointer hover:opacity-50 absolute top-0 right-0 m-2 white-filter"
onClick={(event) => {
event.stopPropagation();
setChatState(ChatStates.Minimized);
setOpen(false);
}}
/>
<div className="flex items-center gap-2 p-3">
@@ -130,13 +122,9 @@ export const DocsGPTWidget = ({ apiHost = 'https://gptcloud.arc53.com', selectDo
</div>
</div>
<div className="w-full">
<button onClick={() => setChatState(ChatStates.Typing)}
className={`flex w-full justify-center px-5 py-3 text-sm text-gray-800 font-bold dark:text-white transition duration-300 hover:bg-gray-100 rounded-b dark:hover:bg-gray-800/70 ${chatState !== 'init' ? 'hidden' : ''}`}>
Ask DocsGPT
</button>
{(chatState === 'typing' || chatState === 'answer' || chatState === 'processing') && (
{open && (
<div className='h-full'>
<ScrollArea className='h-72 p-2 rounded-md'>
<ScrollArea className='h-72 p-2 rounded-md text-left'>
{
queries.length > 0 ? queries?.map((query, index) => {
return (
@@ -188,13 +176,16 @@ export const DocsGPTWidget = ({ apiHost = 'https://gptcloud.arc53.com', selectDo
</ScrollArea>
<form
onSubmit={handleSubmit}
className="relative w-full m-0 p-2" style={{ opacity: 1 }}>
<div className='p-2 flex justify-between'>
className="relative w-full m-0 bg-transparent p-2" style={{ opacity: 1 }}>
<div className='p-2 flex justify-between bg-transparent'>
<Input
value={prompt} onChange={(event) => setPrompt(event.target.value)}
type='text'
className="w-[85%] border border-[#686877] h-8 bg-transparent px-5 py-4 text-sm text-gray-700 dark:text-white focus:outline-none" placeholder="What do you want to do?" />
<Button className="text-gray-400 dark:text-gray-500 bg-gradient-to-br dark:from-[#5AF0EC] dark:to-[#E80D9D] disabled:bg-black text-sm inset-y-0 px-2" type="submit" disabled={prompt.length == 0 || status !== 'idle'}>
<Button
className="text-gray-400 dark:text-gray-500 bg-gradient-to-br dark:from-[#5AF0EC] dark:to-[#E80D9D] disabled:bg-black text-sm inset-y-0 px-2"
type="submit"
disabled={prompt.length == 0 || status !== 'idle'}>
<PaperPlaneIcon className='text-white' />
</Button>
</div>
@@ -205,7 +196,6 @@ export const DocsGPTWidget = ({ apiHost = 'https://gptcloud.arc53.com', selectDo
</div>
</div>
</div>
</>
)
}

1
extensions/react-widget/src/components/index.ts
View File

@@ -1 +0,0 @@
export { DocsGPTWidget } from "./DocsGPTWidget";

1
extensions/react-widget/src/index.ts Normal file
View File

@@ -0,0 +1 @@
export { DocsGPTWidget } from "./components/DocsGPTWidget";

17
extensions/react-widget/tsconfig.json
View File

@@ -2,9 +2,7 @@
"compilerOptions": {
"baseUrl": ".",
"paths": {
"@/*": [
"./src/*"
]
"@/*": ["./src/*"]
},
"target": "ES2020",
"useDefineForClassFields": true,
@@ -24,8 +22,13 @@
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"noFallthroughCasesInSwitch": true
},
"include": ["src", "src/components/ui/input.tsx", "index.ts"],
"references": [{ "path": "./tsconfig.node.json" }]
"noFallthroughCasesInSwitch": true,
/* The "typeRoots" configuration specifies the locations where
TypeScript looks for type definitions (.d.ts files) to
include in the compilation process.*/
"typeRoots": ["./dist/index.d.ts", "node_modules/@types"]
},
/* include /index.ts*/
"include": ["src", "./index.ts"],
"references": [{ "path": "./tsconfig.node.json" }]
}

29
extensions/react-widget/vite.config.ts
View File

@@ -1,9 +1,36 @@
import path from "path"
import react from "@vitejs/plugin-react"
import { defineConfig } from "vite"
import dts from "vite-plugin-dts";
export default defineConfig({
plugins: [react()],
build: {
//Specifies that the output of the build will be a library.
lib: {
//Defines the entry point for the library build. It resolves
//to src/index.ts,indicating that the library starts from this file.
entry: path.resolve(__dirname, "src/index.ts"),
name: "docsgpt-widget",
//A function that generates the output file
//name for different formats during the build
fileName: (format) => `index.${format}.js`,
},
rollupOptions: {
external: ["react", "react-dom"],
output: {
globals: {
react: "React",
"react-dom": "ReactDOM",
},
},
},
//Generates sourcemaps for the built files,
//aiding in debugging.
sourcemap: true,
//Clears the output directory before building.
emptyOutDir: true,
},
plugins: [react(), dts()],
resolve: {
alias: {
"@": path.resolve(__dirname, "./src"),