[COMPASS-6234] Update `compass-aggregations` builder UI view components to LeafyGreen components Created: 25/Oct/22  Updated: 16/Dec/22  Resolved: 16/Dec/22

Status: Closed
Project: Compass
Component/s: Aggregation pipeline, UI / UX
Affects Version/s: None
Fix Version/s: 1.35.0

Type: Task Priority: Major - P3
Reporter: Rhys Howell Assignee: Le Roux Bodenstein
Resolution: Done Votes: 0
Labels: milestone-4
Remaining Estimate: Not Specified
Time Spent: Not Specified
Original Estimate: Not Specified

Issue Links:
Depends
is depended on by COMPASS-5579 Remove global styles Closed
Duplicate
is duplicated by COMPASS-6089 Convert saved queries and pipeline po... Closed
Related
is related to COMPASS-6233 Update aggregations settings input co... Closed
Epic Link: COMPASS-5388
Story Points: 5
Documentation Changes: Not Needed
Sprint: Iteration Octopus, Iteration Porpoise, Iteration Quahog

 Description   
  • The following components in the stage are updated to leafygreen components:
    • Buttons icons
    • Drag icon
    • Preview text
    • Empty content text
    • Header stage text
    • Pipeline stage select combobox info
    • Add stage below tooltip
    • Buttons
    • Icons (Replace font-awesome with @leafygreen-ui/icons)
    • Cards
    • Text components
    • Spacing
    • Add stage button
    • Preview loader replace with spin loader from compass components
    • Pipeline stage selector use combobox
  • The add stage button is updated to leafygreen.


 Comments   
Comment by Githook User [ 15/Dec/22 ]

Author:

{'name': 'Le Roux Bodenstein', 'email': 'lerouxb@gmail.com', 'username': 'lerouxb'}

