Repository navigation
Vue migration - #1902
Merged
Merged
Vue migration#1902
Conversation
Add frontend-vue/ with Vite, Vue 3, Pinia, vue-router, Vuetify, TanStack Query and Vitest, alongside the Angular app: - Vite modes and .env files mirroring the Angular environments; SaaS modes serve index.saas.html - Runtime config.json loader, /api dev proxy, version script - Lazy Monaco (Vite-bundled workers) and Cedar wasm loaders - biome + eslint-plugin-vue lint, vue-tsc, unit tests - frontend-vue CI workflow Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Replace Vuetify with the design system copied from SiteNova: tokens (theme.css, base.css), the Ui* primitives with specs, stories and Foundations docs, the axe-core a11y gate, the design-token hygiene test and Storybook. New primitives: icon, icon button, badge, menu, drawer. Phase 1 foundations: - API client porting the token/url-params interceptors and api.service (base URL, credentials, GCLID/masterpwd, 401 redirect, error notifications, NDJSON streams) - Auth store with session handling, self-hosted store, meta-driven route guards and the full route table with the Angular paths - App shell: header, connection switcher and tabs, account menu, mobile drawer, view-as banner, feature notification, 404, snackbars; Sentry/PostHog/Amplitude setup - useDialog(), useNotify(), AppDialogForm, shared alert, banner, breadcrumbs, content loader, icon picker and the 17 skeletons - All 27 Angular services ported to Pinia stores and query composables, validators as pure functions; models, lib and consts copied over Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Port the four Angular field widget families to Vue SFCs under src/components/fields/, each widget with a spec and Storybook stories: record-edit (30), record-view (30), table-display (30) and filter (21 plus DefaultFilter), and each family's binary-data caption. - Shared contract (types.ts) and composables (useFieldWidget.ts) replace the base-* classes; `key` becomes `fieldKey` and the outputs become fieldChange / comparatorChange / copyToClipboard events - consts/*-types.ts rebuilt as defineAsyncComponent maps with the DB-type tables unchanged; widget-types.spec.ts checks them against the Angular source key by key - New primitives: UiTextarea, UiSelect, UiCheckbox, UiSegmented, UiAutocomplete; UiInput gains date/time/number/color/tel types. Specs, stories and a11y gate entries for each - AppCodeEditor (Monaco, textarea fallback in tests) and AppMarkdown (marked + DOMPurify) - v-custom-validity directive so widget validators invalidate the form - Dependencies: libphonenumber-js, color-string, postgres-interval, uuid, marked, dompurify Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Port every Angular page to Vue; each route in src/router/routes.ts now loads its view and PendingView is removed. Pages live in src/views/<area>/ and their parts in src/components/<area>/, with behaviour specs ported from the Angular ones. - Auth: login (Google sign-in, Turnstile, 2FA), setup, forget/reset/change password, email verify/change, company invitation, deleted account - Connections: list, connect/edit for every DB type, settings, auto-configure - Table browser: tables list with folders, table view with URL-synced paging/sort/filters/search, filters dialog, saved filters, export/import, AI panel (NDJSON streaming, mermaid), row view, row edit, actions, widgets and settings pages - Users and permissions with the Cedar policy editor - Saved queries/charts (vue-chartjs) and dashboards (grid-layout-plus) - Company, user settings, API keys, secrets, audit, zapier, schema editor - New primitives: v-tooltip, UiSwitch, UiRadioGroup/UiRadio, UiExpansionPanel/UiAccordion, UiTable, UiPaginator, UiDivider, UiList/UiListItem, UiSelect option groups - Dependencies: @zxcvbn-ts/*, vuedraggable, grid-layout-plus, vue-chartjs, chartjs-adapter-date-fns, mermaid, json5, node-sql-parser, @jsonurl/jsonurl Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Center the connection tabs with a three-column header grid, and stop the dashboard's route watchers from redirecting back to a table while the page is being left for another header tab. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
UiButton and UiIconButton bound useAttrs() on their root and also inherited attrs, so a menu trigger with its own @click ran the menu toggle twice and never opened (Import / Export and Table settings on every table). The dev proxy key '/api' also matched the /api-keys page, so refreshing it under `pnpm dev` served production's HTML. Anchor it to '^/api/'. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
96 tests drive the self-hosted production build in Chromium against an in-memory mock of the API (e2e/support/mock-backend.ts): auth, connections, table data and configuration, groups and audit, dashboards and panels, account/company/API key/secret settings, and a smoke pass over every route. Unmocked requests and uncaught page errors fail a test. Run with `pnpm test:e2e`. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
- Add a floating-label option to UiField and use it in filter widgets - Use UiIconButton for the UiModal close button - Fix dynamic filter row layout, table filter alignment and dashboard padding - Truncate long select display values; fix segmented selected text color Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Foreign key links hug their content, underline every wrapped line, and keep the eye icon outside the link. Related records headers are more compact and mark empty tables with the same badge as the row edit page. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Records related to the row now sit in a static right-hand panel with its own scroll, pinned under the app header. The record preview opens to its right, pinned the same way, and the bottom actions bar spans up to the panels with its buttons aligned to the form. Narrow screens keep the related records above the form. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Loading a connection's tables now bails out when the route has moved to another connection meanwhile, so the previous table isn't opened on the new connection. Adds an e2e test for switching from the header. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
The table name truncates, and the search and actions wrap as separate header items so a narrow header (side panels open) moves the actions to their own row first. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
The row edit placeholder mirrors the page header, form column and bottom-pinned save bar. A hideFooter route meta leaves out the version footer on the row edit page. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
The WHEN badge used the accent hover shade as text on the accent, so it read dark on blue; it now uses the surface colour like other accent fills. The action method toggle no longer stretches across the card. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Connection settings, table settings, widgets, automations, chart editing and query pages drop the footer. Their save bars span the page width with the buttons aligned to the form column, sit at the bottom when the form is short, and their skeletons match. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Follows prefers-color-scheme like the Angular app: theme.css re-points the semantic colour aliases at a dark navy ramp, and a new --color-on-accent token keeps text legible on accent fills. The header logo, GitHub mark, connection cards and Mermaid diagrams get dark variants. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
- routes.spec.ts snapshots every Angular route, guard and title - tablePagePath() encodes table names the way the Angular router does - Sentry transactions use Angular route templates and drop query values - Dockerfile builds frontend/ or frontend-vue/ via ARG FRONTEND Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
- Vite writes bundles to the dist root (assetsDir: ''), so the immutable-cache rule matches them and a stale chunk gets a 404 - nginx caches ttf/wasm and gzips css/wasm (Cedar wasm, codicon font) Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
FRONTEND now defaults to vue in the Dockerfile and docker-bake.hcl. Roll back with FRONTEND=angular or by reverting this commit. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
- Delete frontend/ (Angular) and rename frontend-vue/ to frontend/ - Move static assets to frontend/public/assets and the nginx config to frontend/nginx; drop vite-plugin-static-copy - Single Vue front_builder stage; drop the FRONTEND build arg - widget-types.spec.ts compares against a frozen Angular snapshot - frontend.yml runs the Vue checks plus the license check; storybook.yml builds the Vue Storybook - Update CLAUDE.md, AGENTS.md, frontend/CLAUDE.md, README and WIDGETS.md Roll back by reverting this commit and building with FRONTEND=angular. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
WalkthroughWarning Review details and warnings were omitted to fit the comment limit. |
gugu
approved these changes
Nov 4, 2026
Drop main's changes to the removed Angular frontend. Port the plan 84 logout fix to the Vue auth store: the local session clears also when the logout request fails, and a SaaS logout goes to postLogoutUrl(). Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
gugu
enabled auto-merge (squash)
November 5, 2026 13:23
![github-advanced-security[bot]](https://avatars.githubusercontent.com/in/57789?s=60&v=4){kind=small}
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
No description provided.