style(web): fix prettier and eslint violations that accumulated while CI was off

`ui-style` has been disabled, so `prettier --check .` and the per-package
eslint runs have not been enforced on merges for a while and drifted.

Reformat the three files prettier flags, and fix the one eslint error in
`vscode/extension`: `lineage_settings.spec.ts` imported `FrameLocator` and
`Page` straight from `@playwright/test`, which `no-restricted-imports`
forbids for `tests/**/*.spec.ts`. Every other spec takes `Page` from
`./fixtures`, so re-export `FrameLocator` there too and import both from
the fixtures module.

No behavioural changes — the reformatting is whitespace only.

Signed-off-by: Adegbite Ayoade <tripleaceme@gmail.com>

Author: tripleaceme

.devcontainer/devcontainer.json

@@ -11,10 +11,7 @@
   "postCreateCommand": "bash .devcontainer/post-create-command.sh",
   "customizations": {
     "vscode": {
-      "extensions": [
-        "ms-python.python",
-        "ms-python.vscode-pylance"
-      ]
+      "extensions": ["ms-python.python", "ms-python.vscode-pylance"]
     }
   },
   "remoteUser": "vscode"

vscode/extension/tests/fixtures.ts

@@ -60,5 +60,5 @@ export const test = base.extend<
   ],
 })
 
-// Export expect and Page from Playwright for convenience
-export { expect, Page } from '@playwright/test'
+// Export expect and commonly used Playwright types for convenience
+export { expect, FrameLocator, Page } from '@playwright/test'

vscode/extension/tests/lineage_settings.spec.ts

@@ -1,5 +1,5 @@
 import { test, expect } from './fixtures'
-import type { FrameLocator, Page } from '@playwright/test'
+import type { FrameLocator, Page } from './fixtures'
 import fs from 'fs-extra'
 import {
   openLineageView,

web/client/src/library/components/graph/ModelNode.tsx

@@ -198,7 +198,11 @@ export default function ModelNode({
       style={{
         width: '100%',
         ...(tagColor != null
-          ? { borderColor: tagColor, backgroundColor: tagColor, color: tagColor }
+          ? {
+              borderColor: tagColor,
+              backgroundColor: tagColor,
+              color: tagColor,
+            }
           : {}),
       }}
     >
@@ -246,7 +250,10 @@ export default function ModelNode({
         />
       </div>
       {showColumns && (
-        <div ref={columnsWrapperRef} style={{ height: '10rem', overflow: 'hidden' }}>
+        <div
+          ref={columnsWrapperRef}
+          style={{ height: '10rem', overflow: 'hidden' }}
+        >
           <ModelColumns
             className="nowheel rounded-b-lg bg-theme-lighter text-xs h-full"
             nodeId={id}

web/client/src/library/components/graph/help.ts

@@ -175,7 +175,10 @@ function getNodeMap({
     const model = models.get(modelName)
     const tagsStr = model?.details?.tags
     const tags = tagsStr
-      ? tagsStr.split(',').map(t => t.trim()).filter(Boolean)
+      ? tagsStr
+          .split(',')
+          .map(t => t.trim())
+          .filter(Boolean)
       : undefined
     const node = createGraphNode(modelName, {
       label: model?.displayName ?? modelName,