latitude-dev / latitude Goto Github PK
View Code? Open in Web Editor NEWDeveloper-first embedded analytics
Home Page: https://latitude.so
License: GNU Lesser General Public License v3.0
Developer-first embedded analytics
Home Page: https://latitude.so
License: GNU Lesser General Public License v3.0
We should make it work from any subfolder inside a latitude project. Pretty easy: recursively look up the tree until we find a latitude.json
Add the option to click on a specific point in the chart to view the underlying data table for that specific slice/data point.
https://trylatitude.slack.com/archives/C03BS1B2YC9/p1711545133885489
Really wanted to try Latitude it looks so great! Would love some help here whenever possible :)
latitude start
Checking for updates...
? Whats the name of your project? latitude-app
? π Help us make Latitude better for you by sharing anonymous usage dataβitβs a simple way
to contribute, with full control to opt-in or opt-out at any time. No, maybe later
? π Help us make Latitude better for you by sharing anonymous usage dataβitβs a simple way
to contribute, with full control to opt-in or opt-out at any time. (Use arrow keys)
β― Yes, count me in!
No, maybe laterπ¦ Cloning template to /latitude-app
β
template cloned
β
Created latitude.json
Downloading from: https://registry.npmjs.org/@latitude-data/server/-/server-0.4.0.tgz
Uninstalling old app version...
App server downloaded successfully π
Installing dependencies...
ββββββββββββββββββββββββββββββββββββββββββ Error βββββββββββββββββββββββββββββββββββββββββββ
β β
β β
β β
β β
β π¨ Failed to install dependencies β
β β
β Update latitude and try again. If this does not solve the problem, β
β please open an issue on GitHub: β
β https://gitub.com/latitude-dev/latitude/issues β
β β
β ERROR: β
β false β
β β
β β
β β
ββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ
After choosing an option in the telemetry prompt an identical output gets printed in stdout. Does not affect usage but looks broken.
Self explanatory
Now the columns used from the query in a <PieChart />
are always the first as dimension
and the second as metric
So for example a table like this
Source | Amounts | Whatever |
---|---|---|
Search Engine | 1048 | 33 |
Direct | 735 | 33 |
580 | 33 | |
Union Ads | 484 | 33 |
Video Ads | 300 | 33 |
You can pass metric
and dimension
like this
<PieChart metric='Amounts' dimension='Source' />
If for some reason you want to use a data that looks like this
Source | Whatever | Amounts |
---|---|---|
Search Engine | 33 | 1048 |
Direct | 33 | 735 |
33 | 580 | |
Union Ads | 33 | 484 |
Video Ads | 33 | 300 |
It wont work. We have to implement metric
and dimension
props for pie chart
We want to allow users of the framework to pass encrypted params that they can use when embedding the view in an iframe. Example:
<iframe src="https://your-latitudepage.com/some/query?secret=ENCRYPTED" />
So the idea is to pass to the API this secret
or whatever you want to call your secret param and decrypt it on the server so only the owner of your-latitudepage.com
can know what's the value of ENCRYPTED
.
We need to think about how to differentiate between encrypted and non-encrypted params. One idea could be to add a prefix to the value or the name of the param
To the name:
lt__secret=ENCRYPTED
To the value:
secret=lt--ENCRYPTED
I think both ways can work
We also need to document how encryption work. Users needs to have a LATITUDE_SECRET_KEY
in their .env
file (which should be in the .gitignore
file of the data project). The idea is to do what Rails does. Use this LATITUDE_SECRET_KEY
do decrypt it on latitude's server.
On their side they need to encrypt the value of the encrypted params in the same way and with the same LATITUDE_SECRET_KEY
. TO_BE_DEFINED
I think nothing need to be done in terms of using the encrypted param in queries or views. In a view users do param('secret')
or whatever name they use for this param. And this send to the API the param encrypted. Is the server which before passing to the query builder decrypt the params with LATITUDE_SECRET_KEY
It should fail if we find some param that needs to be decrypted and we don't have the secret key. Also it should not fail if decryption fail. If someone pass an incorrect encrypted key we pass through the param to the query and the query will fail
If I try to use generated types from Svelte on our ./apps/server/routes/+layout.servert.ts
file it does not work at runtime
The error is pointing to an issue with our vite plugin
Not ideal but the solution is to remove lang="ts"
from the <script>
tag in +layout.svelte
and use JSDoc instead
Context this comment #199 (comment)
We need to add support for adding static files to a Latitude app such as svgs, pngs, and whatnot. The static files need to be bundled with the production build.
Latitude is prepared to handle env vars for secrets and other shenanigans, but we need to add support for a .env file in the root folder of a Latitude app.
And potentially the homepage also?
run
command.Right now the latitude run
command accepts referring to queries just with the name of the file.
We want to support VSCode tasks to make the experience more streamlined, so the command needs to accept full file paths too through a flag or parameter.
Add a Select input component that also allows using results of a query as options.
Latitude does some automatic transformations to your code that do no play nicely with existing lsps and code completion, we need to provide at least a VS Code extension so that developing a Latitude app feels natural from the code editor.
Users are missing an easy way to include icons to Latitude. We should have an Icon component to include icons from some popular resource of icons.
It now looks broken. Anything that makes users wait more than a few seconds should have a visual indicator.
Same than #105 but with svelte components instead
We need more visibility on CLI errors. Add optional error reporting via sentry to the CLI.
We need a way to declare different themes in a project and then apply them to the views.
Right now we rely on clickhouse's postgres interface to connect to Clickhouse with our postgres client. This is far from ideal specially considering Clickhouse's own cloud offering does not allow you to activate the postgres inteface. We need to reimplement the connector with Clickhouse's offical nodejs client.
The idea is to have a common theming system that can be shared between different client framkeworks implementations of Latitude sdk components. Svelte, React, Vue...
We have two ways of using Latitude sdk components.
This is the way you want to use if you maximum configuration. If you want to override some of the Tailwind config. This way require that you have in your dev bundler (Vite, Webpack,...) a way of running Tailwind.
You have to extend your Tailwind config with SDK client theme
// your-project/tailwind.config.js
{
extends: ["@latitude-sdk/client/theme/tailwind.config.js"],
// ... Extend with your custom config
}
### b) Use individual exported CSS files
This way is ideal if you are ok with our theme system and you just want to use the components. The components that comes from our client implementations: `@latitude-sdk/svelte`, `@latitude-sdk/react` comes without styles. If you implemented a) you will see those styles. The other way is by importing our pre-build CSS files.
You can import all the CSS generated by our components (the easiest but more heaviest way)
``` javascript
import '@latitude-sdk/client/css/all.min.css'
Or you can import only the components you use
import '@latitude-sdk/client/css/button.min.css'
import '@latitude-sdk/client/css/chart.min.css'
import '@latitude-sdk/client/css/column.min.css'
//....
Here is a starting point but the idea is to use tailwind config for each component and in the Tailwind content put only the path to the component. This way the files are smaller and can be imported individually.
Some users have asked about a potential integration wtih LLM providers that would help them develop Latitude projects and write queries. We need to invesigate the fesability of providing an AI-assistant solution without hardcoding an integration with non-OSS providers like OpenAI. To be clear, OpenAI could be one of the supported providers, but I think the solution should be provider-agnostic so that people can integrate with whatever AI solution they want.
It seems that each time the RunButton is clicked, the connector initiates a new MySQL connection, leading to an error message stating: "ER_CON_COUNT_ERROR: Too many connections
We want to offer a standalone library of react components that communicate with a Latitude backend, so that you can easily integrate more deeply Latitude into existing codebases.
CLI command with nicely formatted results so that you can debug your queries.
console.table
so that it prints results in a nice formatWe need a param
function to display parameters in views, like this:
<Input param='name' />
<Text.H1>
Hello, {param('name')}!
</Text.H1>
To create a function like this, which is 1. autoimported and 2. reactive without needing to add "$", wee can use the same method as we are doing with runQuery
, where a vite script creates the import, moves the method call to a script
tag and assignes the result to a variable, and finally replaces the original call with a suscription to that variable. After the transformation, it should look like this:
<script>
import {Β param }Β from '...';
const val = param('name');
</script>
<Input param='name' />
<Text.H1>
Hello, {$val}!
</Text.H1>
Currently the Latitude CLI update is a manual npm update -g @latitude-data/cli
, it doesn't notify when there is a new version and may cause bugs or incompatibilities. We should notify users of new CLI versions when they use a command.
We currently use node's mysql package which is old and does not support some critical features from new mysql versions. We need to migrate to mysql2 asap.
chartType
PR:
#115
Users are starting to ask how to contribute to the project. We need to add some documentation on how to get set up with development.
From the get go we tried to support whatever package manager the user was using in Latitude's CLI: pnpm yarn or npm. The problem with this is that we either have to ask the user what manager they want the CLI to use or we have to take a guess, which more often than not could be wrong. In order to deliver a more robust solution and taking into consideration our bandwith we are gonna remove support for alternative package managers and instead focus on providing a rock solid solution with npm, which ships with all versions of NodeJS and is plenty fast for all versions of node that Latitude supports.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. πππ
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google β€οΈ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.