this new dashboard builder is really coming together always so nice when something turns out exactly how you imagined it

I like it

That looks slick. Nice job! What library is running under the hood that lets you do the draggable & resizable components?

using react-grid-layout for that! can recommend

Now this is neat! What are you using for the frontend/visuals?

this page uses: react/next.js + tailwind + shadcn + ai sdk recharts for the charts react-grid-layout for the draggable grid system

Love it. Love the modern stack

Is this a product you are going to be releasing?

yes! will be a pivot of Mitto and planning on launching it at the end of this month (:

I’m very interested in trying it out.

The experience of this magic is so great that it pushes us to build faster , btw look great

looks amazing

😎Working on something similar but for manufacturing...

That looks really cool!

Likewise!

Looks great do you generate custom views based on the chat? Does it mean you have custom graphs components available that can be called to create that output?

it works like this: users can connect various data sources, like a postgresql database, and use the ai chat to create specific metrics across one or multiple sources. the ai will write the sql and style the metric, which can then be refined in follow-up messages or manually edited. see: these metrics can be added to dashboards, which hold one or more metrics, to build in-depth insights around a specific topic for example. every action in the app can be done entirely through ai chat or manually with mouse and keyboard

Oh I see so you will first have a chat to create the metrics and then within another chat you can add these metrics to a dashboard? Really interesting that you decided to offer both the chat and the manual way. Did you build the manual way first?

everything can we done in the same chat (; yes i really like ai native apps where you can do everything manually but also, for example, using a chat. i built both at the same time, as you do need to take the structure of the app into account to make it accessible for the ai i think in this case it makes a lot of sense to have an ai chat as manually writing (federated) sql queries + visualizing and sharing metrics to analyze your data is a pain, and can be done so much faster with llms however in some cases having the ability to manually change something, like the chart type or color of a series is much faster done manually. so that’s why i love having both

I see what you are saying, what is your take on having UI form elements embedded in the chat in order to confirm changes? That way you could say "I want to change chart color" and get a custom component show up in the chat. Like in this example for validating reminders

yes i like that. i think it is great for users to have the ability to decline or revert a change the ai made. especially if the ai misinterpreted the request from the user for example what i do for the ‘metrics’ in my app, is that the ai actually creates a new version of the metric. so when the ai makes a change to a metric this gets saved as a new version, for example V2, so the user can always revert back to V1 you can see this as “save points” so the user can always go back to a previous version of the metric to revert a change or compare versions for example. that is how i solved it in my app

Smart so it's like variants of the metrics, would it make sense for you to have a way to switch the variant display directly from the dashboard if they are different version of the same thing?

yes this is how it currently works! on the metric detail page users can switch to a different version right inside the dashboard:

beautiful! I'm making something similar just for @pocketbase but yours is way better, gj!

Wow, everything about this is 🥵🤌 would love to see more!

Did you vibe code this?