blocks icon indicating copy to clipboard operation
blocks copied to clipboard

WIP

Open nd0ut opened this issue 1 month ago โ€ข 1 comments

Description

Checklist

nd0ut avatar Nov 13 '25 22:11 nd0ut

[!NOTE]

Other AI code review bot(s) detected

CodeRabbit has detected other AI code review bot(s) in this pull request and will avoid duplicating their findings in the review comments. This may lead to a less comprehensive review.

Walkthrough

Migrates the codebase from a Symbiote/BaseComponent architecture to a Lit-based architecture, replacing Block/Activity/Uploader/Solution classes with Lit equivalents, moving state to a PubSub/nanostores model, refactoring many components to Lit render() lifecycle, reorganizing demos, and updating build/test/tooling and types.

Changes

Cohort / File(s) Summary
Lit core & base types
src/lit/*.ts, src/lit/LitBlock.ts, src/lit/LitActivityBlock.ts, src/lit/LitUploaderBlock.ts, src/lit/LitSolutionBlock.ts, src/lit/BaseComponent.ts, src/lit/Uid.ts, src/lit/PubSubCompat.ts, src/lit/Constructor.ts, src/lit/RegisterableElementMixin.ts, src/lit/CssDataMixin.ts, src/lit/LightDomMixin.ts, src/lit/SymbioteCompatMixin.ts, src/lit/TestModeController.ts
Add Lit-based core (LitBlock family), PubSub compatibility layer, mixins and controllers; introduce Uid type and constructor utils; provide registration, CSS-data, light-dom and Symbiote compatibility for Lit components.
Abstract โ†’ Lit migration
src/abstract/*.ts (many), src/abstract/Block.ts (deleted), src/abstract/SolutionBlock.ts (deleted), src/abstract/l10nProcessor.ts (deleted), src/abstract/testModeProcessor.ts (deleted)
Remove legacy Block implementations and processors; update abstract helpers/managers to the LitBlock/LitUploaderBlock model and adjust signatures/types accordingly.
State/data types and collections
src/abstract/TypedCollection.ts, src/abstract/TypedData.ts, src/abstract/uploadEntrySchema.ts, src/blocks/Img/utils/parseObjectToString.ts, src/utils/UID.ts
Replace Data/schema model with PubSub + Uid; rewrite TypedCollection/TypedData to use PubSub and Uid; introduce UploadEntryData and initialUploadEntryData; add UID generator utility.
Managers (locale, modal, telemetry, validation, secure uploads, a11y)
src/abstract/managers/*.ts
Migrate managers to accept LitBlock types, change visibility and APIs (many methods public), add ITelemetryManager, update lifecycle and subscription patterns to Lit-based contexts.
Uploader public API & CTX
src/abstract/UploaderPublicApi.ts, src/abstract/CTX.ts, src/abstract/buildOutputCollectionState.ts
Change UploaderPublicApi and context helpers to use LitUploaderBlock/LitBlock types, make API methods explicit/public, extend uploader state (uploadQueue, collectionErrors, etc.).
CloudImageEditor & editor controls
src/blocks/CloudImageEditor/src/* (Block, template, CropFrame, controls, slider, toolbar, elements, utils)
Reimplement editor and subcomponents as LitBlock components with @state/@property, render() methods, ref-based refs, and new lifecycle/event flows; remove old TEMPLATE and some polyfills.
Major component migrations
src/blocks/** (CameraSource, ExternalSource, DropArea, FileItem, FileItemConfig, FormInput, Icon, Img, Modal, ProgressBar, ProgressBarCommon, Select, SourceBtn, SourceList, Spinner, Thumb, UrlSource, StartFrom, ActivityHeader, etc.)
Convert many UI blocks from Block/UploaderBlock to Lit equivalents; replace static templates with render(), adopt reactive state, update lifecycle hooks and typings.
CloudImageEditor state & utils
src/blocks/CloudImageEditor/src/state.ts, src/blocks/CloudImageEditor/src/utils/*.ts
Add '*loadingOperations' state, remove obsolete presence flags, strengthen parseFilterValue to accept null/empty.
Img subsystem rework
src/blocks/Img/ImgConfig.ts, src/blocks/Img/ImgBase.ts (new), removed ImgConfig.js/ImgBase.js
Replace legacy ImgConfig/ImgBase JS with Lit/TS implementations, add CssData-backed ImgConfig, advanced ImgBase for CDN/srcset/proxy/preview handling.
Upload context, event emitter, upload list
src/blocks/UploadCtxProvider/*, src/blocks/UploadList/*, src/blocks/UploadCtxProvider/EventEmitter.ts
Update UploadCtxProvider to LitUploaderBlock; EventEmitter returns cleanup and accepts LitBlock; UploadList reworked to Lit state and render.
Solutions (file uploader pages)
src/solutions/**, demo/solutions/*, demo/bundles/*, demo/features/*, demo/external-sources/*, demo/index.html, demo/*
Reorganize and add many demo pages (bundles, solutions, features); new Lit-based demo navigator; removal of some legacy demo files.
Build, tooling and config
package.json, biome.json, scripts/*.ts, scripts/build.ts, vite.config.ts (new), tsconfig*.json, tests/*, specs/npm/npm.test.ts
Bump dependencies (lit, nanostores, vitest tooling), update biome schema and linter rules, rewrite build/minify/banner logic, move Vite config to TypeScript, adjust test imports and timeouts.
Index & public exports, types
src/index.ts, types/jsx.d.ts, src/types/exported.ts, types/test/*
Rework public exports to new Lit aliases (export LitBlock as Block, LitUploaderBlock etc.), add utilities (UID, toKebabCase), update JSX types for LitElement components and re-export types.
Removed/Deleted
many legacy files removed: demo raw pages, src/blocks/Range/*, src/blocks/Img/*.js, src/utils/waitForAttribute.ts, focus-visible polyfill, and others
Delete obsolete legacy modules and demos as part of migration.
CSS updates
src/blocks/**/*.css and demo CSS
Replace grid-gap with gap, adjust oklch syntax, introduce --visible-opacity, minor z-index/margin changes.

