Show in the edit-menu the mini-widgets that are out of the top/bottom bar #1559

ArturoManzoli · 2025-01-09T18:14:05Z

~~Added a 'double click to configure' feature to mini and regular widgets inside edit mode, so any configurable widget will have a direct way to open its config screen~~;
Added a panel to list and edit mini-widgets inside custom mini-widgets containers;

Screenshare.-.2025-01-09.3_02_09.PM.mp4

ES-Alexander

Added a 'double click to configure' feature to mini and regular widgets inside edit mode, so any configurable widget will have a direct way to open its config screen;

This feature works, but is there a reason to require double-clicks, instead of single clicks? Double clicks are awkward on mobile, and the extra click seems unnecessary, so I suggested single clicks in #1540.

Added a panel to list and edit mini-widgets inside custom mini-widgets containers;

The panel appears and lists the mini-widgets, and they can be deleted, but clicking the cog does not open the configuration.

Also, hovering the cards or the mini-widgets does not highlight them. I've confirmed that the mini-widget bar seems to absorb the highlight hover event intended for the mini-widgets it contains in stable as well, so we could potentially treat this as a separate bug, but that doesn't necessarily explain why hovering the listed card fails to work with highlighting at all.

rafaellehmkuhl

Agree with Eliot that we need to make things consistent. The primary configuration interface is through the cog icon, so we should use it, otherwise we are confusing users.

ArturoManzoli · 2025-01-14T19:50:17Z

On last push:

Removed the 'double click to configure' for regular and mini-widgets;
Added mini widgets custom bars as source of real mini widgets, so they will be configurable and highlighted on a mouse hover.

ES-Alexander

Seems to work as expected - nice work! 😃

The remaining things I'd want changed are already mentioned in other Issues, and are out of scope for the purpose of this PR.

rafaellehmkuhl

It seems like we are adding the panel for the MiniWidgetsBar but not for the CustomWidgetBase.

ES-Alexander · 2025-01-15T17:38:30Z

It seems like we are adding the panel for the MiniWidgetsBar but not for the CustomWidgetBase.

@rafaellehmkuhl Is that expected to work properly for general mini-widgets yet? I remember us having a discussion about Input Widgets being considered as a subset of mini-widgets, but was under the impression they're currently (still) independent, and the CustomWidgetBase is only intended for Input Widgets for now, and Mini Widget bars are only intended for standard mini-widgets.

I do agree it should at least get treated as a container, and list its elements - just noting that your screenshot example used a normal mini-widget in there.

rafaellehmkuhl · 2025-01-15T18:41:46Z

It seems like we are adding the panel for the MiniWidgetsBar but not for the CustomWidgetBase.

@rafaellehmkuhl Is that expected to work properly for general mini-widgets yet? I remember us having a discussion about Input Widgets being considered as a subset of mini-widgets, but was under the impression they're currently (still) independent, and the CustomWidgetBase is only intended for Input Widgets for now, and Mini Widget bars are only intended for standard mini-widgets.

I do agree it should at least get treated as a container, and list its elements - just noting that your screenshot example used a normal mini-widget in there.

The input widgets are already mini-widgets, but I'm not talking specifically about them here, but about the CustomWidgetBase, which can be used as a container to both "regular" mini-widgets as well as input mini-widgets.

ArturoManzoli · 2025-01-23T12:28:07Z

On last push:

Mini widgets inside CustomWidgetBase and MiniWidgetBars are now listed on the left menu and has cog and trash icons functional;
When hovering a mini widget that is inside a CustomWidgetBase, the highlight isn't shown on the left menu. Other way around is normal and Mini widgets inside MiniWidgetBars are highlighting normally. (will be addressed on a separate issue)

Screenshare.-.2025-01-23.9_22_16.AM.mp4

rafaellehmkuhl · 2025-01-23T13:00:50Z

src/components/EditMenu.vue

+                  </div>
+                  <v-divider vertical class="opacity-10 mr-1" />
+                  <div
+                    class="icon-btn mdi mdi-cog"


I think you forgot the new enable/disable cog logic here.

rafaellehmkuhl · 2025-01-23T13:05:07Z

src/stores/widgetManager.ts

-    const floatingWidgetContainers = currentView.value.widgets
+    floatingWidgetContainers.value = currentView.value.widgets
      .filter((w) => w.component === WidgetType.MiniWidgetsBar)
      .filter((w) => w.options && w.options.miniWidgetsContainer)
      .map((w) => w.options.miniWidgetsContainer)
