Skip to content

An example of using a language model to select react components dynamically based on user queries

License

Notifications You must be signed in to change notification settings

Techolution/GenUI

Folders and files

NameName
Last commit message
Last commit date

Latest commit

cc8dcba · Sep 5, 2024

History

9 Commits
Sep 5, 2024
Sep 5, 2024
Sep 5, 2024
Sep 5, 2024
Sep 5, 2024
Sep 5, 2024
Sep 5, 2024
Sep 5, 2024
Sep 5, 2024
Sep 5, 2024
Sep 5, 2024
Sep 5, 2024
Sep 5, 2024
Sep 5, 2024
Sep 5, 2024
Sep 5, 2024
Sep 5, 2024

Repository files navigation

GenUI - The Next Generation of User Interfaces

GenUI is a demo of dynamically sellecting React components based off the schema reponse sent back by an LLM in a query. The idea is to use an LLM as a light-weight "reasoning" layer that sits behind a UI and allows the interface to be dynamically selected as a user interacts with it. This example is a simple approach giving the LLM the choice to choose between two components, a function search function (performs RAG), and invoked directly through user input (like a typically chat application).

This idea can be extended into much more complicated implementations such as using user heatmap data as an input to a model that can predict what componets to choose from that will provide the best experience for the user. This offers a completly new dimension of personalization that can provide more value to users and drive more successful outcomes for organizations.

Data Flow!

NextGen UI

Demo!

Generative.UI.Demo.-.Without.Voice.Over.mp4

Getting Started!

To get this project up and running locally you need to have chroma installed:

activate environment: conda activate <env>

install chroma: pip install chromadb

run this command to start the chroma backend: chroma run --path db_path

Then, you'll need to load the data. The data for this example is located in "./public/data/data-0.json"

You'll need to run: npm run load-data

This will read in from the json file, initalize a chroma client, set up the embedding client, build the documents, vectorize, and load the data into chroma.

Then you'll need to run the development server: npm run dev

About

An example of using a language model to select react components dynamically based on user queries

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published