From d0138183775ee5bd026f56a287e6390af70490c9 Mon Sep 17 00:00:00 2001
From: Lukasz Ostafin <ostafin.lucas@gmail.com>
Date: Mon, 12 Aug 2024 13:09:30 +0200
Subject: [PATCH] Added Bookmarsk to Image Picker

---
 .../config/universal_discovery_widget.yaml    |   9 +
 src/bundle/Resources/public/scss/_mixins.scss |   1 +
 .../public/scss/mixins/_tab-selector.scss     |  43 +++++
 .../universal-discovery/_tab.selector.scss    |  42 +----
 .../hooks/useSearchByQueryFetch.js            |   5 +
 .../universal.discovery.module.js             | 173 ++++++++++--------
 6 files changed, 151 insertions(+), 122 deletions(-)
 create mode 100644 src/bundle/Resources/public/scss/mixins/_tab-selector.scss

diff --git a/src/bundle/Resources/config/universal_discovery_widget.yaml b/src/bundle/Resources/config/universal_discovery_widget.yaml
index 32feca3396..1b0f5dc1af 100644
--- a/src/bundle/Resources/config/universal_discovery_widget.yaml
+++ b/src/bundle/Resources/config/universal_discovery_widget.yaml
@@ -35,6 +35,15 @@ system:
                         browse:
                             items_per_page: 50
                             priority: 30
+                    image_picker_tabs_config:
+                        image_picker:
+                            id: 'image_picker'
+                            priority: 40
+                            hidden: false
+                        image_picker_bookmarks:
+                            id: 'image_picker_bookmarks'
+                            priority: 50
+                            hidden: false
 
                 # These inherit _default configuration
                 create:
diff --git a/src/bundle/Resources/public/scss/_mixins.scss b/src/bundle/Resources/public/scss/_mixins.scss
index 55ae909c89..b0f5406ff2 100644
--- a/src/bundle/Resources/public/scss/_mixins.scss
+++ b/src/bundle/Resources/public/scss/_mixins.scss
@@ -12,6 +12,7 @@
 @import 'mixins/containers';
 @import 'mixins/drag-and-drop';
 @import 'mixins/spinner';
