(web) allow using global table names in console #304

joewagner · 2024-07-24T19:20:34Z

Dimo requested the ability to use both the alias table names and the global table names in the console. This adds a toggle the allows the user to choose which option they would like to write queries in.

vercel · 2024-07-24T19:20:37Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
studio	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Aug 12, 2024 1:43am

asutula · 2024-08-10T17:26:25Z

packages/api/src/routers/projects.ts

Added a nativeMode column to the project table. You'll see updates to accommodate that here in the api as well as in the validators and store.

asutula · 2024-08-10T17:27:07Z

packages/cli/src/commands/project.ts

@@ -127,6 +127,7 @@ export const builder = function (args: Yargs) {
            teamId,
            name,
            description,
+            nativeMode: false,


When you create a new project using the CLI (and the web app), we just set native mode to false.

asutula · 2024-08-10T17:27:18Z

packages/cli/test/sql/setup_studio_test_tables.sql

@@ -31,6 +31,7 @@ CREATE TABLE `projects` (
 	`name` text NOT NULL,
 	`slug` text NOT NULL,
 	`description` text NOT NULL,
+	`native_mode` integer,


The new column here in the CLI test table definitions.

asutula · 2024-08-10T17:28:30Z

packages/client/src/index.ts

@@ -65,6 +67,9 @@ function studioAliases({
    _map = {};
    res.forEach(function (dep) {
      _map[dep.def.name] = dep.deployment.tableName;
+      if (nativeMode) {
+        _map[dep.deployment.tableName] = dep.deployment.tableName;
+      }


Our helper function to get aliases based on a Studio env id is updated to specify if we're in native mode. If so, we add additional entries to the alias map that map the native table name to itself.

asutula · 2024-08-10T17:29:37Z

packages/store/src/schema/index.ts

@@ -59,6 +59,7 @@ export const projects = sqliteTable("projects", {
  name: text("name").notNull(),
  slug: text("slug").notNull(),
  description: text("description").notNull(),
+  nativeMode: integer("native_mode"),


The new column added to the drizzle schema definition.

asutula · 2024-08-10T17:32:33Z

packages/web/app/[team]/[project]/settings/_components/edit-project.tsx

This is the form to edit a project's settings. Added a switch to toggle on and off native mode.

asutula · 2024-08-10T17:34:05Z

packages/web/components/console-tabs.tsx

+  // This is optional because a previous version stored
+  // a single result for all environments under the key
+  // "result". This update stores results per environment.
+  results?: Record<string, Result<Record<string, unknown>> | undefined>;


This is something I just noticed needed to be fixed. We were previously storing the query results for a tab in a way where if you have many envs and switched between them, the results were shared. This changes to store the results per env.

asutula · 2024-08-10T17:36:24Z

packages/web/components/console-tabs.tsx

+  const tabsStorageKey = nativeMode
+    ? `env_tabs_${environmentId}`
+    : `project_tabs_${projectId}`;
+


This is an important little thing. When we store the tabs data in local storage, we want to store it per project if we're not in native mode all the tabs are shared between envs. This gives you a nice UX where you can run a console query, then switch envs and quickly execute the same query.

But if we are in native mode, we can't share queries across envs because the full tableland table names are not necessarily available in every env. So in this case, we store the tabs data per env id.

asutula · 2024-08-10T17:37:12Z

packages/web/components/console.tsx

+  const schema = deployments.reduce<Record<string, string[]>>(
+    (acc, deployment) => {
+      const cols = deployment.def.schema.columns.map((col) => col.name);
+      const aliased = { [deployment.def.name]: cols };
+      const native = nativeMode
+        ? { [deployment.deployment.tableName]: cols }
+        : {};
+      return {
+        ...acc,
+        ...aliased,
+        ...native,
+      };
+    },
+    {},
+  );


This is our console schema that provides auto completions. Updated it to support native mode here.

asutula · 2024-08-10T17:37:47Z

packages/web/components/sidebar-link.tsx

+          {subtitle && (
+            <div
+              className="truncate text-xs text-muted-foreground"
+              title={subtitle}
+            >
+              {subtitle}
+            </div>
+          )}


New optional subtitle prop used to display a subtitle here.

asutula · 2024-08-10T17:45:57Z

I guess I can't add your as a reviewer on your own PR @joewagner. This is ready. Let me know how you want to proceed here.

joewagner · 2024-08-11T16:25:24Z

@asutula I guess I can give this a review and then assuming you're good with everything we can merge?
I had a few minutes this morning, and started going through the basic QA stuff. I'm not sure whats going on but it seems like I can't create a project anymore. Are you able to create a project using this branch?

asutula · 2024-08-12T00:52:43Z

@asutula I guess I can give this a review and then assuming you're good with everything we can merge? I had a few minutes this morning, and started going through the basic QA stuff. I'm not sure whats going on but it seems like I can't create a project anymore. Are you able to create a project using this branch?

Sounds good @joewagner. I just fixed that bug.

* (nonce) ensure incrby does not remove ttl (#303) * Console refresh (#301) * wip on new console Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com> * better layout for console and data table Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com> * more query validation, multiple statement support Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com> * remove old files Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com> * remove old code editor and deps Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com> * layout fix Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com> * working tabs Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com> * support esc key to cancel edit tab name Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com> * persisted tab data Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com> * shared wallet status component and supporting changes Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com> * little css cleanup Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com> * store tab data per project Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com> * combining conditional logic Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com> --------- Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com> Co-authored-by: Aaron Sutula <asutula@users.noreply.github.com> * native mode as project setting, scope tab results to env Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com> * support native mode in studio aliases Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com> * cli fix Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com> * add native_mode columns to cli tests Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com> --------- Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com> Co-authored-by: Joe Wagner <joewagner@users.noreply.github.com> Co-authored-by: Aaron Sutula <asutula@users.noreply.github.com>

Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com>

asutula · 2024-08-12T01:50:29Z

@joewagner I just merged a couple other PRs and then rebased this branch onto main. Forced pushed to origin just now, so be sure you reset your working copy.

joewagner · 2024-08-12T17:08:15Z

@asutula This looks good and works well. I'd say you should approve and merge whenever it makes sense.

There are a couple nitpicks that I'll mention, but no need to do anything about them unless you think it's worth the time:

defaulting to "native mode" might be the most user friendly. Specifically, I don't see any reason not to show people the universally unique name in the sidebar, so maybe defaulting to that makes sense?
when I change the mode in settings, the sidebar isn't updated until I load a new page. Not a big deal, but if I'm expecting to see the name change in the sidebar and it doesn't I might be confused.

asutula · 2024-08-12T17:42:22Z

@asutula This looks good and works well. I'd say you should approve and merge whenever it makes sense.

There are a couple nitpicks that I'll mention, but no need to do anything about them unless you think it's worth the time:

defaulting to "native mode" might be the most user friendly. Specifically, I don't see any reason not to show people the universally unique name in the sidebar, so maybe defaulting to that makes sense?

when I change the mode in settings, the sidebar isn't updated until I load a new page. Not a big deal, but if I'm expecting to see the name change in the sidebar and it doesn't I might be confused.

Good points @joewagner, let me explain. We can discuss further and change things at any time...

Native mode sacrifices some other nice Studio features that make life easier. For example, when using native mode, your console queries are saved per env, not per project. This means you can't toggle between envs and easily run the same queries. So yes, we could default to native mode, but there are tradeoffs. I'd like to keep following the vision and UX of Studio as we had imagined it, and make things like native mode opt in. At least for now.
When you're in project settings, there is no env in your working context. You are at the project level. At that project level, there are no table names to display since table names come from deployed defs which are in the scope of an env. So in order to display the native table names, we need an env selected which only happens when you navigate to a table or the overview.

joewagner · 2024-08-12T18:21:34Z

Native mode sacrifices some other nice Studio features that make life easier. For example, when using native mode, your console queries are saved per env, not per project. This means you can't toggle between envs and easily run the same queries. So yes, we could default to native mode, but there are tradeoffs. I'd like to keep following the vision and UX of Studio as we had imagined it, and make things like native mode opt in. At least for now.

When you're in project settings, there is no env in your working context. You are at the project level. At that project level, there are no table names to display since table names come from deployed defs which are in the scope of an env. So in order to display the native table names, we need an env selected which only happens when you navigate to a table or the overview.

That all makes sense, let's merge 🚀

joewagner requested a review from asutula July 24, 2024 19:20

joewagner had a problem deploying to staging July 24, 2024 19:20 — with GitHub Actions Failure

joewagner requested a review from dtbuchholz July 24, 2024 19:20

joewagner marked this pull request as draft July 24, 2024 19:21

joewagner temporarily deployed to staging July 24, 2024 19:40 — with GitHub Actions Inactive

joewagner marked this pull request as ready for review July 24, 2024 19:41

vercel bot deployed to Preview July 24, 2024 19:42 View deployment

vercel bot deployed to Preview August 10, 2024 04:56 View deployment

asutula temporarily deployed to staging August 10, 2024 05:00 — with GitHub Actions Inactive

vercel bot deployed to Preview August 10, 2024 05:02 View deployment

asutula reviewed Aug 10, 2024

View reviewed changes

asutula removed the request for review from dtbuchholz August 10, 2024 17:44

asutula assigned joewagner Aug 10, 2024

asutula temporarily deployed to staging August 10, 2024 18:17 — with GitHub Actions Inactive

vercel bot deployed to Preview August 10, 2024 18:19 View deployment

asutula temporarily deployed to staging August 12, 2024 00:52 — with GitHub Actions Inactive

vercel bot deployed to Preview August 12, 2024 00:54 View deployment

asutula and others added 3 commits August 11, 2024 19:35

try out trpc utils invalidate

d197479

Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com>

fix missing nativeMode form value

e9118ca

Signed-off-by: Aaron Sutula <asutula@users.noreply.github.com>

asutula force-pushed the joe/dimo-console branch from 18e821c to e9118ca Compare August 12, 2024 01:40

asutula temporarily deployed to staging August 12, 2024 01:40 — with GitHub Actions Inactive

vercel bot deployed to Preview August 12, 2024 01:43 View deployment

asutula merged commit 9ce02e6 into main Aug 12, 2024
4 checks passed

asutula deleted the joe/dimo-console branch August 12, 2024 19:35

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

(web) allow using global table names in console #304

(web) allow using global table names in console #304

joewagner commented Jul 24, 2024

vercel bot commented Jul 24, 2024 •

edited

Loading

asutula Aug 10, 2024

asutula Aug 10, 2024

asutula Aug 10, 2024

asutula Aug 10, 2024

asutula Aug 10, 2024

asutula Aug 10, 2024

asutula Aug 10, 2024

asutula Aug 10, 2024

asutula Aug 10, 2024

asutula Aug 10, 2024

asutula commented Aug 10, 2024

joewagner commented Aug 11, 2024

asutula commented Aug 12, 2024

asutula commented Aug 12, 2024

joewagner commented Aug 12, 2024

asutula commented Aug 12, 2024

joewagner commented Aug 12, 2024

(web) allow using global table names in console #304

(web) allow using global table names in console #304

Conversation

joewagner commented Jul 24, 2024

vercel bot commented Jul 24, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

asutula commented Aug 10, 2024

joewagner commented Aug 11, 2024

asutula commented Aug 12, 2024

asutula commented Aug 12, 2024

joewagner commented Aug 12, 2024

asutula commented Aug 12, 2024

joewagner commented Aug 12, 2024

vercel bot commented Jul 24, 2024 •

edited

Loading