Create an administrative webpage for setting up a support service, which will be handled through ChatGPT API. Create a widget, which will respond to questions from users requesting support based on the settings from the administrative application. Demonstrate the functionality of this widget on a fictitious dummy webpage.

Frontend UI

We use Material-UI for the frontend.

HTTP backend

Backend is heavily inspired by iteration-02. Its documentation can be found at /api-documentation. It provides user authorization based on JWT, CRUD for websites and some other read-only endpoints. The server can be started by npm run start.

Database connection is implemented using Kysely. Migrations can be run by npm run migrate.

WS backend

Each websockets connection is expected to first provide session type message. It either contains website_uuid (in case the user has not started any session yet) or it contains cookie (which is a string authorizing user to connect to already started session). The server can be started by npm run start-ws.

Session initializing message:

{ "type": "session", "website_uuid": "5017bbd0-43b6-4b0f-9977-a9f685585c11" }

Session rejoining message:

{ "type": "session", "cookie": "gxwhTnGx6lBKM5FMWunUiaY7DdL6S0cig7Jz..." }

To both of this messages You'll get a reply matching the session rejoining message:

{ "type": "session", "cookie": "gxwhTnGx6lBKM5FMWunUiaY7DdL6S0cig7Jz..." }

Chat messages from user are then send via message type message:

{ "type": "message", "content": "Hi." }

And you'll get an assistant reply with same structure:

{ "type": "message", "content": "Hello! How can I assist you today?" }