-    return [...fixedBarContainers, ...viewBarContainers, ...floatingWidgetContainers]
+    return [...fixedBarContainers, ...viewBarContainers, ...floatingWidgetContainers.value]


Those line changes do not seen to have any effect in the code.

floatingWidgetContainers variable declaration was moved outside the const miniWidgetContainersInCurrentView computed variable.

This was changed so it will be possible to access the value from floatingWidgetContainers outside the scope of this function.
Check the change on line 649

rafaellehmkuhl · 2025-01-23T13:07:47Z

src/stores/widgetManager.ts

@@ -897,5 +917,6 @@ export const useWidgetManagerStore = defineStore('widget-manager', () => {
    editWidgetByHash,
    setMiniWidgetLastValue,
    getMiniWidgetLastValue,
+    customWidgetContainers,


This was added but is not being used anywhere?

You are right. This was exposed to be used as part of a different approach to the solution, but wasn't used outside the store.

Will be removed

rafaellehmkuhl · 2025-01-23T13:09:53Z

src/stores/widgetManager.ts

-    return allContainers.some((container) => container.widgets.some((widget) => widget.hash === miniWidgetHash))
+    return allContainers.some((container) =>
+      container.widgets.some((widget: MiniWidget) => widget.hash === miniWidgetHash)
+    )
  }


Those lines don't change the code at all. Typescript is already aware that the allContainers members are of the MiniWidget type. The typing here is redundant.

You can check that by installing a Typescript language-processor in your IDE and hovering the widget arguments of the function.

Thats because the customWidgetContainers.value that was added just above it didn't have a type on it.
I'll type it accordingly to prevent the changes you pointed

rafaellehmkuhl

Input widgets are not showing in the custom-widget-base.

ArturoManzoli · 2025-01-23T22:38:59Z

On last push:

Now each custom widget container has its own expansible panel;
All widgets types are shown;

ES-Alexander

Functionality works well for both container types :-)

A couple of small aesthetic suggestions, for clarity and consistency with the rest of the interface.

src/components/EditMenu.vue

Signed-off-by: Arturo Manzoli <[email protected]>

ArturoManzoli requested a review from rafaellehmkuhl January 9, 2025 18:14

ES-Alexander requested changes Jan 10, 2025

View reviewed changes

rafaellehmkuhl requested changes Jan 13, 2025

View reviewed changes

ArturoManzoli force-pushed the 1531-mini-widgets-outside-header-footer-arent-accessible branch from 597105d to 224c547 Compare January 14, 2025 19:48

ArturoManzoli requested review from ES-Alexander and rafaellehmkuhl January 14, 2025 19:50

ArturoManzoli force-pushed the 1531-mini-widgets-outside-header-footer-arent-accessible branch from 224c547 to 0cff2e1 Compare January 14, 2025 19:53

ES-Alexander approved these changes Jan 15, 2025

View reviewed changes

rafaellehmkuhl changed the title ~~1531 mini widgets outside header footer aren't accessible~~ Add a panel to list and edit mini-widgets inside custom mini-widgets containers Jan 15, 2025

rafaellehmkuhl requested changes Jan 15, 2025

View reviewed changes

ES-Alexander mentioned this pull request Jan 17, 2025

edit-menu: Disable cog icon for widgets that are not configurable #1577

Merged

ArturoManzoli force-pushed the 1531-mini-widgets-outside-header-footer-arent-accessible branch 3 times, most recently from 4c5d196 to a5ef5c4 Compare January 23, 2025 12:40

ArturoManzoli requested review from rafaellehmkuhl and ES-Alexander January 23, 2025 12:42

rafaellehmkuhl requested changes Jan 23, 2025

View reviewed changes

ArturoManzoli force-pushed the 1531-mini-widgets-outside-header-footer-arent-accessible branch from a5ef5c4 to dbfd9cb Compare January 23, 2025 18:06

ArturoManzoli requested a review from rafaellehmkuhl January 23, 2025 18:07

rafaellehmkuhl requested changes Jan 23, 2025

View reviewed changes

ArturoManzoli force-pushed the 1531-mini-widgets-outside-header-footer-arent-accessible branch from dbfd9cb to 07196cb Compare January 23, 2025 22:18

