IBX-8132: [UDW] For object relation field user can remove selected it…

…em from bookmarks
ibexa · Sep 9, 2024 · 7b193ed · 7b193ed
1 parent 95a99fb
commit 7b193ed
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 16 deletions.
diff --git a/src/bundle/Resources/translations/ibexa_universal_discovery_widget.en.xliff b/src/bundle/Resources/translations/ibexa_universal_discovery_widget.en.xliff
@@ -306,6 +306,11 @@
         <target state="new">Collapse sidebar</target>
         <note>key: selected_locations.collapse.sidebar</note>
       </trans-unit>
+      <trans-unit id="cc263557dd2c35c602e3141118c18e073037e64e" resname="selected_locations.deselect">
+        <source>Deselect</source>
+        <target state="new">Deselect</target>
+        <note>key: selected_locations.deselect</note>
+      </trans-unit>
       <trans-unit id="d4462bb9386e96a0984586618fbfbcd0852fd4ea" resname="selected_locations.deselect_all">
         <source>Deselect all</source>
         <target state="new">Deselect all</target>
@@ -316,9 +321,14 @@
         <target state="new">Expand sidebar</target>
         <note>key: selected_locations.expand.sidebar</note>
       </trans-unit>
+      <trans-unit id="bf47c835d854950ac03649e090fb22ff39a5ef4e" resname="selected_locations.selected_item">
+        <source>%count% selected item</source>
+        <target state="new">%count% selected item</target>
+        <note>key: selected_locations.selected_item</note>
+      </trans-unit>
       <trans-unit id="fe05e738022445778cb775ca099ba54291ae88e9" resname="selected_locations.selected_items">
-        <source>%count% selected item(s)</source>
-        <target state="new">%count% selected item(s)</target>
+        <source>%count% selected items</source>
+        <target state="new">%count% selected items</target>
         <note>key: selected_locations.selected_items</note>
       </trans-unit>
       <trans-unit id="6b02292efbef3c6800f618acb3c41f968d9ea305" resname="sorting.date.label">

diff --git a/...i-dev/src/modules/universal-discovery/components/selected-locations/selected.locations.js b/...i-dev/src/modules/universal-discovery/components/selected-locations/selected.locations.js
@@ -19,6 +19,7 @@ const SelectedLocations = () => {
     const [selectedLocations, dispatchSelectedLocationsAction] = useContext(SelectedLocationsContext);
     const allowConfirmation = useContext(AllowConfirmationContext);
     const [isExpanded, setIsExpanded] = useState(false);
+    const areMultilocationsSelected = selectedLocations.length > 1;
     const className = createCssClassNames({
         'c-selected-locations': true,
         'c-selected-locations--expanded': isExpanded,
@@ -42,11 +43,17 @@ const SelectedLocations = () => {
         setIsExpanded(!isExpanded);
     };
     const renderSelectionCounter = () => {
-        const selectedLabel = Translator.trans(
-            /*@Desc("%count% selected item(s)")*/ 'selected_locations.selected_items',
-            { count: selectedLocations.length },
-            'ibexa_universal_discovery_widget',
-        );
+        const selectedLabel = areMultilocationsSelected
+            ? Translator.trans(
+                  /*@Desc("%count% selected items")*/ 'selected_locations.selected_items',
+                  { count: selectedLocations.length },
+                  'ibexa_universal_discovery_widget',
+              )
+            : Translator.trans(
+                  /*@Desc("%count% selected item")*/ 'selected_locations.selected_item',
+                  { count: selectedLocations.length },
+                  'ibexa_universal_discovery_widget',
+              );
 
         return <div className="c-selected-locations__selection-counter">{selectedLabel}</div>;
     };
@@ -67,11 +74,9 @@ const SelectedLocations = () => {
         );
     };
     const renderActionButtons = () => {
-        const removeAllLabel = Translator.trans(
-            /*@Desc("Deselect all")*/ 'selected_locations.deselect_all',
-            {},
-            'ibexa_universal_discovery_widget',
-        );
+        const removeLabel = areMultilocationsSelected
+            ? Translator.trans(/*@Desc("Deselect all")*/ 'selected_locations.deselect_all', {}, 'ibexa_universal_discovery_widget')
+            : Translator.trans(/*@Desc("Deselect")*/ 'selected_locations.deselect', {}, 'ibexa_universal_discovery_widget');
 
         return (
             <div className="c-selected-locations__actions">
@@ -80,7 +85,7 @@ const SelectedLocations = () => {
                     className="c-selected-locations__clear-selection-button btn ibexa-btn ibexa-btn--small ibexa-btn--secondary"
                     onClick={clearSelection}
                 >
-                    {removeAllLabel}
+                    {removeLabel}
                 </button>
             </div>
         );
@@ -107,6 +112,10 @@ const SelectedLocations = () => {
     };
 
     useEffect(() => {
+        if (!allowConfirmation) {
+            return;
+        }
+
         parseTooltip(refSelectedLocations.current);
         hideAllTooltips();
 

diff --git a/src/bundle/ui-dev/src/modules/universal-discovery/components/tab/tab.js b/src/bundle/ui-dev/src/modules/universal-discovery/components/tab/tab.js
@@ -8,16 +8,15 @@ import SelectedLocations from '../selected-locations/selected.locations';
 import ContentCreateWidget from '../content-create-widget/content.create.widget';
 import ContentMetaPreview from '../../content.meta.preview.module';
 
-import { SelectedLocationsContext, DropdownPortalRefContext, MultipleConfigContext } from '../../universal.discovery.module';
+import { SelectedLocationsContext, DropdownPortalRefContext } from '../../universal.discovery.module';
 
 const Tab = ({ children, actionsDisabledMap }) => {
     const topBarRef = useRef();
     const bottomBarRef = useRef();
     const [contentHeight, setContentHeight] = useState('100%');
     const [selectedLocations] = useContext(SelectedLocationsContext);
     const dropdownPortalRef = useContext(DropdownPortalRefContext);
-    const [multiple] = useContext(MultipleConfigContext);
-    const selectedLocationsComponent = !!selectedLocations.length && multiple ? <SelectedLocations /> : null;
+    const selectedLocationsComponent = !!selectedLocations.length ? <SelectedLocations /> : null;
     const contentStyles = {
         height: contentHeight,
     };