pixiebrix-extension icon indicating copy to clipboard operation
pixiebrix-extension copied to clipboard

Show unavailable bricks in Add Brick modal as greyed out with reason

Open twschiller opened this issue 3 years ago • 1 comments

Context

  • Users get confused when they can't find a brick in Search Brick modal
  • We can't expect new users to have a mental modal for why renderer/effect bricks aren't available in certain places
  • The Page Editor currently hides bricks that aren't available
  • Users get confused
  • In the future, we will also want to indicate suggested bricks based on what the user has created

Implementation Sketch

  • Replace the current availability check with a method that returns a message if the brick is unavailable
  • Show unavailable bricks as greyed out and provide a message on hover

Considerations

  • Should we still allow the user to add the brick even if it's unavailable? I think we should. The Page Editor will then show an error so the user will have to remove/move the brick

Design

  • @icugideon could you coordinate with @BLoe on design for showing unavailable bricks

Related Issues

  • https://github.com/pixiebrix/pixiebrix-extension/issues/3849

twschiller avatar Jul 22 '22 12:07 twschiller

Implementation Sketch for how to re-use existing analyses for the Add Brick modal. This approach is called "speculative analysis", you analyze the potential future states of the application by performing the change on a copy and running an off the shelf analysis

  1. Write an adapter function that takes, the:
    • Copy of the current element state
    • Brick
    • Position
  2. The adapter inserts the brick at position
  3. The adapter runs the analysis
  4. The adapter finds any annotations that were generated for the brick (taking the brick-level annotations, not the field-level annotations)
  5. The adapter returns the annotations generated for the brick

For the Add Brick modal, you just need to run the analyses the produce brick level feedback (e.g., the brick type analysis)

twschiller avatar Aug 28 '22 12:08 twschiller

We'll use this issue to start practicing writing specs. @BLoe will look at the Product Specification Checklist

corinnemayans avatar Sep 09 '22 19:09 corinnemayans