fix(admin-ui): Improve display of long Collection paths in dropdown

Fixes #1042

packages/admin-ui/src/lib/catalog/src/components/collection-tree/collection-tree-node.component.html

@@ -92,8 +92,14 @@
                         (click)="move(collection, item.id)"
                         [disabled]="!(hasUpdatePermission$ | async)"
                     >
-                        <clr-icon shape="child-arrow"></clr-icon>
-                        {{ item.path }}
+                        <div class="move-to-item">
+                            <div class="move-icon">
+                                <clr-icon shape="child-arrow"></clr-icon>
+                            </div>
+                            <div class="path">
+                                {{ item.path }}
+                            </div>
+                        </div>
                     </button>
                     <div class="dropdown-divider"></div>
                     <button

packages/admin-ui/src/lib/catalog/src/components/collection-tree/collection-tree-node.component.scss

@@ -73,3 +73,17 @@
 .example-list.cdk-drop-list-dragging .tree-node:not(.cdk-drag-placeholder) {
     transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
 }
+
+.move-to-item {
+    display: flex;
+    white-space: normal;
+    align-items: baseline;
+
+    .move-icon {
+        flex: none;
+        margin-right: 3px;
+    }
+    .path {
+        line-height: 18px;
+    }
+}