A responsive chat interface built with SvelteKit providing a UI wrapper around the OpenAI API. Supports file attachments and image uploads.

• Node.js (version 18 or higher)
• An OpenAI API key from OpenAI Platform
• Optional: Docker Desktop for containerized deployment

git clone https://github.com/ivanoconnor/chat_ui.git
cd chat_ui

1. Copy the example environment file:

   cp .env.example .env

2. Edit the .env file and add your OpenAI API key:

   OPENAI_API_KEY=your_openai_api_key_here

npm install

or if you prefer yarn:

yarn install

npm run dev

or with yarn:

yarn dev

Open http://localhost:5173/ to get started

1. Make sure Docker Desktop is installed and running
2. Copy and configure your environment variables:

   cp .env.example .env
   # Edit .env with your OpenAI API key

3. Build and start the container:

   docker-compose up --build

4. Access the application at http://localhost:5173/

docker build -t chat-ui .
docker run -p 5173:5173 --env-file .env chat-ui

To stop the Docker container, press Ctrl+C and then run:

docker-compose down

src/
├── lib/
│   ├── client.ts          # ChatGPT client implementation
│   ├── types.ts           # TypeScript type definitions
│   ├── systemPrompts.ts   # System prompt configurations
│   └── components/        # Reusable Svelte components
└── routes/
    ├── +layout.svelte     # App layout
    ├── +page.server.js    # Root page (redirects to /chat)
    ├── chat/              # Chat interface
    └── api/chat/          # Chat API endpoint

This project is licensed under the Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.

• ✅ Free to use and modify for personal and educational purposes
• ✅ Attribution required
• ❌ Commercial use not permitted without permission