Estimated code review effort

๐ŸŽฏ 5 (Critical) | โฑ๏ธ ~120+ minutes

  • Focus review on:
    • Lit migration correctness across lifecycle hooks and render outputs (many components moved from template strings to render()).
    • PubSub context registration/cleanup and TypedCollection/TypedData semantics (Uid handling, context deletion).
    • CloudImageEditor and its many subcomponents (render, refs, events, state coordination).
    • Manager lifecycle changes (LocaleManager, ModalManager, ValidationManager, TelemetryManager) and their integration with LitBlock shared contexts.
    • Public API changes: UploaderPublicApi, index exports, and JSX type updates that affect downstream consumers.
    • Build/tooling changes (build scripts, vite.config.ts, package.json) to ensure CI/production builds remain correct.

Possibly related PRs

  • uploadcare/file-uploader#867 โ€” Overlapping large-scale Lit migration of core blocks and managers.
  • uploadcare/file-uploader#854 โ€” Related ValidationManager/TypedCollection changes and validation flow updates.
  • uploadcare/file-uploader#845 โ€” CloudImageEditor feature-area changes (crop presets, aspect-ratio controls, toolbar).

Suggested reviewers

  • egordidenko

Pre-merge checks and finishing touches

โŒ Failed checks (2 warnings, 1 inconclusive)
Check name Status Explanation Resolution
Description check โš ๏ธ Warning The PR description is severely incomplete and only contains an unchecked checklist item 'Test form-input' with no context, motivation, summary of changes, or any other required information from the template. Complete the description following the provided template: add a clear description of changes, link to related issues, include code snippets/GIFs if applicable, and update the checklist status. Explain why this migration was undertaken and what the key architectural changes are.
Docstring Coverage โš ๏ธ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. You can run @coderabbitai generate docstrings to improve docstring coverage.
Title check โ“ Inconclusive The title 'Migration to Lit Element' is vague and uses a generic technology term without specifying what components or systems are being migrated or what the main scope of changes is. Improve the title to be more specific about the scope of migration, such as 'Migrate block components to Lit Element' or 'Replace Symbiote blocks with Lit-based components' to clarify the primary change.
โœจ Finishing touches
  • [ ] ๐Ÿ“ Generate docstrings
๐Ÿงช Generate unit tests (beta)
  • [ ] Create PR with unit tests
  • [ ] Post copyable unit tests in a comment
  • [ ] Commit unit tests in branch feat/lit-element

Comment @coderabbitai help to get the list of available commands and usage tips.

coderabbitai[bot] avatar Nov 13 '25 22:11 coderabbitai[bot]