Message: feat(aggregations): Update aggregations stage components COMPASS-6234 (#3878)

  • stage as KeylineCard
  • stage preview toolbar leafygreen
  • stage editor toolbar leafygreen
  • convert stage-operator-select.tsx
  • resize handle dark mode
  • fix stage editor toolbar dark mode
  • stage editor leafygreen and darkmode
  • fix position of the resize line
  • darkmode support for toolbar error background
  • stage preview leafygreen, compass components
  • drive-by
  • remove editor border and margin
  • warning styles
  • tweaks
  • fix up atlas deployed bits
  • typo fix
  • type fixes / workarounds
  • properly fix typescript
  • fix after merge
  • prettier
  • fix up tests
  • reformat
  • don't show the yellow border for empty stages or when there's no stage operator
  • left-align banner text
Comment by Githook User [ 14/Dec/22 ]

Author:

{'name': 'Le Roux Bodenstein', 'email': 'lerouxb@gmail.com', 'username': 'lerouxb'}

Message: feat(aggregations): Update aggregations stage components COMPASS-6234 (#3878)

  • stage as KeylineCard
  • stage preview toolbar leafygreen
  • stage editor toolbar leafygreen
  • convert stage-operator-select.tsx
  • resize handle dark mode
  • fix stage editor toolbar dark mode
  • stage editor leafygreen and darkmode
  • fix position of the resize line
  • darkmode support for toolbar error background
  • stage preview leafygreen, compass components
  • drive-by
  • remove editor border and margin
  • warning styles
  • tweaks
  • fix up atlas deployed bits
  • typo fix
  • type fixes / workarounds
  • properly fix typescript
  • fix after merge
  • prettier
  • fix up tests
  • reformat
  • don't show the yellow border for empty stages or when there's no stage operator
  • left-align banner text
Comment by Githook User [ 08/Dec/22 ]

Author:

{'name': 'Le Roux Bodenstein', 'email': 'lerouxb@gmail.com', 'username': 'lerouxb'}

Message: feat(aggregations): Implement new input docs card design COMPASS-6234 (#3864)

  • new input docs card design
  • :lipstick:
  • remove isExpanded from the store
  • rename component
  • fix some tests
  • linting
  • Update packages/compass-aggregations/src/components/pipeline-builder-input-documents.tsx

Co-authored-by: Rhys <Anemy@users.noreply.github.com>

  • feedback
  • undo the isExpanded thing
  • whitespace

Co-authored-by: Rhys <Anemy@users.noreply.github.com>
Branch: counts
https://github.com/mongodb-js/compass/commit/ef440afd29cd03762851a9e6c68495190916d8e8

Comment by Githook User [ 07/Dec/22 ]

Author:

{'name': 'Le Roux Bodenstein', 'email': 'lerouxb@gmail.com', 'username': 'lerouxb'}

Message: feat(aggregations): Implement new input docs card design COMPASS-6234 (#3864)

  • new input docs card design
  • :lipstick:
  • remove isExpanded from the store
  • rename component
  • fix some tests
  • linting
  • Update packages/compass-aggregations/src/components/pipeline-builder-input-documents.tsx

Co-authored-by: Rhys <Anemy@users.noreply.github.com>

  • feedback
  • undo the isExpanded thing
  • whitespace

Co-authored-by: Rhys <Anemy@users.noreply.github.com>
Branch: 1.35-releases
https://github.com/mongodb-js/compass/commit/ef440afd29cd03762851a9e6c68495190916d8e8

Comment by Githook User [ 07/Dec/22 ]

Author:

{'name': 'Le Roux Bodenstein', 'email': 'lerouxb@gmail.com', 'username': 'lerouxb'}

Message: feat(aggregations): Update some aggregation builder components to leafygreen / compass components COMPASS-6234 (#3857)

  • remove StageGrabber
  • replace fontawesome icons in aggregation builder
  • replace one more fontawesome icon
  • Change the Add Stage button
  • tweak spacing
  • fix tests, cleanup extra files
  • useDarkMode rather
  • console.log
  • missing testid
  • find and replace gone too far
  • remove hadron-react-buttons dep
  • feedback
Comment by Githook User [ 06/Dec/22 ]

Author:

{'name': 'Le Roux Bodenstein', 'email': 'lerouxb@gmail.com', 'username': 'lerouxb'}

Message: feat(aggregations): Implement new input docs card design COMPASS-6234 (#3864)

  • new input docs card design
  • :lipstick:
  • remove isExpanded from the store
  • rename component
  • fix some tests
  • linting
  • Update packages/compass-aggregations/src/components/pipeline-builder-input-documents.tsx

Co-authored-by: Rhys <Anemy@users.noreply.github.com>

  • feedback
  • undo the isExpanded thing
  • whitespace

Co-authored-by: Rhys <Anemy@users.noreply.github.com>
Branch: COMPASS-5597-scrollbars
https://github.com/mongodb-js/compass/commit/ef440afd29cd03762851a9e6c68495190916d8e8

Comment by Githook User [ 06/Dec/22 ]

Author:

{'name': 'Le Roux Bodenstein', 'email': 'lerouxb@gmail.com', 'username': 'lerouxb'}

Message: feat(aggregations): Update some aggregation builder components to leafygreen / compass components COMPASS-6234 (#3857)

  • remove StageGrabber
  • replace fontawesome icons in aggregation builder
  • replace one more fontawesome icon
  • Change the Add Stage button
  • tweak spacing
  • fix tests, cleanup extra files
  • useDarkMode rather
  • console.log
  • missing testid
  • find and replace gone too far
  • remove hadron-react-buttons dep
  • feedback
Comment by Githook User [ 06/Dec/22 ]

Author:

{'name': 'Le Roux Bodenstein', 'email': 'lerouxb@gmail.com', 'username': 'lerouxb'}

Message: feat(aggregations): Implement new input docs card design COMPASS-6234 (#3864)

  • new input docs card design
  • :lipstick:
  • remove isExpanded from the store
  • rename component
  • fix some tests
  • linting
  • Update packages/compass-aggregations/src/components/pipeline-builder-input-documents.tsx

Co-authored-by: Rhys <Anemy@users.noreply.github.com>

  • feedback
  • undo the isExpanded thing
  • whitespace

Co-authored-by: Rhys <Anemy@users.noreply.github.com>
Branch: main
https://github.com/mongodb-js/compass/commit/ef440afd29cd03762851a9e6c68495190916d8e8

Comment by Githook User [ 05/Dec/22 ]

Author:

{'name': 'Le Roux Bodenstein', 'email': 'lerouxb@gmail.com', 'username': 'lerouxb'}

Message: feat(aggregations): Update some aggregation builder components to leafygreen / compass components COMPASS-6234 (#3857)

  • remove StageGrabber
  • replace fontawesome icons in aggregation builder
  • replace one more fontawesome icon
  • Change the Add Stage button
  • tweak spacing
  • fix tests, cleanup extra files
  • useDarkMode rather
  • console.log
  • missing testid
  • find and replace gone too far
  • remove hadron-react-buttons dep
  • feedback
Comment by Githook User [ 05/Dec/22 ]

Author:

{'name': 'Le Roux Bodenstein', 'email': 'lerouxb@gmail.com', 'username': 'lerouxb'}

Message: feat(aggregations): Update some aggregation builder components to leafygreen / compass components COMPASS-6234 (#3857)

  • remove StageGrabber
  • replace fontawesome icons in aggregation builder
  • replace one more fontawesome icon
  • Change the Add Stage button
  • tweak spacing
  • fix tests, cleanup extra files
  • useDarkMode rather
  • console.log
  • missing testid
  • find and replace gone too far
  • remove hadron-react-buttons dep
  • feedback
Comment by Githook User [ 05/Dec/22 ]

Author:

{'name': 'Le Roux Bodenstein', 'email': 'lerouxb@gmail.com', 'username': 'lerouxb'}

Message: feat(aggregations): Update some aggregation builder components to leafygreen / compass components COMPASS-6234 (#3857)

  • remove StageGrabber
  • replace fontawesome icons in aggregation builder
  • replace one more fontawesome icon
  • Change the Add Stage button
  • tweak spacing
  • fix tests, cleanup extra files
  • useDarkMode rather
  • console.log
  • missing testid
  • find and replace gone too far
  • remove hadron-react-buttons dep
  • feedback
Comment by Githook User [ 05/Dec/22 ]

Author:

{'name': 'Le Roux Bodenstein', 'email': 'lerouxb@gmail.com', 'username': 'lerouxb'}

Message: feat(aggregations): Update some aggregation builder components to leafygreen / compass components COMPASS-6234 (#3857)

  • remove StageGrabber
  • replace fontawesome icons in aggregation builder
  • replace one more fontawesome icon
  • Change the Add Stage button
  • tweak spacing
  • fix tests, cleanup extra files
  • useDarkMode rather
  • console.log
  • missing testid
  • find and replace gone too far
  • remove hadron-react-buttons dep
  • feedback
Generated at Wed Feb 07 22:42:23 UTC 2024 using Jira 9.7.1#970001-sha1:2222b88b221c4928ef0de3161136cc90c8356a66.