temp

Author: benfdking

vscode/extension/tests/lineage_settings.spec.ts

@@ -0,0 +1,41 @@
+import { test } from '@playwright/test'
+import path from 'path'
+import fs from 'fs-extra'
+import os from 'os'
+import { openLineageView, SUSHI_SOURCE_PATH } from './utils'
+import { startCodeServer, stopCodeServer } from './utils_code_server'
+
+test('Turn on and off show columns', async ({ page }) => {
+  const tempDir = await fs.mkdtemp(path.join(os.tmpdir(), 'vscode-test-sushi-'))
+  await fs.copy(SUSHI_SOURCE_PATH, tempDir)
+
+  const context = await startCodeServer({
+    tempDir,
+    placeFileWithPythonInterpreter: true,
+  })
+
+  try {
+    await page.goto(`http://127.0.0.1:${context.codeServerPort}`)
+
+    await page.waitForSelector('text=models')
+
+    // Click on the models folder, excluding external_models
+    await page
+      .getByRole('treeitem', { name: 'models', exact: true })
+      .locator('a')
+      .click()
+    // Open the waiters.py model
+    await page
+      .getByRole('treeitem', { name: 'waiters.py', exact: true })
+      .locator('a')
+      .click()
+    await page.waitForSelector('text=Loaded SQLMesh Context')
+
+    // Open lineage
+    await openLineageView(page)
+
+    await page.locator('iframe >> nth=1 >> button').click()
+  } finally {
+    await stopCodeServer(context)
+  }
+})

vscode/react/src/components/graph/SettingsControl.tsx

@@ -1,10 +1,5 @@
-import { Fragment } from 'react'
 import {
   Menu,
-  Button,
-  Transition,
-  MenuItems,
-  MenuItem,
 } from '@headlessui/react'
 import { CheckIcon } from '@heroicons/react/24/outline'
 import { CogIcon } from '@/components/graph/CogIcon'
@@ -33,41 +28,29 @@ export function SettingsControl({
           aria-hidden="true"
         />
       </Menu.Button>
-      <Transition
-        as={Fragment}
-        enter="transition ease-out duration-100"
-        enterFrom="transform opacity-0 scale-95"
-        enterTo="transform opacity-100 scale-100"
-        leave="transition ease-in duration-75"
-        leaveFrom="transform opacity-100 scale-100"
-        leaveTo="transform opacity-0 scale-95"
-      >
-        <Menu.Items className="absolute bottom-full mb-2 left-0 w-56 origin-bottom-left divide-y divide-neutral-100 dark:divide-neutral-800 rounded-md bg-theme shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none z-50">
-          <div className="px-1 py-1">
-            <Menu.Item>
-              {({ active }) => (
-                <button
-                  className={clsx(
-                    'group flex w-full items-center rounded-md px-2 py-2 text-sm',
-                    active
-                      ? 'bg-primary-10 text-primary-500'
-                      : 'text-neutral-700 dark:text-neutral-300',
-                  )}
-                  onClick={() => onWithColumnsChange(!showColumns)}
-                >
-                  <span className="flex-1 text-left">Show Columns</span>
-                  {showColumns && (
-                    <CheckIcon
-                      className="h-4 w-4 text-primary-500"
-                      aria-hidden="true"
-                    />
-                  )}
-                </button>
+      <Menu.Items className="absolute bottom-0 left-full ml-2 w-56 origin-bottom-left divide-y bg-theme shadow-lg focus:outline-none z-50">
+        <Menu.Item>
+          {({ active }) => (
+            <button
+              className={clsx(
+                'group flex w-full items-center px-2 py-1 text-sm',
+                active
+                  ? 'text-[var(--vscode-foreground)] bg-[var(--vscode-button-background)]'
+                  : 'bg-[var(--vscode-button-hoverBackground)] text-[var(--vscode-foreground)]',
+              )}
+              onClick={() => onWithColumnsChange(!showColumns)}
+            >
+              <span className="flex-1 text-left">Show Columns</span>
+              {showColumns && (
+                <CheckIcon
+                  className="h-4 w-4 text-primary-500"
+                  aria-hidden="true"
+                />
               )}
-            </Menu.Item>
-          </div>
-        </Menu.Items>
-      </Transition>
+            </button>
+          )}
+        </Menu.Item>
+      </Menu.Items>
     </Menu>
   )
 }