feat: complete Astryx theme/token integration (spec #5) - #6
Closed
Ouaziz-chedli wants to merge 24 commits into
Closed
feat: complete Astryx theme/token integration (spec #5)#6Ouaziz-chedli wants to merge 24 commits into
Ouaziz-chedli wants to merge 24 commits into
Conversation
…tion), Codegen, Execution, PipelineDocument, Connection+JobRunner+Watcher
- Catalog deep: single Block IR, load()/get()/get_source()/snapshot(), FS vs in-memory adapters, owns BLOCK_SOURCES, ETag retained
- Validation deep: validate()->{valid,errors,order}, single family table, topo deque, retires Graph/ConfigLoader/Pipeline (routes /validate now via Validation, total deletion noted in #4)
- Codegen deep: generate_with_ir()->{code,IR}, single TRUNCATE_AT + _serialize_value, CodeGenerator deprecated
- Execution deep: ExecutionBackend Local/Vast adapters + StorageAdapter + orphan cleanup (execution.py)
- Frontend deep: PipelineDocument, Connection, JobRunner, CourseWatcher stubs (pure, node-testable)
- Tests: TDD validation suite (4 tests), backend 109 passed, frontend 53 passed, build ok, ruff clean
Refs #4
…ecution, document - routes: total Graph deletion in prod — create_pipeline cycle via Validation, validate_graph via Validation, build_pipeline_model via Validation.order + BlockRegistry (no Graph), remove Graph import, delegate _is_mock_vast/_run_local to execution.LocalBackend and schedule_orphan_cleanup to execution (single owner) - __main__.py: Validation + BlockRegistry run without Graph/ConfigLoader/Pipeline - core/graph.py/config.py/pipeline.py: marked deprecated shim (prod no longer imports, file deletion next after test migration) - frontend: useAppStore delegates fingerprint/backfill to PipelineDocument deep module (single owner) Refs #4
…estroy - backend: LocalBackend now returns local-instance-id (was mock), all destroy/orphan guards skip local-instance-id (and legacy mock for compat) - vast.py: skip destroy/start for local-instance-id to avoid 400 spam - frontend: store lastJobInstanceId, ConsolePanel shows Local/GPU badge - tests: expect local-instance-id Fixes log spam Error destroying Vast.ai instance: 400 for local jobs
… launched and loading until stopped - useBlockRunner: isRunning = mutation.isPending || (jobId && !terminal) || isStopping, expose isStopping, guard onRun/onStop with isRunning, reset stopping when jobId cleared - EditorHeader: Lancer disabled/loading via isRunning (was only mutation), Arrêter disabled when !isPending and shows Arrêt… loader via isStopping Fixes Lancer not staying in loading state long enough and Arrêter states
- index.css: keep-spin exception inside reduced-motion media query (was killing all animations with * !important) - EditorHeader: Lancer/Arrêter/Sauvegarder spinners now have keep-spin class so feedback stays visible per WCAG (essential status, not decorative) Fixes spinner not spinning when clicking Lancer (was hidden by reduced-motion on user's OS)
- hover-card.tsx: deprecated @base-ui/react PreviewCard shim, now re-exports Astryx HoverCard (content prop) + compat shims - BlockSegments.tsx ParamInfo: remove pointerX/alignOffset hack, use Astryx HoverCard placement=above + content, keep same metadata UI - Build: editor 227k->150k, @base-ui now unused (can be removed next) Refs Astryx migration 1→3→4→2
- dialog.tsx: remove legacy open prop, now only isOpen (Astryx), single seam - ExportModal/SampleDataModal/UnsavedChangesDialog: use isOpen prop - Prepares for Icon (3) and Layout (2) seams — hover-card already done (1/4) Refs Astryx migration 1→3→4→2
- Wrap lucide SVG components via Icon icon={Comp} size=xsm|sm|md|lg (semantic where available, e.g. check)
- Keep Loader2/Play/Square direct where fill/animation needed but add keep-spin
- Files: BlockSegments, ConsolePanel, ExportModal, SampleDataModal, UnsavedChangesDialog, Toast, Hero*, HomeNav, EditorHeader
- Lucide remains as SVG source (Astryx docs: pass ComponentType for non-semantic), Base UI already removed via HoverCard
Refs Astryx migration 1→3→4→2
- ConsolePanel header flex divs -> HStack gap=2 (deep seam, was raw div with inline theme tokens) - Header now uses Astryx layout seam (Stack/HStack) per styling doc xstyle, keep floating-panel container as Card-like but inner layout via Astryx - Preserves Local/GPU badge + collapse logic, build ok Refs Astryx migration 1→3→4→2
- EditorHeader Lancer Play/Loader2 15→12, Arreter Square/Loader2 13→12, Undo2/Redo2/MoreVertical md→sm (16 not 20) - ConsolePanel Chevron md→sm - Keeps keep-spin, now visibly smaller per feedback
- EditorHeader left pill and header-actions flex divs -> HStack gap 3/2 (deep layout seam, was raw div with inline theme tokens) - ConsolePanel header flex divs already migrated to HStack in previous commit, keep - Keeps floating-panel outer div as is (custom backdrop), inner layout via Astryx per styling doc xstyle Refs Astryx migration 1→3→4→2
…Stack + remove @base-ui - FlowCanvas CoursPanel: raw flex column divs -> VStack/Stack, course.title div -> Heading level=4 (Astryx Text seam, Tailwind stays via @import) - Remove @base-ui/react (was only HoverCard shim, now Astryx HoverCard content prop, build 150k) - React kept (19.2.8, shows Catalog/Pipeline/Job), Tailwind kept (index.css @import tailwindcss + @stylex, Astryx runs on React) Refs Astryx 1→3→4→2
…ontinued) - OutputCard raw divs (rgba bg, border, radius 10) -> Card variant=muted padding=2 + VStack - header div -> Text type=label, metric values -> Text, grid values -> Astryx Text - ResultsPanel empty state div -> Text, container flex column -> VStack gap=2 - Keeps theme.color.* for status colors (React + Tailwind stay), pure layout via Astryx
… continued) - Raw div flex column gap 10 -> VStack gap=2 - Header divs -> Heading level=5 + Text supporting/body - Entrées/Sorties labels -> Text label, entries -> Text body - SelectedOutputs empty -> Text, container -> VStack, header -> VStack - Output card div rgba bg/border -> Card variant=muted + VStack - Keeps theme colors for status, gap via Astryx, floating-panel backdrop kept Build ok
…ontinued) - labelCell span -> Text type=label color=secondary (Block param label for Pipeline) - Keeps grid layout (gridColumn/row), removes raw labelStyle div - Build ok
…d (2/4) - h1/h2/h3/p raw divs -> Heading level=1/2/3/5 + Text body/supporting - div flex layouts -> VStack/HStack/Stack, card containers -> Card variant=default - Keep theme accent for numbered badges, Play icon now via Icon size=sm - Build ok
- TeamCard h3/p raw styles -> Heading/Text, inner flex -> VStack - PocSection h2/p/div flex -> Heading/Text + VStack/HStack/Card - AboutPage sections h1/h2/p -> Heading/Text, grid columns 4 -> Grid, intro/team wrappers -> Stack/VStack - Keeps Catalog/Pipeline/Job domain language via CONTEXT.md (no domain change) - Build ok, vitest 53 passed
- sectionTitle div -> Text label, error/loading divs -> Text - sampleCard raw flex div -> Card muted + HStack/VStack + Heading - Utiliser button -> Button primary, Choisir button -> Button ghost with Icon - Keeps Dialog isOpen seam, removes theme.* inline styles for Pipeline sample selection
…/4 continued) - ParamInfo hover card header/desc/metrics raw div/span -> Text label/body/supporting - Keeps HoverCard content seam (Catalog Block param metadata), preserves type/min/max/opts display for Pipeline Block params - Build ok, vitest 53 passed
…on (2/4) - Raw button ghostBtn + disabled opacity/cursor -> IconButton variant=ghost isDisabled, keeps Ctrl+Z tooltip via label - Imports HStack+IconButton from core (no new dep), build ok, vitest 53 passed
…2/4) - errMsg span -> Text type supporting with errorLight color via style - Keeps validBorder logic, HoverCard content already Astryx - Build ok, vitest 53 passed
…2/4) - Read-only param pill span with fieldPill style -> Badge variant=neutral - Removes fieldPill CSS, keeps Pipeline Block preview consistent with Catalog badge vocabulary - Build ok, vitest 53 passed
…xt (2/4) - fileCard span -> HStack gap=1 for Pipeline Block file param (uploading/error/hasUrl states) - fileName/fileMeta spans -> Text with file style tokens - Keeps upload logic (Pipeline file handling), fileBtn/removeBtn raw for now (keeps input refs) - Build ok, vitest 53 passed
- Mount Theme provider with mlblockTheme (defineTheme extends neutralTheme, brown/dark tokens for --color-accent/background/body/surface/text/border/success/error/warning) + mode dark - Fix BlockSegments Loader2 wrapping (Icon contract) and thin hover-card shim to lean re-export - Migrate auth forms Login/Register to TextInput + status (Field) keeping RHF+zod - Migrate EditorHeader Save/Stop/Run to Button variant/isLoading, ConsolePanel tabs to ToggleButtonGroup, FlowPalette search to TextInput - Keep React+Tailwind + layer order, add @stylexjs readiness Closes #5
Collaborator
Author
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
1 participant
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.
Closes #5
Implements spec #5 — complete Astryx theme/token integration and finish primitive migration.
Blockers fixed:
Theme theme={mlblockTheme} mode=dark) withdefineTheme extends neutralThemetokens for brown/dark palette (--color-accent/background/body/surface/text/border/success/error/warning)TextInput + status(keeps RHF+zod)reset,theme,base,astryx-base,astryx-theme,components,utilities)Verification:
vite build ✓,vitest 53 passed, verified against@astryxdesign/core/theme+@astryxdesign/theme-neutraldocs.