mirror of
https://github.com/microsoft/autogen.git
synced 2025-07-03 15:10:15 +00:00
fe96f7de24
* fix import issue related to agentchat update #4245 * update uv lock file * fix db auto_upgrade logic issue. * im prove msg rendering issue * Support termination condition combination. Closes #4325 * fix db instantiation bug * update yarn.lock, closes #4260 #4262 * remove deps for now with vulnerabilities found by dependabot #4262 * update db tests * add ability to load sessions from db .. * format updates, add format checks to ags * format check fixes * linting and ruff check fixes * make tests for ags non-parrallel to avoid db race conditions. * format updates * fix concurrency issue * minor ui tweaks, move run start to websocket * lint fixes * update uv.lock * Update python/packages/autogen-studio/autogenstudio/datamodel/types.py Co-authored-by: Eric Zhu <ekzhu@users.noreply.github.com> * Update python/packages/autogen-studio/autogenstudio/teammanager.py Co-authored-by: Eric Zhu <ekzhu@users.noreply.github.com> * reuse user proxy from agentchat * ui tweaks --------- Co-authored-by: Eric Zhu <ekzhu@users.noreply.github.com> Co-authored-by: Hussein Mozannar <hmozannar@microsoft.com>
🚀 Running UI in Dev Mode
Run the UI in dev mode (make changes and see them reflected in the browser with hotreloading):
- yarn install
- yarn start
This should start the server on port 8000.
Design Elements
- Gatsby: The app is created in Gatsby. A guide on bootstrapping a Gatsby app can be found here - https://www.gatsbyjs.com/docs/quick-start/.
This provides an overview of the project file structure include functionality of files like
gatsby-config.js,gatsby-node.js,gatsby-browser.jsandgatsby-ssr.js. - TailwindCSS: The app uses TailwindCSS for styling. A guide on using TailwindCSS with Gatsby can be found here - https://tailwindcss.com/docs/guides/gatsby.https://tailwindcss.com/docs/guides/gatsby . This will explain the functionality in tailwind.config.js and postcss.config.js.
Modifying the UI, Adding Pages
The core of the app can be found in the src folder. To add pages, add a new folder in src/pages and add a index.js file. This will be the entry point for the page. For example to add a route in the app like /about, add a folder about in src/pages and add a index.tsx file. You can follow the content style in src/pages/index.tsx to add content to the page.
Core logic for each component should be written in the src/components folder and then imported in pages as needed.
connecting to front end
the front end makes request to the backend api and expects it at /api on localhost port 8081
setting env variables for the UI
- please look at
.env.default - make a copy of this file and name it
.env.development - set the values for the variables in this file
- The main variable here is
GATSBY_API_URLwhich should be set tohttp://localhost:8081/apifor local development. This tells the UI where to make requests to the backend.
- The main variable here is