+@import 'mixins/tab-selector';
 
 @mixin datetime-field() {
     &.is-invalid {
diff --git a/src/bundle/Resources/public/scss/mixins/_tab-selector.scss b/src/bundle/Resources/public/scss/mixins/_tab-selector.scss
new file mode 100644
index 0000000000..d435b5dbdd
--- /dev/null
+++ b/src/bundle/Resources/public/scss/mixins/_tab-selector.scss
@@ -0,0 +1,43 @@
+@mixin tab-selector {
+    &__item {
+        height: calculateRem(48px);
+        width: calculateRem(48px);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        cursor: pointer;
+        border-radius: $ibexa-border-radius;
+        margin: calculateRem(12px) calculateRem(8px) calculateRem(24px);
+        position: relative;
+
+        .ibexa-icon {
+            fill: $ibexa-color-black;
+        }
+
+        &--selected {
+            background-color: $ibexa-color-light-400;
+
+            .ibexa-icon {
+                fill: $ibexa-color-black;
+            }
+        }
+
+        &:not(:first-of-type) {
+            &:before {
+                content: '';
+                position: absolute;
+                top: calculateRem(-12px);
+                left: calculateRem(12px);
+                height: calculateRem(1.5px);
+                width: calculateRem(24px);
+                background-color: $ibexa-color-dark-200;
+            }
+        }
+
+        &:hover {
+            .ibexa-icon {
+                fill: $ibexa-color-primary;
+            }
+        }
+    }
+}
diff --git a/src/bundle/Resources/public/scss/ui/modules/universal-discovery/_tab.selector.scss b/src/bundle/Resources/public/scss/ui/modules/universal-discovery/_tab.selector.scss
index 5489d27c0f..9373d637a2 100644
--- a/src/bundle/Resources/public/scss/ui/modules/universal-discovery/_tab.selector.scss
+++ b/src/bundle/Resources/public/scss/ui/modules/universal-discovery/_tab.selector.scss
@@ -1,43 +1,3 @@
 .c-tab-selector {
-    &__item {
-        height: calculateRem(48px);
-        width: calculateRem(48px);
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        cursor: pointer;
-        border-radius: $ibexa-border-radius;
-        margin: calculateRem(12px) calculateRem(8px) calculateRem(24px);
-        position: relative;
-
-        .ibexa-icon {
-            fill: $ibexa-color-black;
-        }
-
-        &--selected {
-            background-color: $ibexa-color-light-400;
-
-            .ibexa-icon {
-                fill: $ibexa-color-black;
-            }
-        }
-
-        &:not(:first-of-type) {
-            &:before {
-                content: '';
-                position: absolute;
-                top: calculateRem(-12px);
-                left: calculateRem(12px);
-                height: calculateRem(1.5px);
-                width: calculateRem(24px);
-                background-color: $ibexa-color-dark-200;
-            }
-        }
-
-        &:hover {
-            .ibexa-icon {
-                fill: $ibexa-color-primary;
-            }
-        }
-    }
+    @include tab-selector();
 }
diff --git a/src/bundle/ui-dev/src/modules/universal-discovery/hooks/useSearchByQueryFetch.js b/src/bundle/ui-dev/src/modules/universal-discovery/hooks/useSearchByQueryFetch.js
index 264cc8b0cf..4f6397c9f7 100644
--- a/src/bundle/ui-dev/src/modules/universal-discovery/hooks/useSearchByQueryFetch.js
+++ b/src/bundle/ui-dev/src/modules/universal-discovery/hooks/useSearchByQueryFetch.js
@@ -44,6 +44,7 @@ export const useSearchByQueryFetch = () => {
             filters = {},
             fullTextCriterion = null,
             contentNameCriterion = null,
+            isBookmarked = null,
         ) => {
             const handleFetch = (response) => {
                 dispatchLoadedLocationsAction({ type: 'CLEAR_LOCATIONS' });
@@ -75,6 +76,10 @@ export const useSearchByQueryFetch = () => {
                 query.SubtreeCriterion = subtreePathString;
             }
 
+            if (isBookmarked) {
+                query.IsBookmarkedCriterion = isBookmarked;
+            }
+
             const isImageCriterionDataEmpty = !imageCriterionData || Object.keys(imageCriterionData).length === 0;
 
             if (!isImageCriterionDataEmpty) {
diff --git a/src/bundle/ui-dev/src/modules/universal-discovery/universal.discovery.module.js b/src/bundle/ui-dev/src/modules/universal-discovery/universal.discovery.module.js
index 0a96efb063..34248dc033 100644
--- a/src/bundle/ui-dev/src/modules/universal-discovery/universal.discovery.module.js
+++ b/src/bundle/ui-dev/src/modules/universal-discovery/universal.discovery.module.js
@@ -195,6 +195,7 @@ export const DropdownPortalRefContext = createContext();
 export const SuggestionsStorageContext = createContext();
 export const GridActiveLocationIdContext = createContext();
 export const SnackbarActionsContext = createContext();
+export const ImagePickerTabsConfigContext = createContext();
 
 const UniversalDiscoveryModule = (props) => {
     const { restInfo } = props;
@@ -473,112 +474,114 @@ const UniversalDiscoveryModule = (props) => {
                                         <MultipleConfigContext.Provider value={[props.multiple, props.multipleItemsLimit]}>
                                             <ContainersOnlyContext.Provider value={props.containersOnly}>
                                                 <AllowedContentTypesContext.Provider value={props.allowedContentTypes}>
-                                                    <SnackbarActionsContext.Provider value={props.snackbarEnabledActions}>
-                                                        <ActiveTabContext.Provider
-                                                            value={[activeTab, setActiveTab, previousActiveTab, props.activeTab]}
-                                                        >
-                                                            <TabsContext.Provider value={tabs}>
-                                                                <TabsConfigContext.Provider value={props.tabsConfig}>
-                                                                    <TitleContext.Provider value={props.title}>
-                                                                        <CancelContext.Provider value={props.onCancel}>
-                                                                            <ConfirmContext.Provider value={onConfirm}>
-                                                                                <SortingContext.Provider value={[sorting, setSorting]}>
-                                                                                    <SortOrderContext.Provider
-                                                                                        value={[sortOrder, setSortOrder]}
-                                                                                    >
-                                                                                        <CurrentViewContext.Provider
-                                                                                            value={[currentView, setCurrentView]}
+                                                    <ImagePickerTabsConfigContext.Provider value={props.imagePickerTabsConfig}>
+                                                        <SnackbarActionsContext.Provider value={props.snackbarEnabledActions}>
+                                                            <ActiveTabContext.Provider
+                                                                value={[activeTab, setActiveTab, previousActiveTab, props.activeTab]}
+                                                            >
+                                                                <TabsContext.Provider value={tabs}>
+                                                                    <TabsConfigContext.Provider value={props.tabsConfig}>
+                                                                        <TitleContext.Provider value={props.title}>
+                                                                            <CancelContext.Provider value={props.onCancel}>
+                                                                                <ConfirmContext.Provider value={onConfirm}>
+                                                                                    <SortingContext.Provider value={[sorting, setSorting]}>
+                                                                                        <SortOrderContext.Provider
+                                                                                            value={[sortOrder, setSortOrder]}
                                                                                         >
-                                                                                            <MarkedLocationIdContext.Provider
-                                                                                                value={[
-                                                                                                    markedLocationId,
-                                                                                                    setMarkedLocationId,
-                                                                                                ]}
+                                                                                            <CurrentViewContext.Provider
+                                                                                                value={[currentView, setCurrentView]}
                                                                                             >
-                                                                                                <GridActiveLocationIdContext.Provider
+                                                                                                <MarkedLocationIdContext.Provider
                                                                                                     value={[
-                                                                                                        gridActiveLocationId,
-                                                                                                        setGridActiveLocationId,
+                                                                                                        markedLocationId,
+                                                                                                        setMarkedLocationId,
                                                                                                     ]}
                                                                                                 >
-                                                                                                    <LoadedLocationsMapContext.Provider
+                                                                                                    <GridActiveLocationIdContext.Provider
                                                                                                         value={[
-                                                                                                            loadedLocationsMap,
-                                                                                                            dispatchLoadedLocationsAction,
+                                                                                                            gridActiveLocationId,
+                                                                                                            setGridActiveLocationId,
                                                                                                         ]}
                                                                                                     >
-                                                                                                        <RootLocationIdContext.Provider
-                                                                                                            value={props.rootLocationId}
+                                                                                                        <LoadedLocationsMapContext.Provider
+                                                                                                            value={[
+                                                                                                                loadedLocationsMap,
+                                                                                                                dispatchLoadedLocationsAction,
+                                                                                                            ]}
                                                                                                         >
-                                                                                                            <SelectedLocationsContext.Provider
-                                                                                                                value={[
-                                                                                                                    selectedLocations,
-                                                                                                                    dispatchSelectedLocationsAction,
-                                                                                                                ]}
+                                                                                                            <RootLocationIdContext.Provider
+                                                                                                                value={props.rootLocationId}
                                                                                                             >
-                                                                                                                <CreateContentWidgetContext.Provider
+                                                                                                                <SelectedLocationsContext.Provider
                                                                                                                     value={[
-                                                                                                                        createContentVisible,
-                                                                                                                        setCreateContentVisible,
+                                                                                                                        selectedLocations,
+                                                                                                                        dispatchSelectedLocationsAction,
                                                                                                                     ]}
                                                                                                                 >
-                                                                                                                    <SuggestionsStorageContext.Provider
+                                                                                                                    <CreateContentWidgetContext.Provider
                                                                                                                         value={[
-                                                                                                                            suggestionsStorage,
-                                                                                                                            setSuggestionsStorage,
+                                                                                                                            createContentVisible,
+                                                                                                                            setCreateContentVisible,
                                                                                                                         ]}
                                                                                                                     >
-                                                                                                                        <ContentOnTheFlyDataContext.Provider
+                                                                                                                        <SuggestionsStorageContext.Provider
                                                                                                                             value={[
-                                                                                                                                contentOnTheFlyData,
-                                                                                                                                setContentOnTheFlyData,
+                                                                                                                                suggestionsStorage,
+                                                                                                                                setSuggestionsStorage,
                                                                                                                             ]}
                                                                                                                         >
-                                                                                                                            <ContentOnTheFlyConfigContext.Provider
-                                                                                                                                value={
-                                                                                                                                    props.contentOnTheFly
-                                                                                                                                }
+                                                                                                                            <ContentOnTheFlyDataContext.Provider
+                                                                                                                                value={[
+                                                                                                                                    contentOnTheFlyData,
+                                                                                                                                    setContentOnTheFlyData,
+                                                                                                                                ]}
                                                                                                                             >
-                                                                                                                                <EditOnTheFlyDataContext.Provider
-                                                                                                                                    value={[
-                                                                                                                                        editOnTheFlyData,
-                                                                                                                                        setEditOnTheFlyData,
-                                                                                                                                    ]}
+                                                                                                                                <ContentOnTheFlyConfigContext.Provider
+                                                                                                                                    value={
+                                                                                                                                        props.contentOnTheFly
+                                                                                                                                    }
                                                                                                                                 >
-                                                                                                                                    <SearchTextContext.Provider
+                                                                                                                                    <EditOnTheFlyDataContext.Provider
                                                                                                                                         value={[
-                                                                                                                                            searchText,
-                                                                                                                                            setSearchText,
+                                                                                                                                            editOnTheFlyData,
+                                                                                                                                            setEditOnTheFlyData,
                                                                                                                                         ]}
                                                                                                                                     >
-                                                                                                                                        <DropdownPortalRefContext.Provider
-                                                                                                                                            value={
-                                                                                                                                                dropdownPortalRef
-                                                                                                                                            }
+                                                                                                                                        <SearchTextContext.Provider
+                                                                                                                                            value={[
+                                                                                                                                                searchText,
+                                                                                                                                                setSearchText,
+                                                                                                                                            ]}
                                                                                                                                         >
-                                                                                                                                            <Tab />
-                                                                                                                                        </DropdownPortalRefContext.Provider>
-                                                                                                                                    </SearchTextContext.Provider>
-                                                                                                                                </EditOnTheFlyDataContext.Provider>
-                                                                                                                            </ContentOnTheFlyConfigContext.Provider>
-                                                                                                                        </ContentOnTheFlyDataContext.Provider>
-                                                                                                                    </SuggestionsStorageContext.Provider>
-                                                                                                                </CreateContentWidgetContext.Provider>
-                                                                                                            </SelectedLocationsContext.Provider>
-                                                                                                        </RootLocationIdContext.Provider>
-                                                                                                    </LoadedLocationsMapContext.Provider>
-                                                                                                </GridActiveLocationIdContext.Provider>
-                                                                                            </MarkedLocationIdContext.Provider>
-                                                                                        </CurrentViewContext.Provider>
-                                                                                    </SortOrderContext.Provider>
-                                                                                </SortingContext.Provider>
-                                                                            </ConfirmContext.Provider>
-                                                                        </CancelContext.Provider>
-                                                                    </TitleContext.Provider>
-                                                                </TabsConfigContext.Provider>
-                                                            </TabsContext.Provider>
-                                                        </ActiveTabContext.Provider>
-                                                    </SnackbarActionsContext.Provider>
+                                                                                                                                            <DropdownPortalRefContext.Provider
+                                                                                                                                                value={
+                                                                                                                                                    dropdownPortalRef
+                                                                                                                                                }
+                                                                                                                                            >
+                                                                                                                                                <Tab />
+                                                                                                                                            </DropdownPortalRefContext.Provider>
+                                                                                                                                        </SearchTextContext.Provider>
+                                                                                                                                    </EditOnTheFlyDataContext.Provider>
+                                                                                                                                </ContentOnTheFlyConfigContext.Provider>
+                                                                                                                            </ContentOnTheFlyDataContext.Provider>
+                                                                                                                        </SuggestionsStorageContext.Provider>
+                                                                                                                    </CreateContentWidgetContext.Provider>
+                                                                                                                </SelectedLocationsContext.Provider>
+                                                                                                            </RootLocationIdContext.Provider>
+                                                                                                        </LoadedLocationsMapContext.Provider>
+                                                                                                    </GridActiveLocationIdContext.Provider>
+                                                                                                </MarkedLocationIdContext.Provider>
+                                                                                            </CurrentViewContext.Provider>
+                                                                                        </SortOrderContext.Provider>
+                                                                                    </SortingContext.Provider>
+                                                                                </ConfirmContext.Provider>
+                                                                            </CancelContext.Provider>
+                                                                        </TitleContext.Provider>
+                                                                    </TabsConfigContext.Provider>
+                                                                </TabsContext.Provider>
+                                                            </ActiveTabContext.Provider>
+                                                        </SnackbarActionsContext.Provider>
+                                                    </ImagePickerTabsConfigContext.Provider>
                                                 </AllowedContentTypesContext.Provider>
                                             </ContainersOnlyContext.Provider>
                                         </MultipleConfigContext.Provider>
@@ -633,6 +636,13 @@ UniversalDiscoveryModule.propTypes = {
         instanceUrl: PropTypes.string,
     }),
     snackbarEnabledActions: PropTypes.array,
+    imagePickerTabsConfig: PropTypes.objectOf(
+        PropTypes.shape({
+            id: PropTypes.string.isRequired,
+            priority: PropTypes.number.isRequired,
+            hidden: PropTypes.bool.isRequired,
+        }),
+    ),
 };
 
 UniversalDiscoveryModule.defaultProps = {
@@ -649,6 +659,7 @@ UniversalDiscoveryModule.defaultProps = {
     selectedLocations: [],
     restInfo: defaultRestInfo,
     snackbarEnabledActions: Object.values(SNACKBAR_ACTIONS),
+    imagePickerTabsConfig: {},
 };
 
 export default UniversalDiscoveryModule;