ArturoManzoli force-pushed the 1531-mini-widgets-outside-header-footer-arent-accessible branch from 07196cb to 6522298 Compare January 23, 2025 22:44

ArturoManzoli requested a review from rafaellehmkuhl January 23, 2025 22:46

ES-Alexander requested changes Jan 24, 2025

View reviewed changes

src/components/EditMenu.vue Outdated Show resolved Hide resolved

src/components/EditMenu.vue Outdated Show resolved Hide resolved

Edit-mode: Add panel to list custom mini-widgets bars contents

e3c75b3

Signed-off-by: Arturo Manzoli <[email protected]>

ArturoManzoli force-pushed the 1531-mini-widgets-outside-header-footer-arent-accessible branch from 6522298 to e3c75b3 Compare January 24, 2025 11:09

ArturoManzoli requested a review from ES-Alexander January 24, 2025 11:10

ES-Alexander approved these changes Jan 24, 2025

View reviewed changes

ES-Alexander mentioned this pull request Jan 24, 2025

frontend: kelp green is hard to see white text on #1611

Open

1 task

rafaellehmkuhl approved these changes Jan 24, 2025

View reviewed changes

ArturoManzoli merged commit f105fd8 into bluerobotics:master Jan 24, 2025
11 checks passed

rafaellehmkuhl changed the title ~~Add a panel to list and edit mini-widgets inside custom mini-widgets containers~~ Show in the edit-menu the mini-widgets that are out of the top/bottom bar Jan 29, 2025

ES-Alexander mentioned this pull request Feb 5, 2025

Input Widgets display as having no configuration option #1662

Closed

1 task

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Show in the edit-menu the mini-widgets that are out of the top/bottom bar #1559

Show in the edit-menu the mini-widgets that are out of the top/bottom bar #1559

ArturoManzoli commented Jan 9, 2025 •

edited

Loading

ES-Alexander left a comment

rafaellehmkuhl left a comment

ArturoManzoli commented Jan 14, 2025 •

edited

Loading

ES-Alexander left a comment

rafaellehmkuhl left a comment

ES-Alexander commented Jan 15, 2025 •

edited

Loading

rafaellehmkuhl commented Jan 15, 2025

ArturoManzoli commented Jan 23, 2025 •

edited

Loading

rafaellehmkuhl Jan 23, 2025

ArturoManzoli Jan 23, 2025

rafaellehmkuhl Jan 23, 2025

ArturoManzoli Jan 23, 2025

rafaellehmkuhl Jan 23, 2025

ArturoManzoli Jan 23, 2025 •

edited

Loading

ArturoManzoli Jan 23, 2025

rafaellehmkuhl Jan 23, 2025 •

edited

Loading

ArturoManzoli Jan 23, 2025

ArturoManzoli Jan 23, 2025

rafaellehmkuhl left a comment •

edited

Loading

ArturoManzoli commented Jan 23, 2025

ES-Alexander left a comment

Show in the edit-menu the mini-widgets that are out of the top/bottom bar #1559

Show in the edit-menu the mini-widgets that are out of the top/bottom bar #1559

Conversation

ArturoManzoli commented Jan 9, 2025 • edited Loading

ES-Alexander left a comment

Choose a reason for hiding this comment

rafaellehmkuhl left a comment

Choose a reason for hiding this comment

ArturoManzoli commented Jan 14, 2025 • edited Loading

ES-Alexander left a comment

Choose a reason for hiding this comment

rafaellehmkuhl left a comment

Choose a reason for hiding this comment

ES-Alexander commented Jan 15, 2025 • edited Loading

rafaellehmkuhl commented Jan 15, 2025

ArturoManzoli commented Jan 23, 2025 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ArturoManzoli Jan 23, 2025 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

rafaellehmkuhl Jan 23, 2025 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

rafaellehmkuhl left a comment • edited Loading

Choose a reason for hiding this comment

ArturoManzoli commented Jan 23, 2025

ES-Alexander left a comment

Choose a reason for hiding this comment

ArturoManzoli commented Jan 9, 2025 •

edited

Loading

ArturoManzoli commented Jan 14, 2025 •

edited

Loading

ES-Alexander commented Jan 15, 2025 •

edited

Loading

ArturoManzoli commented Jan 23, 2025 •

edited

Loading

ArturoManzoli Jan 23, 2025 •

edited

Loading

rafaellehmkuhl Jan 23, 2025 •

edited

Loading

rafaellehmkuhl left a comment •

edited

Loading