Some checks are pending
Bidi Control Character Guard / bidi-control-guard (push) Waiting to run
Circular Dependency Check / Check for new circular dependencies (push) Waiting to run
Citus Migration Smoke / Combined migrations on single-node Citus (push) Waiting to run
E2E Fresh Install Tests / fresh-install-e2e (push) Waiting to run
ext-v2 guardrails / Run ext-v2 guard and ESLint (push) Waiting to run
Integration Tests / Check for relevant changes (push) Waiting to run
Integration Tests / ${{ (github.event_name == 'schedule' || github.event.inputs.suite == 'full') && 'Full integration suite' || 'Tier-1 integration subset' }} (push) Blocked by required conditions
Mobile checks / Mobile lint + typecheck (push) Waiting to run
Mobile checks / Mobile unit tests (push) Waiting to run
Mobile checks / Mobile dependency audit (report) (push) Waiting to run
Mobile checks / Mobile reproducibility checks (push) Waiting to run
Secrets guard (env backups) / Ensure no tracked env backup files (push) Waiting to run
Temporal Readiness / fast-readiness (push) Waiting to run
Temporal Readiness / docker-parity (push) Waiting to run
TypeScript Type Check / Nx affected typecheck (push) Waiting to run
Unit Tests / Skipped-test budget (push) Waiting to run
Unit Tests / Nx affected unit tests (push) Waiting to run
Unit Tests / Server unit coverage (informational) (push) Waiting to run
Validate Tenant Management Schema / Check for relevant changes (push) Waiting to run
Validate Tenant Management Schema / Validate Tenant Management Schema (push) Blocked by required conditions
EE Workflows Build Guard / ee-workflows-build-guard (push) Waiting to run
Excluded: .git, node_modules, secrets/, compose.env, assemblyscript tgz Source: /opt/alga-psa on psa.joliet.tech
51 lines
3.2 KiB
Markdown
51 lines
3.2 KiB
Markdown
# Scratchpad
|
|
|
|
## Decisions
|
|
|
|
- Use a computed stacked breakpoint instead of a fixed CSS breakpoint.
|
|
- Required floating width includes palette width, sidebar width, center minimum width, floating offsets, and center padding extras.
|
|
- Preserve the existing floating layout on wide screens.
|
|
- Stack order: palette/actions, main workflow content, properties/validation.
|
|
- Use `display: contents` on the existing floating wrapper in stacked mode so the palette, center content, and sidebar can participate as ordered flex items without duplicating the Droppable/sidebar markup.
|
|
- In stacked mode, force palette and sidebar flex items to `flex-none`; otherwise the palette can shrink to zero height and visually overlap the center content.
|
|
|
|
## Relevant Files
|
|
|
|
- `ee/server/src/components/workflow-designer/WorkflowDesigner.tsx`
|
|
- `ee/server/src/components/workflow-designer/WorkflowDesignerPalette.tsx`
|
|
- `ee/server/src/components/workflow-designer/WorkflowDesignerPalette.module.css`
|
|
- `ee/server/src/components/workflow-designer/workflowDesignerSidebarSizing.ts`
|
|
|
|
## Implementation Notes
|
|
|
|
- Added `DESIGNER_CENTER_MIN_WIDTH = 640` and derive `isStacked` from current palette width, resized sidebar width, center minimum width, and layout spacing.
|
|
- Stacked mode switches the anchor to a single vertical scroll container.
|
|
- Stacked mode clears center-scroll inline padding, makes the sidebar full-width, and disables the sidebar resize handle.
|
|
- `WorkflowDesignerPalette` now accepts `layout` and `className` props so it can become full-width in stacked mode while preserving floating sizing by default.
|
|
- Added stacked-only palette CSS so the palette card has real height in normal flow, scrolls internally to 20rem, and collapses to a compact 40px row without leaving a large blank gap.
|
|
|
|
## Alga Dev Ground Truth
|
|
|
|
Target browser pane: `38155ff4-221b-444a-9e4d-f06676dfb19d`, URL `http://localhost:3226/msp/workflow-editor/8dc9052e-1408-4f03-8b48-b308602489e1`.
|
|
|
|
Observed viewport: `935x973`, which correctly triggers stacked mode.
|
|
|
|
Screenshots captured:
|
|
|
|
- `/var/folders/8g/3xyjqdpd4hx2h39h4qb2lyvm0000gn/T/ghostty-pane-ide/screenshots/workflow-stacked-cleaned-expanded.png`
|
|
- `/var/folders/8g/3xyjqdpd4hx2h39h4qb2lyvm0000gn/T/ghostty-pane-ide/screenshots/workflow-stacked-collapsed-fixed-after-click.png`
|
|
- `/var/folders/8g/3xyjqdpd4hx2h39h4qb2lyvm0000gn/T/ghostty-pane-ide/screenshots/workflow-stacked-sidebar-visible.png`
|
|
|
|
DOM measurements after cleanup:
|
|
|
|
- Expanded palette: palette rect `608x381`, center starts at palette bottom, no overlap.
|
|
- Collapsed palette: palette row rect `608x40`, center starts below it, no large blank area.
|
|
- Sidebar: rect `640x539`, `position: relative`, `width: 100%`, resize handle has `pointer-events: none` and `opacity: 0`.
|
|
|
|
## Validation Notes
|
|
|
|
- `npm --prefix ee/server run typecheck -- --pretty false` passed.
|
|
- `npm --prefix ee/server run lint -- --file ...` failed because this repo's `next lint` command does not support `--file`.
|
|
- `npx eslint ee/server/src/components/workflow-designer/WorkflowDesigner.tsx ee/server/src/components/workflow-designer/WorkflowDesignerPalette.tsx` completed with 0 errors and existing warnings in `WorkflowDesigner.tsx`.
|
|
- `git diff --check` passed before Alga Dev cleanup; rerun before handoff if additional edits are made.
|