Quadrant Selection and a few other tweaks #1090

nafiz1001 · 2025-12-24T20:42:00Z

No description provided.

UlysseFG · 2026-01-05T18:46:22Z

frontend/src/components/placementVisuals/Placement.tsx

-                                            <Radio.Button value={PlacementDirections.COLUMN}>Column</Radio.Button>
-                                        </Radio.Group>
-                                    </Flex>
+                                    <ButtonsWithSmallerPadding>


Maybe leave some padding ...The buttons are a bit too close ...

i replied on the wrong comment. oops.

UlysseFG · 2026-01-05T18:54:49Z

frontend/src/components/placementVisuals/Placement.tsx

+    theme={{
+        components: {
+            Button: {
+                paddingInline: '0.5em',


Should we as much as possible use relative measures (ie %) for components and use absolute measures for text?

em is already relative. Relative to parent font size.

yeah but the padding of the button ... how much is it really related to font size ? Makes more sense to have it related to the parent container size.

UlysseFG · 2026-01-05T19:04:44Z

frontend/src/components/placementVisuals/Placement.tsx

+                                    <ButtonsWithSmallerPadding>
+                                        <Flex justify={"space-between"} style={{ width: "100%" }}>
+                                            <Space size={"small"} style={{ border: 'solid', borderColor: 'lightgray', borderWidth: '1px', padding: '0.5em' }}>
+                                                <span>Selection:</span>


The space available for buttons is very limited ... might look better for more crowded screens (or smaller screens) to have these as small cards with Selection, Placement and Direction as title ... The buttons do spill over as soon as the menu is extended on the left which is the expected default UI.

UlysseFG · 2026-01-05T19:17:50Z

I really like the new look ... much cleaner.
I played around with it some and i am quite pleased in general ...
The only thing that should be change mechanically is that when you select a quadrant you can place as a quadrant (which should do nothing special) but the algorithm you implemented is so generic that it actually double down on "quadranting". It actually does what it is supposed to do but i suspect it might confuse the lab ... I am not sure how to treat that since you don't have a way to recognize the user intention but maybe we can reword the buttons/category to clarify. Maybe we can have Place: Sequentially | as Source | as Quadrant . Might be more obvious that they would want as source if they selected Quadrant 1.

UlysseFG · 2026-01-05T19:25:18Z

Maybe we should have :
Select : None | Invert | Quadrant , Place : Sequentially, as Source, as Quadrant, Place by : Column | Row ?

UlysseFG · 2026-01-05T20:49:51Z

Another thing that came to mind ... The tubes without parent should have the Selection Quadrant disabled and the Placement Quadrant Potentially activated... It is realistic to think maybe someone will want to place in quadrant samples that are unordered at first ... I see this would be an exception so maybe we can disable that too for now and ask Somayeh when we see her if this could be useful.

UlysseFG · 2026-01-06T15:32:25Z

frontend/src/components/placementVisuals/Placement.tsx

-                                                    <Radio.Button key={PlacementType.SEQUENTIAL} value={PlacementType.SEQUENTIAL}>Sequentially</Radio.Button>
-                                                    <Radio.Button key={PlacementType.SOURCE_PATTERN} value={PlacementType.SOURCE_PATTERN} disabled={activeSourceContainer.name === null}>as Source</Radio.Button>
-                                                    <Radio.Button key={PlacementType.QUADRANT_PATTERN} value={PlacementType.QUADRANT_PATTERN} disabled={activeSourceContainer.name === null}>as Quadrant</Radio.Button>
+                                                    <Radio.Button key={PlacementType.SEQUENTIAL} value={PlacementType.SEQUENTIAL}>Sequential</Radio.Button>


"Sequence" here

UlysseFG · 2026-01-06T15:38:38Z

frontend/src/components/placementVisuals/Placement.tsx

                                    <Button onClick={transferAllSamples} disabled={!canTransferAllSamples} style={{ marginRight: '1em' }}>Place All Source</Button>
                                    <Popconfirm
-                                        title={`Are you sure you want to undo selected samples? If there are no selected samples, it will undo all placements.`}
+                                        title={`Are you sure you want to undo 


Reword it to put the question at the end ... "You are about to undo all placement. Do you want to proceed ?"
I would prefer for this warning to be specific to the situation ... if there is any selected placed samples, "You are about to undo X placements. Do you want to proceed ?"

UlysseFG · 2026-01-06T15:45:48Z

frontend/src/components/placementVisuals/Placement.tsx

+                                                    <Button onClick={clearSelections}>None</Button>
+                                                    <Button onClick={invertSelections}>Invert</Button>
+                                                    <Dropdown menu={quadrantSelectionMenu} disabled={activeSourceContainer.name === null}>
+                                                        <Button>Quandrant</Button>


UlysseFG · 2026-01-07T20:09:05Z

frontend/src/modules/placement/selectors.ts

    return (state: RootState) => selector(selectPlacementState(state))
+}
+
+window.placement = (containerID: ParentContainerIdentifier | undefined) => {


Place behind a debug mode test if you really need this in the code ...

UlysseFG · 2026-01-07T20:09:16Z

frontend/src/store.ts

 	// not considered serializable.
 	middleware: (getDefaultMiddleware) => getDefaultMiddleware({immutableCheck: false, serializableCheck: false}).concat(logger).concat(notificationError)
 })
+window.store = store // for debugging


Place behind a debug mode test if you really need this in the code ...

UlysseFG · 2026-01-07T21:24:37Z

Might be worth adding a space container around the destination buttons (even without any additional text) to align the tables on both sides.

nafiz1001 and others added 3 commits December 24, 2025 13:21

quadrant and selection inversion

84aace0

clear selection and some tweaks

4436e2b

reduce paddding of buttons in the placement

0800e36

nafiz1001 requested a review from UlysseFG January 5, 2026 15:30

UlysseFG reviewed Jan 5, 2026

View reviewed changes

nafiz1001 added 2 commits January 5, 2026 15:31

improve behaviours of the buttons

f61c270

remove unnecessary import

d9a5eea

nafiz1001 added 3 commits January 5, 2026 16:25

simplify to make more spaces

d92d417

tubes without parent shouldn't do quadrant for now

b1d64a7

show selection count as fraction

cc54076

UlysseFG reviewed Jan 6, 2026

View reviewed changes

sequential to sequence

d3a7338

UlysseFG reviewed Jan 6, 2026

View reviewed changes

nafiz1001 added 3 commits January 6, 2026 12:52

update undo placement popup message

41a1efc

add variables to window for debugging purpose

ab76c54

correct typo

ccfa0f0

UlysseFG reviewed Jan 7, 2026

View reviewed changes

Quadrant Selection and a few other tweaks #1090

Are you sure you want to change the base?

Quadrant Selection and a few other tweaks #1090

Uh oh!

Conversation

nafiz1001 commented Dec 24, 2025

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

nafiz1001 Jan 5, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

UlysseFG commented Jan 5, 2026

Uh oh!

UlysseFG commented Jan 5, 2026

Uh oh!

UlysseFG commented Jan 5, 2026

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

UlysseFG commented Jan 7, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

nafiz1001 Jan 5, 2026 •

edited

Loading