datajunction-ui 0.0.157 → 0.0.158

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "datajunction-ui",
-  "version": "0.0.157",
+  "version": "0.0.158",
   "description": "DataJunction UI",
   "module": "src/index.tsx",
   "repository": {

package/src/app/components/AddNodeDropdown.jsx

@@ -1,4 +1,42 @@
+import { useContext } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useCurrentUser } from '../providers/UserProvider';
+import DJClientContext from '../providers/djclient';
+
+const PERSONAL_NS_PREFIX =
+  process.env.REACT_APP_PERSONAL_NAMESPACE_PREFIX || 'users';
+
+function resolvePersonalNamespace(namespace, username) {
+  if (namespace && namespace !== 'default') return namespace;
+  if (!username) return 'default';
+  const handle = username
+    .split('@')[0]
+    .toLowerCase()
+    .replace(/[^a-z0-9_]/g, '_');
+  return `${PERSONAL_NS_PREFIX}.${handle}`;
+}
+
 export default function AddNodeDropdown({ namespace }) {
+  const djClient = useContext(DJClientContext).DataJunctionAPI;
+  const { currentUser } = useCurrentUser();
+  const navigate = useNavigate();
+  const ns = resolvePersonalNamespace(namespace, currentUser?.username);
+  const isPersonalFallback =
+    (!namespace || namespace === 'default') && currentUser?.username;
+
+  const goTo = path => async e => {
+    e.preventDefault();
+    if (isPersonalFallback) {
+      // Create the personal namespace if it doesn't exist yet (idempotent on the server)
+      try {
+        await djClient.addNamespace(ns);
+      } catch (err) {
+        console.error('Failed to ensure namespace exists:', err);
+      }
+    }
+    navigate(path);
+  };
+
   return (
     <span
       className="menu-link"
@@ -13,17 +51,26 @@ export default function AddNodeDropdown({ namespace }) {
                 Register Table
               </div>
             </a>
-            <a href={`/create/transform/${namespace}`}>
+            <a
+              href={`/create/transform/${ns}`}
+              onClick={goTo(`/create/transform/${ns}`)}
+            >
               <div className="node_type__transform node_type_creation_heading">
                 Transform
               </div>
             </a>
-            <a href={`/create/metric/${namespace}`}>
+            <a
+              href={`/create/metric/${ns}`}
+              onClick={goTo(`/create/metric/${ns}`)}
+            >
               <div className="node_type__metric node_type_creation_heading">
                 Metric
               </div>
             </a>
-            <a href={`/create/dimension/${namespace}`}>
+            <a
+              href={`/create/dimension/${ns}`}
+              onClick={goTo(`/create/dimension/${ns}`)}
+            >
               <div className="node_type__dimension node_type_creation_heading">
                 Dimension
               </div>
@@ -31,7 +78,7 @@ export default function AddNodeDropdown({ namespace }) {
             <a href={`/create/tag`}>
               <div className="entity__tag node_type_creation_heading">Tag</div>
             </a>
-            <a href={`/create/cube/${namespace}`}>
+            <a href={`/create/cube/${ns}`} onClick={goTo(`/create/cube/${ns}`)}>
               <div className="node_type__cube node_type_creation_heading">
                 Cube
               </div>

package/src/app/components/__tests__/AddNodeDropdown.test.jsx

@@ -0,0 +1,117 @@
+import * as React from 'react';
+import { render, screen, waitFor, fireEvent } from '@testing-library/react';
+import { MemoryRouter, Routes, Route } from 'react-router-dom';
+
+import AddNodeDropdown from '../AddNodeDropdown';
+import DJClientContext from '../../providers/djclient';
+import UserContext from '../../providers/UserProvider';
+
+const buildClient = () => ({
+  DataJunctionAPI: {
+    addNamespace: jest.fn().mockResolvedValue({ status: 201, json: {} }),
+  },
+});
+
+const renderDropdown = ({ namespace, user, djClient = buildClient() }) => {
+  const userCtx = {
+    currentUser: user,
+    loading: false,
+    error: null,
+    refetchUser: async () => {},
+  };
+  return {
+    djClient,
+    ...render(
+      <MemoryRouter initialEntries={['/']}>
+        <DJClientContext.Provider value={djClient}>
+          <UserContext.Provider value={userCtx}>
+            <Routes>
+              <Route
+                path="/"
+                element={<AddNodeDropdown namespace={namespace} />}
+              />
+              <Route path="/create/:nodeType/:ns" element={<div>landed</div>} />
+            </Routes>
+          </UserContext.Provider>
+        </DJClientContext.Provider>
+      </MemoryRouter>,
+    ),
+  };
+};
+
+describe('<AddNodeDropdown />', () => {
+  it('uses the explicit namespace when provided', () => {
+    renderDropdown({
+      namespace: 'finance.metrics',
+      user: { username: 'alice' },
+    });
+    expect(screen.getByText('Transform').closest('a')).toHaveAttribute(
+      'href',
+      '/create/transform/finance.metrics',
+    );
+    expect(screen.getByText('Metric').closest('a')).toHaveAttribute(
+      'href',
+      '/create/metric/finance.metrics',
+    );
+  });
+
+  it('falls back to users.<handle> when at the top-level namespace', () => {
+    renderDropdown({ namespace: 'default', user: { username: 'alice' } });
+    expect(screen.getByText('Transform').closest('a')).toHaveAttribute(
+      'href',
+      '/create/transform/users.alice',
+    );
+  });
+
+  it('falls back to users.<handle> when namespace is undefined', () => {
+    renderDropdown({ namespace: undefined, user: { username: 'alice' } });
+    expect(screen.getByText('Transform').closest('a')).toHaveAttribute(
+      'href',
+      '/create/transform/users.alice',
+    );
+  });
+
+  it('strips email domain and sanitizes the handle', () => {
+    renderDropdown({
+      namespace: 'default',
+      user: { username: 'Alice.B@netflix.com' },
+    });
+    // dots in the handle get replaced with underscores
+    expect(screen.getByText('Transform').closest('a')).toHaveAttribute(
+      'href',
+      '/create/transform/users.alice_b',
+    );
+  });
+
+  it('creates the personal namespace on click when falling back', async () => {
+    const { djClient } = renderDropdown({
+      namespace: 'default',
+      user: { username: 'alice' },
+    });
+    fireEvent.click(screen.getByText('Transform'));
+    await waitFor(() => {
+      expect(djClient.DataJunctionAPI.addNamespace).toHaveBeenCalledWith(
+        'users.alice',
+      );
+    });
+  });
+
+  it('does NOT call addNamespace when an explicit namespace is provided', async () => {
+    const { djClient } = renderDropdown({
+      namespace: 'finance.metrics',
+      user: { username: 'alice' },
+    });
+    fireEvent.click(screen.getByText('Transform'));
+    // give the click a tick to settle
+    await new Promise(r => setTimeout(r, 0));
+    expect(djClient.DataJunctionAPI.addNamespace).not.toHaveBeenCalled();
+  });
+
+  it('leaves the Register Table link unconditional', () => {
+    renderDropdown({ namespace: 'default', user: { username: 'alice' } });
+    expect(screen.getByText('Register Table').closest('a')).toHaveAttribute(
+      'href',
+      '/create/source',
+    );
+  });
+});

package/src/app/pages/AddEditNodePage/NodeQueryField.jsx

@@ -6,11 +6,29 @@ import React from 'react';
 import { ErrorMessage, Field, useFormikContext } from 'formik';
 import CodeMirror from '@uiw/react-codemirror';
 import { langs } from '@uiw/codemirror-extensions-langs';
+import { extractCatalogTables } from './catalogTables';
 
 export const NodeQueryField = ({ djClient, value }) => {
   const [schema, setSchema] = React.useState([]);
   const formik = useFormikContext();
   const sqlExt = langs.sql({ schema: schema });
+  const autoRegisterTimer = React.useRef(null);
+  const registeredTables = React.useRef(new Set());
+  // useRef so the onChange closure always sees the latest catalog list
+  const knownCatalogsRef = React.useRef([]);
+
+  React.useEffect(() => {
+    if (typeof djClient.catalogs !== 'function') return;
+    Promise.resolve(djClient.catalogs())
+      .then(catalogs => {
+        knownCatalogsRef.current = (catalogs || []).map(c =>
+          c.name.toLowerCase(),
+        );
+      })
+      .catch(() => {
+        // Auto-register is best-effort; failing to load catalogs just disables it.
+      });
+  }, [djClient]);
 
   const initialAutocomplete = async context => {
     // Based on the parsed prefix, we load node names with that prefix
@@ -44,6 +62,55 @@ export const NodeQueryField = ({ djClient, value }) => {
         setSchema(schema);
       }
     }
+
+    // Auto-register any catalog-qualified tables typed in the SQL
+    if (knownCatalogsRef.current.length > 0) {
+      clearTimeout(autoRegisterTimer.current);
+      autoRegisterTimer.current = setTimeout(
+        () => autoRegisterCatalogTables(value),
+        600,
+      );
+    }
+  };
+
+  const autoRegisterCatalogTables = async sql => {
+    const tables = extractCatalogTables(sql, knownCatalogsRef.current);
+    for (const [catalog, tableSchema, table] of tables) {
+      const key = `${catalog}.${tableSchema}.${table}`;
+      if (registeredTables.current.has(key)) continue;
+      // If autocomplete already saw this node, DJ knows about it — skip silently
+      if (schema[key] !== undefined) {
+        registeredTables.current.add(key);
+        continue;
+      }
+      registeredTables.current.add(key);
+
+      let response;
+      try {
+        response = await djClient.registerTable(
+          catalog,
+          tableSchema,
+          table,
+          '',
+        );
+      } catch {
+        registeredTables.current.delete(key);
+        continue;
+      }
+      const { status, json } = response;
+      if (status === 200 || status === 201) {
+        const nodeName = json?.name || key;
+        const columns = (json?.columns || []).map(col => col.name);
+        schema[nodeName] = columns;
+        if (table && table !== nodeName) {
+          schema[table] = columns;
+        }
+        setSchema(schema);
+      } else if (status !== 409) {
+        // 409 = already exists (silent); other errors: allow retry on next edit
+        registeredTables.current.delete(key);
+      }
+    }
   };
 
   return (

package/src/app/pages/AddEditNodePage/__tests__/NodeQueryField.test.jsx

@@ -7,6 +7,10 @@ describe('NodeQueryField', () => {
   const mockDjClient = {
     nodes: jest.fn(),
     node: jest.fn(),
+    catalogs: jest.fn().mockResolvedValue([]),
+    registerTable: jest
+      .fn()
+      .mockResolvedValue({ status: 200, json: { name: '' } }),
   };
   const renderWithFormik = (djClient = mockDjClient) => {
     return render(

package/src/app/pages/AddEditNodePage/__tests__/catalogTables.test.jsx

@@ -0,0 +1,65 @@
+import { extractCatalogTables } from '../catalogTables';
+
+describe('extractCatalogTables', () => {
+  it('extracts a 3-part identifier when the catalog matches', () => {
+    const result = extractCatalogTables(
+      'select * from prodhive.dse_dev.identity_ab_alloc_f f',
+      ['prodhive'],
+    );
+    expect(result).toEqual([['prodhive', 'dse_dev', 'identity_ab_alloc_f']]);
+  });
+
+  it('extracts multiple distinct tables', () => {
+    const result = extractCatalogTables(
+      'select a.* from prodhive.s1.t1 a join prodhive.s2.t2 b on a.id = b.id',
+      ['prodhive'],
+    );
+    expect(result).toEqual([
+      ['prodhive', 's1', 't1'],
+      ['prodhive', 's2', 't2'],
+    ]);
+  });
+
+  it('deduplicates the same table referenced twice in the same query', () => {
+    const result = extractCatalogTables(
+      'select * from prodhive.s.t a join prodhive.s.t b on a.id = b.id',
+      ['prodhive'],
+    );
+    expect(result).toEqual([['prodhive', 's', 't']]);
+  });
+
+  it('skips 3-part identifiers whose catalog is not in the known list', () => {
+    const result = extractCatalogTables(
+      'select * from foo.bar.baz, prodhive.s.t',
+      ['prodhive'],
+    );
+    expect(result).toEqual([['prodhive', 's', 't']]);
+  });
+
+  it('matches catalog name case-insensitively', () => {
+    const result = extractCatalogTables('select * from ProdHive.s.t', [
+      'prodhive',
+    ]);
+    expect(result).toEqual([['ProdHive', 's', 't']]);
+  });
+
+  it('handles backtick-quoted identifiers', () => {
+    const result = extractCatalogTables(
+      'select * from `prodhive`.`my_schema`.`my_table`',
+      ['prodhive'],
+    );
+    expect(result).toEqual([['prodhive', 'my_schema', 'my_table']]);
+  });
+
+  it('returns nothing when no catalog is known', () => {
+    const result = extractCatalogTables('select * from prodhive.s.t', []);
+    expect(result).toEqual([]);
+  });
+
+  it('returns nothing when the SQL contains no 3-part identifiers', () => {
+    const result = extractCatalogTables('select * from my_node where x > 0', [
+      'prodhive',
+    ]);
+    expect(result).toEqual([]);
+  });
+});

package/src/app/pages/AddEditNodePage/catalogTables.js

@@ -0,0 +1,24 @@
+// Matches catalog.schema.table (3-part dot-separated identifiers, backtick-quoted or plain)
+const CATALOG_TABLE_PATTERN =
+  /`?([a-zA-Z_][a-zA-Z0-9_]*)`?\.`?([a-zA-Z_][a-zA-Z0-9_]*)`?\.`?([a-zA-Z_][a-zA-Z0-9_]*)`?/;
+
+/**
+ * Extracts all `catalog.schema.table` references in `sql` whose catalog is in
+ * `knownCatalogs` (case-insensitive). Returns deduplicated [catalog, schema, table] tuples.
+ */
+export function extractCatalogTables(sql, knownCatalogs) {
+  const re = new RegExp(CATALOG_TABLE_PATTERN.source, 'g');
+  const known = new Set(knownCatalogs.map(c => c.toLowerCase()));
+  const seen = new Set();
+  const out = [];
+  let m;
+  while ((m = re.exec(sql)) !== null) {
+    const [, catalog, schema, table] = m;
+    if (!known.has(catalog.toLowerCase())) continue;
+    const key = `${catalog}.${schema}.${table}`;
+    if (seen.has(key)) continue;
+    seen.add(key);
+    out.push([catalog, schema, table]);
+  }
+  return out;
+}

package/src/app/services/DJService.js

@@ -838,17 +838,25 @@ export const DataJunctionAPI = {
     return { status: response.status, json: await response.json() };
   },
 
-  registerTable: async function (catalog, schema, table) {
-    const response = await fetch(
+  registerTable: async function (
+    catalog,
+    schema,
+    table,
+    sourceNodeNamespace = undefined,
+  ) {
+    const url = new URL(
       `${DJ_URL}/register/table/${catalog}/${schema}/${table}`,
-      {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-        },
-        credentials: 'include',
-      },
     );
+    if (sourceNodeNamespace !== undefined) {
+      url.searchParams.set('source_node_namespace', sourceNodeNamespace);
+    }
+    const response = await fetch(url.toString(), {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      credentials: 'include',
+    });
     return { status: response.status, json: await response.json() };
   },